Поиск

NodeJS

http://jsman.ru/express/ — подробно про MVC-фреймворк Express.

Обработка изображений

http://clippingmagic.com — Убрать фон с изображения.

Регулярные выражения

http://www.rubular.com/ — Простое и быстрое тестирование регулярных выражений. Ничего лишнего.

http://gskinner.com/RegExr/ — Когда требуется по регулярному выражению заменить исходный текст. Плюс есть множество готовых примеров регулярок.

Форматирование и валидация кода

http://jsbeautifier.org/ — Красиво форматирует с переносами исходный код. Просто и удобно.

http://jsonlint.com/ — Валидатор JSON. При валидации еще и форматирует его.

Верстка HTML/CSS

http://htmlbook.ru/ — Крайне полезный сайт для начинающих верстальщиков или если вы что-то забыли. Удобный каталог тэгов и правил с подробным описанием и примерами.

Дизайн

https://kuler.adobe.com/ — Сочетание цветов от Adobe.

Регистрация доменов/Хостинг

https://2domains.ru — Дешевая регистрация доменов. Страница логина

Схемы и аналитика

https://www.draw.io/ — Удобная рисовалка схем онлайн (онлайн аналог Visio). Есть возможность связать ее с Google Drive.

Системы контроля версий

http://git-scm.com/book/ru — книга про git.

http://www.yearofmoo.com/2011/04/minify-css-and-js-with-git-hooks.html — хуки в git’е для минификации css и js.

Backbone

https://github.com/AlexFadeev/backbone-fundamentals — Перевод книги Addy Osmani о Backbone.

Профайлинг в Google Chrome

http://habrahabr.ru/post/149053/ — По-русски.

https://developers.google.com/chrome-developer-tools/docs/heap-profiling — От Google’а.

Управление командой

http://lean-lead.blogspot.ru — «записки тимлида». Хороший блог, можно почерпнуть много интересного.

QA

http://testitquickly.com/2009/09/09/vvodeste-loginu-la-adnaklassni6i/ — тестирование регистрации/логина.

Python

http://www.ibm.com/developerworks/library/l-cpmod/index.html — создание документации через pydoc.

AngularJS

http://angular.ru — документация по angularjs на русском языке.

Надо
1. Использовать старый код вставки с ютюба (Use old embed code)
2. Вставить в EMBED wmode=”opaque”
3. Добавить в object

Увы, приходится иногда использовать и хаки - сложная не своя верстка, в которой нет времени разбираться, например…

У оперы хаки от версии к версии меняются, поэтому можно в css написать для нее как основы, а остальных поправить хаками (если требуется).

/* firefox */
@-moz-document url-prefix() {
    .myclass {
        font-size:16px;
    }
    /* ... */
}
/* chrome и safari */
@media all and (-webkit-min-device-pixel-ratio:0) {
    .myclass {
        font-size: 18px;
    }
    /* ... */
}

Для Internet Explorer - самое удобное. Подход называется “Conditional comments”. См. пример:

<!--[if IE]>
Special instructions for IE here
<![endif]-->

Внутри можно, например, подключить css, которая выполнится только в IE:

<!--[if IE]>
<link rel="stylesheet" type="text/css" href="/css/ie.css">
<![endif]-->

Также, можно указывать версию IE:

<!--[if IE 6]> <![endif]-->
<!--[if IE 7]> <![endif]-->
<!--[if IE 8]> <![endif]-->

Или указывать версию больше или меньше:
gt: больше, чем.
lt: меньше, чем.
Если добавляется “e”, то еще и равно значению

<!--[if gt IE 6]>Больше 6-ого<![endif]-->
<!--[if lte IE 7]>Седьмой или меньше<![endif]-->

И помните, хаки - плохой выход.

<p>Обнаружил такую проблему: <a title=”Cufon” href="https://github.com/sorccu/cufon” target=”_blank” rel=”noopener”>Cufon</a> (заменитель шрифтов, см. <a title=”Cufón – используйте шрифты, какие душа пожелает” href=”http://habrahabr.ru/post/61033/" target=”_blank” rel=”noopener”>здесь</a> и <a title=”Нестандартный шрифт средствами js” href=”http://www.marketer.ru/adv/production/dizajn/tipografika/cufon-nestandartnyj-shrift-sredstvami-js/" target=”_blank” rel=”noopener”>здесь</a>) прекрасно менял все шрифты, цвета и т.п. Но в одном месте ни в какую не хотел изменять цвет шрифта при наведении (:hover).<br />Оказалось, что если ссылка, которая должна hover’иться, находится внутри другого блока текста, который уже обработан Cufon’ом, то она не сможет изменить цвет (!), border и некоторые другие свойства будут меняться без проблем.<br />Итак, ниже показываю, в каких случаях hover’а не происходит, а в каких происходит (в коде все понятно). Либо можно скачать <a href=”/media/uploads/2018/11/09/cufon-test.zip” target=”_blank” rel=”noopener”>архив, вместе со шрифтами</a>, и самому посмотреть.</p>

<!doctype html>
<html>
<head>
<script type="text/javascript" src="test/jquery00.js"></script>
<script type="text/javascript" src="test/cufon-yu.js"></script>
<script type="text/javascript" src="test/Plumb_20.js"></script>
<style>
a, a:link, a:visited { color : #0000cc; }
</style>
</head>
<body>
<div class="example">Lorem <a href="#" class="ahref">Ссылка, вложенная в другой элемент с Cufon'ом, обработка сначала внешнего блока, потом ссылки [hover'а нет]</a> ipsum</div>
<div class="example2"><span class="example">Lorem</span> <a href="#" class="ahref">Ссылка, не вложенная в элемент с Cufon'ом, внутри текста</a> <span class="example">ipsum</span></div>
<div class="example2">Lorem <a href="#" class="ahref">Ссылка, вложенная в другой элемент с Cufon'ом, обработка сначала ссылки, потом внешнего блока</a> ipsum</div>
<div class="example2">Lorem <a href="#">Ссылка без явного указания класса [hover'а нет]</a> ipsum</div>
<a class="ahref" href="#" >Ссылка, не вложенная в другие элементы, которые обрабатываются Cufon'ом</a></p>
<p><script type="text/javascript">
Cufon('.example');
Cufon('.ahref', {
color: '#0000cc',
hover: true,
hover: {
color: '#ccc'
}
});
Cufon('.example a', {
color: '#0000cc',
hover: true,
hover: {
color: '#ccc'
}
});
Cufon('.example2');
</script>
</body>
</html>