Создание и деплой проекта

Инструкция предназначена для публикации статического сайта (HTML, CSS, JavaScript) через GitHub Pages.

Предварительные требования: установка Git.

Для деплоя проекта в GitHub-репозиторий выполните следующие шаги:

  1. Создайте новый репозиторий в своем аккаунте на сайте github.
  2. Инициализируйте репозиторий локально в проекте.
  3. Свяжите удаленный и локальный репозитории.
  4. Отправьте файлы и папки проекта в удаленный репозиторий.
  5. Настройте ветку.

Создание репозитория в аккаунте GitHub

Нажмите кнопку “New”. В обязательном поле Repository name введите название проекта. Имя репозитория используется в URL проекта при публикации через GitHub Pages. Полная ссылка на проект будет выглядеть примерно так:

https://[YOUR_NICKNAME].github.io/[REPOSITORY_NAME]/

На странице создания репозитория также доступны опции:
– Choose visibility (private / public) – обязательная опция. По умолчанию – public.
– Add README. Необязательная опция. По умолчанию – без README файла.
– Add .gitignore. Необязательная опция. По умолчанию – no .gitignore.
– Add license. Необязательная опция. По умолчанию – no license.

Visibility

Опция visibility позволяет определить, кто может видеть / вносить изменения в проект:
– public – все могут видеть репозиторий. Вы можете выбрать, кто может вносить изменения в репозиторий.
– private – вы можете выбрать, кто может видеть репозиторий, а также вносить в него изменения.

Add README

README – это текстовый файл, который распространяется вместе с программным обеспечением и содержит ключевую информацию о нём.

README включает следующие разделы (в зависимости от проекта их набор может меняться):
– Название проекта — чёткое и краткое обозначение.
– Описание — что делает проект, зачем он нужен, какие проблемы решает.
– Скриншоты или видео — наглядная демонстрация интерфейса или работы функционала.
– Инструкция по установке — пошаговое руководство, как развернуть проект локально.

.gitignore

.gitignore – это текстовый файл в системе контроля версий Git, который задаёт правила игнорирования файлов и каталогов: Git не будет их отслеживать, добавлять в коммиты и показывать как неотслеживаемые.

Файл помогает:
– поддерживать чистоту репозитория (исключать временные и служебные файлы).
– защищать конфиденциальные данные (пароли, ключи API).
– уменьшать размер репозитория (игнорировать большие бинарные файлы).
– избегать конфликтов настроек между разработчиками (локальные конфигурации IDE).

license

License — это текстовый файл в репозитории программного обеспечения, который определяет условия использования, копирования, изменения и распространения кода. Он юридически закрепляет права пользователей и авторов.

Инициализация репозитория локально в проекте

Для того, чтобы создать локальный репозиторий, в корне проекта выполните команду git init. После этого появится сообщение: Initialized empty Git repository in /[ПУТЬ_ДО_ПРОЕКТА]/.git/.

Интеграция удаленного репозитория с локальным

Чтобы связать два репозитория, можно использовать инструкцию, доступную на странице, где был создан удаленный репозиторий. Либо используйте команду git remote add origin https://github.com/[YOUR_NICKNAME]/[REPOSITORY_NAME].git

Отправка файлов и папок в удаленный репозиторий

Чтобы отправить файлы из локального репозитория в удаленный, выполните следующие команды:

  1. git add .
  2. git commit -m 'НАЗВАНИЕ КОММИТА'
  3. git push -u origin main

Подробнее о каждом шаге

git add

Команда добавляет файлы в область подготовки перед коммитом.

Точка в конце команды git add . означает, что отслеживаться будут все папки и файлы, которые есть в проекте.

git commit

Таким образом создается “снимок” (snapshot) текущего состояния.
Каждый коммит:
– содержит полную информацию о состоянии всех отслеживаемых файлов на момент коммита.
– включает метаданные: автора, дату, сообщение коммита.

git push

Для отправки локальных файлов на удаленный репозиторий используется команда git push origin main, где main – ветка репозитория.

Примечание: в больших проектах может быть большое количество веток. Ветка main (продакшн-версия сайта / приложения) – в основном всегда самая главная, в ней лежит рабочий код.

Подробнее о составляющих команды git push:
• –u (или –set-upstream) — устанавливает связь (upstream) между локальной веткой и удалённой. Это позволяет в будущем использовать просто git push и git pull без указания параметров.
• origin — стандартное имя удалённого репозитория (по умолчанию задаётся при клонировании или добавлении удалённого репозитория).
• main — имя ветки, в которую отправляются изменения (современный стандарт вместо старой master).

Настройка ветки

После выполнения команды git push файлы будут загружены на удаленный репозиторий (требуется обновить страницу).

Далее, чтобы проект был доступен для просмотра всем пользователям, зайдите в настройки (Settings), затем в страницы (Pages).

В открывшейся странице Pages:
– выберите ветку main
– нажмите Save

Спустя несколько минут после обновления страницы Pages появится сообщение о том, что проект доступен по определенному адресу.

Результат

После выполнения инструкции сайт будет доступен по адресу:
https://[YOUR_NICKNAME].github.io/[REPOSITORY_NAME]/

Публикация может занять несколько минут.

Проверка

После публикации:
– откройте ссылку проекта.
– убедитесь, что отображается страница index.html.

Важно

  1. Файл index.html должен находиться в корне проекта, иначе GitHub Pages не сможет его отобразить.
  2. Если отображается сообщение fatal: not a git repository (or any of the parent directories): .git, это означает, что была пропущена команда git init, которая инициализирует создание репозитория.
  3. После включения GitHub Pages публикация может занять 1–5 минут.
  4. После этого можно вносить изменения в проект. При этом можно использовать сокращённую команду: git push.
  5. Если изменился только один файл, можно указать его вместо точки
    Например: git add /css/main.css.