
Содержание статьи
Хотя вы можете создавать базовые веб-сайты только с помощью текстового редактора и браузера, вы можете расширить свою игру, добавив в свой рабочий процесс фреймворк JavaScript, например React или Vue, и полезные инструменты, такие как Git.
Но подождите! Ваш Mac не готов. Прежде чем погрузиться, вам нужно будет установить несколько элементов, которые избавят вас от непонятных ошибок позже. ?
Эта статья проведет вас через минимальные настройки, которые вам понадобятся, чтобы запустить веб-разработку на основе JavaScript на Mac.
Пойдем!
Обновите свой Mac
Прежде чем устанавливать любое новое программное обеспечение, следуйте инструкциям от Apple, чтобы обновить macOS и текущее программное обеспечение до последней версии.
Выберите терминальную программу
Поскольку вы будете взаимодействовать со своим Mac с помощью командной строки в этой статье, вам понадобится терминальное приложение.
Хорошими вариантами являются любой из следующих вариантов:
Если вы не уверены, какой из них выбрать, выберите Hyper.
Инструменты разработчика командной строки
Первое, что вам нужно будет установить из командной строки, это ваш Mac инструменты разработчика командной строки. Установка их сейчас позволит избежать странных ошибок позже.
Чтобы проверить, установлены ли инструменты, введите следующую команду в программе терминала и нажмите возврат:
xcode-select --version
Если результат не является номером версии, установите инструменты с помощью этой команды:
xcode-select --install
Появится диалоговое окно с вопросом, хотите ли установить инструменты. Нажмите Установить и пакет загрузится и установится самостоятельно.
Когда установка закончится, подтвердите, что инструменты установлены, повторно запустив первую команду:
xcode-select --version
Теперь в результате должен быть номер версии.
Домашний
Вместо того, чтобы устанавливать следующие несколько инструментов, перейдя на веб-сайт каждого инструмента, найдя страницу загрузки, нажав ссылку для загрузки, распаковав файлы и вручную запустив установщик, мы собираемся использовать Homebrew.
Домашний это инструмент, позволяющий устанавливать, обновлять и удалять программное обеспечение на Mac с командной строки. Это быстрее и безопаснее, чем ручной подход, и в целом облегчает вашу жизнь разработки.
Сначала проверьте, установлен ли уже Homebrew:
brew --version
Если вы не видите номер версии, установите Homebrew с помощью этой команды:
/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
Я обещаю, что это самая странная команда, которую вы увидите в этой статье! ? Благодаря Homebrew все остальное просто.
Прежде чем двигаться дальше, убедитесь, что Homebrew сейчас установлен:
brew --version
Узел и npm
Node.js – это инструмент, позволяющий вашему Mac запускать код JavaScript вне веб-браузера. Если вы хотите запустить на своем Mac фреймворк JavaScript, например React или Vue, вам нужно установить Node.
Node также включает в себя npm (диспетчер пакетов узлов), который предоставляет вам доступ в гигантскую библиотеку бесплатного кода, который вы можете загрузить и использовать в своих проектах.
Сначала проверьте, установлен ли уже Node:
node --version
Если нет, установите его с помощью Homebrew:
brew install node
Наконец, подтвердите, что Node и npm теперь установлены:
node --version
npm --version
Контроль версий с помощью Git
Git — это инструмент, который помогает отслеживать изменения в вашем коде и работать с другими разработчиками совместных проектов.
Использование Git в каждом проекте – отличная привычка для развития и подготовит вас к будущим проектам, где Git может пригодиться. Некоторые инструменты (например, GatsbyJS) также зависят от установки Git на вашем Mac, поэтому он вам понадобится даже если вы не планируете добавлять его в свой рабочий процесс.
Еще раз начните с проверки, установлен ли Git:
git --version
Если нет, установите его:
brew install git
И подтвердите, что установка сработала:
git --version
Время от времени выполняйте такую команду, и все, что вы установили с помощью Homebrew, обновится автоматически:
brew update && brew upgrade && brew cleanup && brew doctor
Эта одна команда – это все, что вам нужно, чтобы поддерживать вашу систему в актуальном состоянии. ?
Обычно я запускаю его, когда начинаю новый проект, но не стесняйтесь делать это, когда вам вздумается. (Если вы запустите эту команду, если Homebrew предлагает дополнительные команды для запуска, выполните их. Если команда начинается с sudo
и вам будет предложено ввести пароль, используйте пароль администратора вашего Mac.)
Вот и все для командной строчки!
Редактор кода
Хотя вы можете писать код в любом текстовом редакторе, использование выделяющего и проверяющего код значительно облегчит вам жизнь.
Хорошими вариантами являются любой из следующих вариантов:
Если вы только начинаете работу, выберите Visual Studio Code.
браузер
Когда вы кодируете, это помогает просматривать приложение или веб-сайт, которые вы создаете, в браузере, чтобы убедиться, что они работают. Хотя вы можете использовать для этого любой браузер, некоторые включают в себя дополнительные инструменты разработчика, которые показывают вам подробную информацию о вашем коде и способах его улучшения.
Любой из следующих вариантов хорош:
Если вы только начинаете работу, выберите Chrome.
Finder
Краткий совет: вы хотите показать файлы, которые ваш Mac скрывает по умолчанию. (Например, файлы git автоматически скрываются, но иногда вам нужно их редактировать.)
Самый простой способ показать скрытые файлы вашего Mac – это комбинация клавиш ⌘⇧. (Command+Shift+точка). Это позволит попеременно отображать и скрывать эти файлы, чтобы вы могли получить к ним доступ, когда они вам понадобятся.
Вывод
Все готово! ?
Это все, что вам нужно, чтобы начать разработку интерфейса на основе JavaScript на Mac.
Чтобы избежать путаницы, я пропустил все элементы, которые не строго обязательны. Если вы хотите погрузиться в дополнительные способы дополнительной настройки Mac для веб-разработки, просмотрите ссылку ниже.
Дальнейшее чтение
Обсуждайте в Twitter
Первоначально опубликовано на michaeluloth.com.