Эту статью я разделю на две логических части: инструментарий и окружение. В каждой из частей я напишу что понадобится для работы и как подготовить окружение для последующей разработки. Всё, что будет описано — актуально для Mac, но на других системах по сути будет мало чем отличаться.
Приступим!
Подготовка инструментов
Основным инструментом для меня сейчас является некоммерческий редактор Visual Studio Code. Это достаточно мощный и настраиваемый редактор, который работает на всех операционных системах. Он поддерживает массу удобных расширений (Extensions). Используемый мною список я приведу ниже.
Для начала нужно установить VSC (Visual Studio Code), скачайте по ссылке выше и установите как обычно.
Затем можно перейти к установке расширений, для этого запустите редактор. Нужные расширения устанавливаются прямо из интерфейса редактора. Для установки нужно на левой панели редактора нажать кнопку работы с расширениями.
Нам понадобятся два основных расширения, для их установки следует в поле ввода (сверху, в котором написано «Search Extensions in Marketplace») набрать название и после успешного поиска нажать кнопку «Install».
Что ищем и устанавливаем:
- Live Server (автор: HookyQR) — будет отображать все изменения, сделанные на странице моментально, сразу после их сохранения. Не обязательно будет перезагружать страницу в браузере руками.
- Latest TypeScript and Javascript Grammar (автор: Microsoft) — последние правила подсветки синтаксиса.
Конечно самым основным инструментом будет браузер и использовать будем Chrome. Скачайте и установите, если у вас используется что-то другое.
Это все. Остальное по желанию.
Настройка окружения
Теперь более интересная задача — настройка окружения. Потребуется установить некоторое количество ПО для обеспечения работы наших задач:
- NodeJS — платформа, транслирующая JS в машинный код. Наиболее часто нужно будет пользоваться менеджером пакетов npm, о нем позже в следующих статьях про создание пакетов. Переходим на сайт и скачиваем последнюю версию (она же Latest).
- Git — очень популярная и удобная система контроля версий. Нам она будет необходимо для понимания того, как происходит фиксация изменений проделанной работы. Разберем тему в отдельной статье, перед статьей по npm. Также скачиваем последнюю версию и устанавливаем.
После установки необходимо проверить всё ли установлено корректно. Для этого необходимо запустить терминал. Будем использовать встроенный терминал в VSC. Для этого в верхнем меню нужно выбрать Terminal > New Terminal.
В открывшемся окне терминала ввести несколько команд:
Для NodeJS. В результате на экране появится версия.
# node -vДля Git. В результате появится список возможных команд.
# gitВо всех примерах команд терминала знак # означает приглашение командной строки и вводить его не нужно. Вводим толко то, что после него.
Примечание
Если всё получилось так, как описано, значит все установлено правильно.
На этом подготовка базового окружения завершена. В следующих статьях будет уже настоящая практика.