Опубликовано автор в категориях Верстальщику, Полезности.

Здравствуйте. Сегодня я хотел бы поделится с вами инструментами, которые помогают мне работать более продуктивно, как верстальщику и фрилансеру. Без лишних вступлений перейду сразу к делу.

1. XRefresh

XRefresh — это плагин для браузера, который производит обновление текущей веб-страницы после изменения файлов в отдельных папках. Это значительно упрощает процесс верстки страниц. Теперь больше не нужно постоянно наживать F5!!!

Плагин состоит из двух небольших приложений. Первое — инсталлируется на компьютере и является по сути  монитором событий, который «висит» в трее системы. Вторая часть — это либо интегрируемый в FireBug плагин (если вы работаете с Firefox), либо  тулбар для Internet Explorer.

Для работы с приложением нужно сначала запусти десктопный агент, который покажется на панели задач в трее. После этого в настройка агента указать папки которые нужно мониторить на предмет изменения файлов. Далее вам нужно открыть нужную страницу в браузере, при этом, если вы все настроили верно, агент в трее сменит цвет с серого на зеленый, и после можете спокойно править файлы, страница в браузере должна обновляться автоматически. Для более детальных инструкций можно посетить  сайт разработчика, или посмотреть видео ниже:

Zen Coding

ZenCodingZen 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>

И это только цветочки. Установите плагин к своему редактору и вы будете приятно удивлены. Кстати, на сегодня эту мега-штуку можно использовать во многих редакторах.

Официально поддерживаемые редакторы:

  1. Aptana/Eclipse (crossplatform)
  2. TextMate (Mac)
  3. Coda (Mac)
  4. Espresso (Mac)
  5. Komodo Edit/IDE (crossplatform)
  6. Notepad++ (Windows)
  7. PSPad (Windows)
  8. <textarea> (browser-based)
  9. editArea (browser-based)

Неофициальная поддержка редакторов:

  1. Dreamweaver (Windows, Mac)
  2. Sublime Text (Windows)
  3. UltraEdit (Windows)
  4. TopStyle (Windows)
  5. GEdit (crossplatform)
  6. BBEdit/TextWrangler (Mac)
  7. Visual Studio (Windows)
  8. EmEditor (Windows)
  9. Sakura Editor (Windows)
  10. NetBeans (crossplatform)
  11. IntelliJ IDEA/WebStorm/PHPStorm (crossplatform)
  12. Emacs (crossplatform)
  13. Vim (crossplatform)
  14. ReSharper plugin for Visual Studio

В общем, пробуйте и не пожалеете.

И как же без него?

С возрастом человек понимает, что «построить дом» — это не просто часть известной народной мудрости. Построить дом — это наука и искусство. Для того чтобы преуспеть в этом вам нужно иметь лучшие материалы, например, красивая плитка под мозаику сделает ваш дом оригинальным и необычным.Недвижимость Краснодара и края. Книга про стоимость недвижимости в краснодаре.

11 комментариев к записи “Парочка инструментов для того, чтобы работать быстрее”

  1. Andrei

    Вернулся второй раз на блог и прописал его в своих закладках , полезно учиться на опыте других. Сам использую Джумлу , есть свой пакет что обязательно инсталлирую по умолчанию.

    Ответить
  2. eavasi

    Огромное спасибо за эти две приблуды. Ни об одной из них даже не слышал раньше. Уверен, теперь с ними будет значительно удобнее работать!!!!

    Ответить
  3. Dem

    Поставил себе Zen на DW, штука крайне удобная, только надо привыкнуть к комбинациям клавиш.
    Спасибо за полезный пост 🙂

    Ответить
  4. Виталий

    А у тебя получилось настроить отступы вложенных тегов в DW версии Zen Coding, чтобы отступы были не в виде двух пробелов, а в виде табуляции или четырех пробелов?

    Ответить
    • hiway

      Чувак. У меня работает как надо по дефолту от настроек проекта. Кстати, отступы в виде двух пробелов многие вебмастера считают более приемлемыми. Например, два пробела считаются стандартов в отступах при кодировании под Drupal. я думаю переходить именно к двум пробелам

      Ответить
  5. Виталий

    вроде нашел какую настройку дернуть нужно. у меня стоял этот плагин, но активно его не использовал, будет попытка №2 🙂

    Ответить
  6. Юрий

    Есть ещё одна полезная вещь — Fixie.js — генератор Lorem ipsum’a.
    Например, пишем несколько пустых тегов — p, ul, div, и т.д.
    Присваиваем класс .fixie целевому контейнеру или body, и эти пустые теги заполнятся Lorem ipsum’ом.

    Ответить

Оставить комментарий

  • (не будет показан)