Здравствуйте. Сегодня я хотел бы поделится с вами инструментами, которые помогают мне работать более продуктивно, как верстальщику и фрилансеру. Без лишних вступлений перейду сразу к делу.
1. XRefresh
XRefresh — это плагин для браузера, который производит обновление текущей веб-страницы после изменения файлов в отдельных папках. Это значительно упрощает процесс верстки страниц. Теперь больше не нужно постоянно наживать F5!!!
Плагин состоит из двух небольших приложений. Первое — инсталлируется на компьютере и является по сути монитором событий, который «висит» в трее системы. Вторая часть — это либо интегрируемый в FireBug плагин (если вы работаете с Firefox), либо тулбар для Internet Explorer.
Для работы с приложением нужно сначала запусти десктопный агент, который покажется на панели задач в трее. После этого в настройка агента указать папки которые нужно мониторить на предмет изменения файлов. Далее вам нужно открыть нужную страницу в браузере, при этом, если вы все настроили верно, агент в трее сменит цвет с серого на зеленый, и после можете спокойно править файлы, страница в браузере должна обновляться автоматически. Для более детальных инструкций можно посетить сайт разработчика, или посмотреть видео ниже:
Zen Coding
Zen Coding — ахренительная вещь! Это мега штука которая позволяет значительно уменьшить время, которое мы затрачиваем на написание кода.
Если соединить специфику CSS селекторов с HTML разметкой, то получится Zen Coding. Конечно, я был не единственным, чья челюсть отвисла когда он впервые увидел эту штуку.
Смотрите сами:
Пишем:
div#container>div#contents>ul#nav>li*4
Получаем:
<div id="container">
<div id="contents">
<ul id="nav">
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
</div>
</div> |
И это только цветочки. Установите плагин к своему редактору и вы будете приятно удивлены. Кстати, на сегодня эту мега-штуку можно использовать во многих редакторах.
Официально поддерживаемые редакторы:
- Aptana/Eclipse (crossplatform)
- TextMate (Mac)
- Coda (Mac)
- Espresso (Mac)
- Komodo Edit/IDE (crossplatform)
- Notepad++ (Windows)
- PSPad (Windows)
- <textarea> (browser-based)
- editArea (browser-based)
Неофициальная поддержка редакторов:
- Dreamweaver (Windows, Mac)
- Sublime Text (Windows)
- UltraEdit (Windows)
- TopStyle (Windows)
- GEdit (crossplatform)
- BBEdit/TextWrangler (Mac)
- Visual Studio (Windows)
- EmEditor (Windows)
- Sakura Editor (Windows)
- NetBeans (crossplatform)
- IntelliJ IDEA/WebStorm/PHPStorm (crossplatform)
- Emacs (crossplatform)
- Vim (crossplatform)
- ReSharper plugin for Visual Studio
В общем, пробуйте и не пожалеете.
И как же без него?
С возрастом человек понимает, что «построить дом» — это не просто часть известной народной мудрости. Построить дом — это наука и искусство. Для того чтобы преуспеть в этом вам нужно иметь лучшие материалы, например, красивая плитка под мозаику сделает ваш дом оригинальным и необычным.Недвижимость Краснодара и края. Книга про стоимость недвижимости в краснодаре.
Andrei
Вернулся второй раз на блог и прописал его в своих закладках , полезно учиться на опыте других. Сам использую Джумлу , есть свой пакет что обязательно инсталлирую по умолчанию.
eavasi
Огромное спасибо за эти две приблуды. Ни об одной из них даже не слышал раньше. Уверен, теперь с ними будет значительно удобнее работать!!!!
Dem
Поставил себе Zen на DW, штука крайне удобная, только надо привыкнуть к комбинациям клавиш.
Спасибо за полезный пост 🙂
Виталий
А у тебя получилось настроить отступы вложенных тегов в DW версии Zen Coding, чтобы отступы были не в виде двух пробелов, а в виде табуляции или четырех пробелов?
hiway
Чувак. У меня работает как надо по дефолту от настроек проекта. Кстати, отступы в виде двух пробелов многие вебмастера считают более приемлемыми. Например, два пробела считаются стандартов в отступах при кодировании под Drupal. я думаю переходить именно к двум пробелам
Виталий
т.е. у тебя ставится именно табуляция или четыре пробела?
Виталий
вроде нашел какую настройку дернуть нужно. у меня стоял этот плагин, но активно его не использовал, будет попытка №2 🙂
Сергей
Кстати, браузер Midori из-под коробки обновляет измененные страницы 🙂
FlexZERO
Спасибо за Zen Coding ! Если бы узнал о нем раньше, то сэкономил бы кучу времени.
Юрий
Есть ещё одна полезная вещь — Fixie.js — генератор Lorem ipsum’a.
Например, пишем несколько пустых тегов — p, ul, div, и т.д.
Присваиваем класс .fixie целевому контейнеру или body, и эти пустые теги заполнятся Lorem ipsum’ом.
Hiway
Спасибо, но я использую Aptana Studio в работе + Zen Coding, и все это как бы имеется.