Введення у веб-розробку
  • Передмова
  • Починаємо
    • Вступ
    • TCP/IP протокол
    • HTTP
    • Веб-браузер
    • Веб-сервер
    • Cookies
    • Фронтенд і бекенд
    • Фреймворки
    • Редактори коду
    • Emmet
  • Git
    • Короткий опис
    • Базові Git-команди
  • HTML
    • Короткий опис
    • Теги і атрибути
    • Структура HTML-документу
    • HTML-файли
  • CSS
    • Короткий опис
    • Додавання CSS до HTML-документу
    • CSS-препроцесори
  • JavaScript
    • Короткий опис
    • Що таке ECMAScript?
    • Document Object Model
    • AJAX, JSON
    • Інструменти для збірки
    • Node.js
    • npm
  • PHP
    • Короткий опис
    • Середовище для розробки
  • MySQL
    • Короткий опис
    • Інструменти управління базами даних
  • MongoDB
    • Короткий опис
    • MongoDB shell
    • MongoDB GUI
    • Вибірка і сортування
    • Індекси
  • Linux
    • Короткий опис
  • Windows
    • Windows 10 підсистема для Linux
    • Chocolatey
    • Покращена консоль
  • Що далі?
    • Фронтенд
    • Бекенд
Powered by GitBook
On this page
  • Текстові редактори
  • IDE
  1. Починаємо

Редактори коду

PreviousФреймворкиNextEmmet

Last updated 2 years ago

В чому писати код? Відповідь завжди суб'єктивна. Є чимало хороших варіантів і з часом ви підберете той редактор, який буде найзручнишим для вас. Але перед цим слід уточнити, що умовно редактори можна поділити на текстові редактори і IDE (англ. Integrated Development Environment).

В той час як перші є легкими, другі (наприклад, Eclipse, NetBeans або Aptana Studio) — важкі, вимогливі до ресурсів, проте мають значно більше корисних функцій.

Вимоги до сучасного редактора коду

  • Підсвічування синтаксису мови програмування, на якій ви пишете код.

  • Підказки коду, авто-завершення.

  • Можливість відлагоджувати код (англ. debugging).

  • Розширюваність за допомогою плагінів.

  • Можливість працювати з Git (або іншою системою керування версіями файлів).

  • Підтримка препроцесорів, якщо ви їх використовуєте (Less/Sass тощо).

  • Наявність вбудованого FTP-клієнта, SSH тощо.

Нижче в алфавітному порядку наведено невеличкий список сучасних редакторів коду.

Текстові редактори

Atom від GitHub

позиціонують, як текстовий редактор, створений для потреб сучасних розробників. Завдяки відкритому API має чимало послідовників та силу-силенну плагінів. Atom — безкоштовний і працює на Windows, Mac OS та Linux.

Atom від GitHub

Brackets від Adobe

З цікавих особливостей Brackets можна зазначити:

  • попередній перегляд (англ. Live Preview), який дозволяє в реальному часі бачити CSS та HTML зміни в браузері;

  • швидке редагування CSS одразу в HTML коді.

Рис. Швидке редагування CSS одразу в HTML коді (комбінація клавіш Ctrl + E у Windows).

Notepad++

Sublime Text (частково платний)

Visual Studio Code від Microsoft

IDE

Aptana Studio

Netbeans

IDE від JetBrains (платні WebStorm, PhpStorm тощо)

зосереджений на потребах веб-дизайнерів з вбудованою підтримкою HTML, CSS та JavaScript. Brackets — безкоштовний, легкий у використанні, швидкий і має багато додаткових плагінів. Працює на Windows, Mac OS та Linux.

Brackets від Adobe
Швидке редагування CSS одразу в HTML коді в Brackets

— безкоштовний, невимогливий до ресурсів і дуже швидкий редактор коду, який, щоправда, доступний лише для Windows. Даний редактор призначений для тих, хто полюбляє простий інтерфейс. Базовий функціонал Notepad++ можна доповнювати за допомогою плагінів.

Notepad++

— це надзвичайно потужний текстовий редактор для коду, який можна розширити за допомогою плагінів. Вам сподобається його витончений інтерфейс, набір корисних функцій та вражаюча продуктивність. Редактор платний, але нема обмеження на те, як довго ви можете використовувати пробну версії. Sublime Text доступний на Windows, Mac OS та Linux.

Sublime Text

— це текстовий редактор із відкритим кодом, який працює на всіх основних платформах — Windows, Mac OS і Linux. За допомогою розширень можна додати новий функціонал, тему до вподоби тощо.

Visual Studio Code від Microsoft

Сайт:

Сайт:

Сайт:

Brackets
Notepad++
Sublime Text
Visual Studio Code
http://www.aptana.com/
https://netbeans.org/
https://www.jetbrains.com/
Atom