WebDesign Master
Курсы
Настройка Sublime Text 3 для веб-разработки: LiveReload, плагины, фишки
Инструменты

Настройка Sublime Text 3 для веб-разработки: LiveReload, плагины, фишки

Сегодня мы рассмотрим настройку популярного редактора кода Sublime Text 3 для веб-разработки.

Поделиться
Твитнуть
Поделиться
Класснуть
Запинить
Настройка Sublime Text 3 для веб-разработки: LiveReload, плагины, фишки - Видеоурок
Смотреть урок на YouTube
Создание контентного сайта на Jekyll от А до Я
Внимание! Вышла более новая версия руководства.
С новым материалом вы можете ознакомиться Здесь.

Плагины

emmet - плагин для скоростной верстки.

livereload - автообновление страницы.

Для корректной работы плагина LiveReload в Sublime Text 3 необходимо дописать в пользовательских настройках плагина следующую конструкцию (подробнее в видео):

{
	"enabled_plugins": [
		"SimpleReloadPlugin",
		"SimpleRefresh"
	]
}

sass - настроим корректную подсветку SASS в Sublime Text 3.

jade - HTML препроцессор.

gist - плагин для быстрого доступа к вашим сниппетам на GitHub.

brackethighlighter - подсветка скобок, тегов в Sublime Text 3.

autofilename - автокомплит для подключения внешних файлов в верстку.

colorhighlighter - подсветка цвета.

BufferScroll - сохранение позиции курсора в документе.

Goto-CSS-Declaration - плагин для быстрого поиска соответствующего класса в CSS, SASS, LESS.

Фишки

  • Поменяем тему на twilight.
  • Научимся множественному выделению.
  • Назначим клавиши для события reindent (хоткей для автоматического формата документа).
  • Научимся управлять числовыми значениями (Инкремент и Декремент).

Полезные ссылки

Sublime Text: https://sublimetext.com

Sublime Text 3 Package Control: https://packagecontrol.io/installation

LiveReload Browser Extension: http://livereload.com/extensions/

Sublime Text 3 Live Reload Plugin: https://packagecontrol.io/packages/LiveReload

Премиум уроки от WebDesign Master

Курс по созданию сайта от А до Я на Jekyll

Создание сайта от А до Я. Комплексный курс

Курс по созданию интернет-магазина на OpenCart

Создание современного интернет-магазина от А до Я

Фриланс для начинающих

Я - фрилансер! Базовый курс для начинающих

Другие уроки по теме «Инструменты»

  • Gulp include на стороне сервера Browsersync + Build
  • OptimizedHTML 5: Важные обновления стартера для JS-разработки
  • Gulp 4 - Актуальное и исчерпывающее руководство для самых маленьких
  • Актуальный способ установки и настройки окружения Windows WSL 2 (Windows Subsystem for Linux)
  • PageSpeed Insights - Оптимизация (обновление)
  • October CMS - Первое знакомство

Разделы сайта:

  • Курсы
  • HTML и CSS
  • Веб-дизайн
  • Инструменты
  • Оффтоп
  • MODx
  • WordPress
  • jQuery
  • Адаптивный веб-дизайн
  • Создание иконок
  • Обработка изображений
  • Иллюстрации и Инфографика
  • Интерфейсы UI/UX
  • Прототипирование
  • JavaScript
  • Хостинг

Полезные ресурсы:

  • Lazy Load Placeholder
  • Документация Gulp 4
  • Рабочее место разработчика
2021 © WebDesign Master