Первый проект | Подготовка рабочей среды
Настройка рабочей среды перед началом работы
Перед тем, как приступить к созданию своего первого веб-проекта Вам понадобится основной рабочий инструмент - редактор кода.
Редактор кода - по своей сути это самый обычный текстовый редактор с разного рода "плюшками", которые делают процесс разработки более удобным. Конечно можно кодить (писать код) и в стандарте блокноте Windows, но в этом нет необходимости.
И так, приступим. Если Вы еще не читали статью "Введение | Что такое HTML?" то обязательно рекомендую сделать это именно сейчас. В вышеупомянутой статье было предложено несколько популярных редакторов кода, которые годятся для веб-разработки. Надеюсь, что Вы уже скачали и установили Visual Studio Code, если еще нет, то сделать это можно по этой ссылке.
Запустите установленный редактор. Перед Вами будут две основные области: область для работы с кодом (справа) и панель инструментов (слева). Сейчас нас интересует именно левый сайдбар (панель инструментов).
Для начала нам необходимо установить плагин "Open in browser". Плагин - это расширение для программного продутками (в нашем случае для редактору кода Visual Studio), которое добавляет новые возможности к уже существующему функционалу.
Для чего нам нужен плагин Open in browser?
Все очень просто, это приложение позволит нам сразу видеть "плоды нашего труда" прямо в окне нашего любимого браузера.
Для того, чтобы установить плагин нужно открыть интерфейс "Extensions". Сделать это можно с помощью комбинации клавиш "Ctrl + Shift + X" или нажав на соответствующую кнопку в левом сайдбаре, как показано кижче.
В интерфейсе, который откроется необходимо ввести название нужного плагина, то есть "Open in browser".
Далее выбираем шаш плагин из списка найденных по данному ключевым запросом, и нажимаем зеленую кнопку "Install".
Ждем завешення установки, обычно она занимает не более нескольких секунд. После завершения процесса установки на месте кнопки "Install" появится синяя кнопка "Reload", нажимаем ее для того, чтобы установленный плагин начал работать.
Следующий шаг - создание непосредственно нашего первого пректа. Первое, что нужно - создать домашнюю директорию. Что такое "директория"? - элементарно, это самая обычная папка. То есть старт Вашего первого проекта - создание папки.
!ВАЖНО
Не используйте в названии директории проетку специфические символы или буквы с кириллицы, задавайте название папки используя латинчьки (английские) буквы.
Теперь нам осталось только открыть нашу диркторию проекта в редакторе. Для этого вернитесь к окну редаткора и нажмите комбинацию клавиш "Ctrl + Shift + E" или соответствующую кнопку в левом сайдбаре и нажмите на кнопку «Open folder" или выберите File >> Open Folder в главном меню, после чего просто укажите путь к созданной Вами директории.
Поздравляю! Подготовка к работе над проектом завершена! Вы готовы к началу работы над своим первым веб-проектом. Вы готовы к началу работы над своим первым веб-проектом.
Спасибо за внимание, жду Ваших Вопросов в Комментариях =)
Оригинал статьи на моем сайте IT-Box