Настройка PHPStorm для html-вёрстки

Для настройки работы Zen Coding (Live Coding) в php (раскрытия сокращений) необходимо в настройках плагина (Settings -> Live Templates -> ZenHTML) у каждого пункта отметить требуемый формат файлов, нажав на ссылку «Change».

Настройка работы Zen Coding в Storm

Ещё я долго мучился с распознаванием php-файлов (PHPStorm открывал их как простой текст). Идём в настройки типов файлов (Settings -> File Types), в колонке Recognized File Types находим PHPfiles и добавляем нужное расширение (в моём случае *.php) в колонку Registered Patterns. Аналогичные действия надо выполнить при работе с php-файлами, имеющими иные расширения (например при работе с Drupal).

Отображение номера строки по умолчанию:
Settings (Ctrl+Alt+S) -> Editor -> Appearance -> Show Line Numbers
Далее плюшки:

Настройка jQuery API документации в PHPStorm и WebStorm

Поддержка Symfony Command Line
Установка полного русского словаря для проверки орфографии
Как подключить JetBrains PhpStorm к Redmine

Дополнительно
Карта «горячих» клавиш в PHPStorm

Субъективные мысли о БЭМ

Все, сказанное ниже, мои мысли о методе БЭМ, разработанном ребятами из Яндекса.

БЭМ — технология для большого количества больших страниц. Но не используйте её для простых проектов. Воздержитесь от БЭМ если вы фрилансер. Хорошенько разберитесь в сути метода, перед его применением.

Неграмотное использование метода приведёт только лишь к захламлению. Работать с «псевдо БЭМ» документами очень тяжело.

В кратце, суть БЭМ в обращении к элементам только по имени класса и полный отказ от доступа по цепочке элементов.

// правильно
<div class="name-block">
  <div class="name-block-inner">
    <b class="name-block-inner-b"></b>
  </div>
</div>

// неправильно
<div class="name-block">
  <div>
    <b></b>
  </div>
</div>
// правильно
.name-block {}
.name-block-inner {}
.name-block-inner-b {}

// неправильно
.name-block {}
.name-block div {}
.name-block div b {}

Что можно почерпнуть из БЭМ:

  • Именование классов: например, имеем родительский класс с именем form, тогда все имена классов вложенных в него и логически связанных с ним элементов удобно начинать с префикса f_.
  • Отказ от вложенных селекторов в CSS (доступ по имени класса): это делает проект более гибким, позволяя быстро перемещать, компоновать или видоизменять элементы страницы.
  • Модификаторы: позволяют менять внешний вид элементов, подстраивая его под конкретную ситуацию.

Минусы:

  • Захламлённость HTML-файла: имена классов получаются внушительной длины плюс такие же модификаторы. В итоге код превращается в кашу.

Плюсы:

  • Высокая скорость рендеринга страницы.
  • Гибкость клиентской части проекта

Update
В Internet Explorer 6 :hover эффект поддерживается только для ссылок. Например, имея конструкцию вида:

<a href="..." class="b-link__class-name">
    <span class="b-link__class-name-text">Some text</span>
</a>

где к ссылке добавляется фоновое изображение, текст ссылки должен быть подчёркнут, но изображение должно быть вне подчёркивания.
Обработку :hover, в этом случае, следует назначить ссылке:

.b-link__class-name:hover .b-link__class-name-text {
    text-decoration: none;
}

такое противоречит идеологии БЭМ т.к. присутствует вложенность селекторов, а, следовательно, верная запись будет выглядеть так:

.b-link__class-name-text:hover {
    text-decoration: none;
}

Этот вариант, однако, не работает в IE6.

Простая отправка формы по ENTER

Любая форма в любом браузере отправляется по нажатию кнопки enter если в этой форме есть кнопка типа submit или image:

<form name="#" action="#" method="post">
    <input type="text" name="text" />
    <input type="submit" />
</form>

При этом кнопка submit может быть не видима для пользователя (display: none;).

Пример.

Самый лучший jQuery-плагин :)

Создал самый лучший в мире плагин для jQuery — theBestPlugin.

Очень легко подключается. Имеет множество настроек и очень сильно расширяем. Есть некоторые проблемы с кастомизацией, но в README.txt всё подробно описано.
Совместим с любой версией jQuery. Работает во всех браузерах. На 100% подходит любому проекту.

Подробности на гитхабе.

Update: Ошеломляющий интерес к проекту практически мгновенно привёл к улучшению самого лучшего плагина. Спасибо комментаторам!

Вещи, которые надо помнить о GIT на Windows

1. Создавай алиасы:

git config alias.ci commit
git config alias.co checkout
git config alias.br branch
git config alias.sh stash
git config alias.st status

Это в разы упрощает и ускоряет работу.

2. Устанавливай git для работы с консолью
Зачастую, работа с консолью удобнее работы через графический интерфейс.

3. Добавляй свой логин к url репозитория: user@host/repo
Чтобы не вводить его каждый раз при обращении к серверу (fetch, pull).

4. Создай переменные окружения HOME = %USERPROFILE%\ и GIT_SSH = {TortoiseGit install dir}\TortoisePlink.exe
Чтобы работать через консоль.

5. Имя домашней директории пользователя должно быть на английском
Опять же важно для работы с консолью.

6. Проверь наличие директории .ssh в домашней директории. Если её нет — создай и положи туда публичный ключ
В этой директории должен лежать приватный ключ с именем id_rsa или id_rsa.ppk

7. Укажи настройки в конфигах:

git config --global user.name "ваше имя"
git config --global user.email "ваша почта"
git config --global core.autocrlf true
git config --global core.safecrlf true

UPD: кто бы мог подумать, но последние две записи лучше делать ложными

autocrlf = false
symlinks = false

Подробнее: http://jenyay.net/Git/Autocrlf

8. Почитай литературу:
http://dbanck.de/2009/10/08/github-windows-and-tortoisegit-part-1-installing-pulling/
http://habrahabr.ru/blogs/Git/125799/
http://githowto.com/