Коротко: проще всего — GitHub Pages: бесплатно, без регистрации хостинга, сайт открывается по ссылке через несколько минут после загрузки файлов.
Готовый HTML-файл на компьютере ребёнка пока никому не виден, кроме самого автора. Чтобы сайт получил собственный адрес в интернете, нужны три шага: загрузить код на GitHub, включить в настройках репозитория функцию GitHub Pages и подождать несколько минут, пока сервис сгенерирует ссылку вида username.github.io/название-проекта.
Где в программе курса появляется публикация сайта
В курсе «Frontend Старт: первый сайт» (156 занятий, 18 месяцев) тема «Git и GitHub Pages» — 20-й из 21 модуля программы, сразу перед финальным проектом «сайт-портфолио». К этому моменту ребёнок уже прошёл HTML5, CSS3, flexbox и grid, адаптивность, основы JavaScript и сделал два мини-проекта — фотогалерею и калькулятор с переключателем темы. Публикация здесь не отдельная техническая мелочь в конце, а способ показать миру всё, что сделано за курс.
Что конкретно происходит на занятии с Git и GitHub Pages
Сначала ребёнок знакомится с Git — системой контроля версий, которая запоминает каждое изменение в коде. Потом регистрирует репозиторий на GitHub и загружает туда файлы сайта командами git add, git commit, git push. Последний шаг — в настройках репозитория найти раздел Pages и указать, из какой ветки и папки брать файлы для публикации.
Сколько времени занимает весь процесс публикации, если сайт уже готов?
Сама публикация — это 10-15 минут на занятии: регистрация репозитория, загрузка файлов и включение Pages. GitHub Pages обычно генерирует рабочую ссылку в течение нескольких минут после первой загрузки, иногда чуть дольше при первой публикации на новом аккаунте.
Нужно ли платить за хостинг и домен для школьного проекта
Нет. GitHub Pages бесплатен для публичных репозиториев, и именно поэтому это стандартный выбор для учебных и портфолио-проектов: не нужна ни оплата хостинга, ни покупка домена. Адрес вида username.github.io/название-проекта не самый короткий, зато полностью рабочий и бесплатный.
А что с доменом? Можно ли подключить собственное имя сайта?
Технически можно прикрепить собственный домен к странице на GitHub Pages, но покупка домена — отдельная статья расходов, которая в курсе не предусмотрена и для школьного портфолио-проекта обычно не нужна: ссылки github.io вполне достаточно, чтобы показать сайт учителю, друзьям или добавить в резюме для поступления.
Нужно ли знать английский, чтобы разобраться с Git и GitHub?
Интерфейс GitHub англоязычный, а сами команды git add, git commit, git push всегда пишутся латиницей независимо от языка интерфейса. Но на занятии преподаватель объясняет каждый шаг по-русски или по-украински, а ребёнку для самого процесса публикации достаточно узнавать несколько устойчивых слов на кнопках — «Settings», «Pages», «Save» — а не читать техническую документацию.
Самые частые причины, почему страница не появляется сразу
Чаще всего — файл главной страницы называется не index.html, а как-то иначе, и GitHub Pages просто не знает, что показывать первым. Вторая причина — в настройках Pages выбрана не та ветка или не та папка с файлами. Обе ошибки исправляются за минуту в тех же настройках репозитория, без переписывания кода сайта.
Что делать дальше, когда сайт уже опубликован
Опубликованный адрес не меняется, пока не удалить репозиторий, так что ребёнок может добавлять ссылку на сайт в портфолио, делиться им в соцсетях или показывать на собеседовании в профильный класс. В курсе «Frontend Pro» этот же навык развивается дальше — там появляется модуль «Деплой проекта» уже для более сложных приложений на React.
Полную программу курса со всеми 21 модулем смотрите на странице Frontend Старт: первый сайт. А о том, с чего ребёнку лучше начать — с HTML, CSS или сразу JavaScript, — мы писали в статье «HTML, CSS или сразу JavaScript: с чего ребёнку лучше начинать».
