Установка VS Code, браузера и Live Server для веб-разработки с нуля

В этом уроке мы подготовим компьютер к изучению веб-разработки и настроим первое рабочее пространство. Вы узнаете, какое программное обеспечение нужно установить, чтобы начать создавать сайты с нуля: браузер, редактор кода Visual Studio Code и полезные расширения для комфортной работы. На уроке разберём: — что такое программное обеспечение; — зачем веб-разработчику нужен браузер; — какой браузер выбрать для обучения; — чем редактор кода отличается от обычного блокнота; — зачем нужен Visual Studio Code; — как установить VS Code; — какие важные галочки отметить при установке; — как установить Russian Language Pack; — как установить Live Server; — зачем включать автосохранение; — как создать папку проекта; — как создать файл index.html; — как запустить первую HTML-страницу через Live Server. Этот урок подойдёт новичкам, которые начинают изучать HTML, CSS и веб-разработку с нуля. 00:00 Знакомство с автором курса 01:42 Где будут выходить уроки: YouTube, Boosty и Patreon 03:18 Тема урока: настройка рабочего пространства 03:35 Что установим для веб-разработки 03:52 Что такое программное обеспечение 04:16 Зачем веб-разработчику браузер 05:08 Можно ли писать код в обычном блокноте 06:23 Два главных инструмента: редактор кода и браузер 07:47 Какой браузер выбрать 08:01 Что такое DevTools 08:38 Google Chrome, Firefox, Edge и другие браузеры 10:59 Как скачать браузер с официального сайта 12:47 Что такое редактор кода 13:34 HTML, CSS и JavaScript на примере сайта 15:04 Как редактор кода помогает программисту 16:40 Расширения и плагины в редакторе кода 18:11 Почему выбираем Visual Studio Code 19:27 Установка Visual Studio Code 21:27 Важные галочки при установке VS Code 23:29 Завершение установки и запуск VS Code 24:53 Английский интерфейс VS Code и русификация 27:10 Обзор левой панели VS Code 28:32 Раздел Extensions / Расширения 29:25 Установка Russian Language Pack 30:39 Установка Live Server 32:54 Что такое расширения в VS Code 34:18 Зачем нужен Live Server 34:31 Проблема ручной проверки изменений в браузере 37:16 Автосохранение и автоматическое обновление страницы 38:57 Полезные расширения для будущей работы 40:24 Как программист ищет информацию 41:55 Настройка автосохранения в VS Code 45:21 Создаём папку проекта 48:10 Открываем папку проекта в VS Code 48:49 Почему VS Code спрашивает о доверии к папке 50:08 Почему на старте не стоит полагаться на ИИ 51:02 Отключаем Copilot на этапе обучения 52:31 Создаём файл index.html 53:53 Почему файл должен называться index.html 56:11 Создаём базовую HTML-структуру через Emmet 57:19 Что будет в следующем уроке 58:00 Пишем первый заголовок «Привет, мир!» 59:23 Обзор рабочей области VS Code 1:00:13 Запускаем сайт через Go Live 1:01:16 Первый результат в браузере 1:02:50 Проверяем автосохранение и Live Server 1:05:00 Итоги урока 1:06:02 Где найти дополнительные материалы и связаться с автором 1:08:30 Завершение урока