Использование GitHub для размещения бесплатного статического веб-сайта
В этом руководстве мы узнаем об использовании GitHub для размещения нашего веб-сайта без какой-либо оплаты , используя GitHub Pages.
Важно, чтобы вы перешли по этой ссылке, чтобы перейти к этому руководству.
Новичок может не знать, стоит ли инвестировать в покупку серверного пространства, и GitHub выполняет свою работу бесплатно, очень чисто и элегантно, используя функцию GitHub Pages под названием «GitHub Pages».
Во-первых, позвольте нам попросить все технологии, которые мы собираемся использовать, быстро и приятно представить.
| HTML | Строительный блок всех веб-сайтов, стандартный язык разметки, который наряду с CSS и JAVASCRIPT используется веб-разработчиками для создания веб-сайтов, мобильных пользовательских интерфейсов и приложений. |
| CSS | Язык таблиц стилей, используемый для установки стиля для элементов HTML. |
| JavaScript | Обычно используется для создания интерактивных эффектов в веб-браузерах. |
| Джекил | Jekyll - это механизм синтаксического анализа, объединенный в виде рубинового драгоценного камня, который используется для создания статических веб-сайтов из динамических компонентов, таких как шаблоны, партиалы, жидкий код, уценка и т. Д., И помогает преобразовывать ваш простой текст в статические веб-сайты и блоги. Jekyll известен как «простой генератор статических сайтов с поддержкой блогов». |
| GitHub | Знаменитая веб-служба хостинга репозиториев GIT, и в этом случае она поможет нам разместить наш веб-сайт. |
Давайте начнем!!
Шаг 1 Создайте / войдите в свою учетную запись GitHub.
Шаг 2 Создайте новый репозиторий GitHub
Зайдите в свою панель управления и найдите кнопку «Новый репозиторий». Щелкните по нему, чтобы создать новый репозиторий, и назовите его «<your-GitHub-username> .github.io» (без двойных кавычек).
Например: - Если мое имя пользователя - hemangsk, имя моего нового репозитория должно быть Hemangsk.github.io.
При создании нового репозитория GitHub запрашивает заполнение различных деталей о новом репозитории. Вам не нужно об этом вообще беспокоиться, просто убедитесь, что вы сделали Репозиторий « общедоступным ».
Шаг 3 Работа со страницей репозитория
ПРИМЕЧАНИЕ. Как только вы нажмете «Создать репозиторий», вы попадете на страницу репозитория. Здесь происходит все действие
Теперь открывается страница репозитория, и вот что вам нужно сделать:
- Подготовьте все свои файлы HTML и CSS в папке, назовем ее WEB, на вашем компьютере.
- Нажмите (Загрузить) его в этот репозиторий. Теперь есть несколько способов сделать это, например, с помощью Git, клиента GitHub в Windows или вручную.
- Что вам нужно сделать, так это вручную скопировать и вставить каждый из ваших файлов HTML и CSS в этот репозиторий, предположим, что у вас есть файл index.html в папке WEB на вашем компьютере.
- Откройте страницу репозитория
- Нажмите кнопку «Новый файл» на странице репозитория GitHub.
- Назовите свой файл «index.html».
- Сверните страницу репозитория и откройте файл index.html на своем компьютере.
- Скопируйте его содержимое.
- Развернуть страницу репозитория
- Вставьте скопированное содержимое
- Нажмите «зафиксировать изменения».
- Файл index.html теперь помещен / загружен в ваш репозиторий.
- Повторите эти шаги для всех остальных файлов в папке «WEB».
Когда вы закончите, вы можете легко заметить, что страница репозитория теперь выглядит заполненной.
Шаг 4 После того, как все файлы будут готовы в вашем репозитории. Пришло время открыть ваш красивый веб-сайт. Откройте новую вкладку браузера и посетите «<your-GitHub-username> .github.io».
Вот так! Ваш веб-сайт теперь запущен и работает.
Теперь вы можете использовать GitHub, чтобы протестировать свои проекты HTML5 и CSS3, продемонстрировать их в реальном мире на реальном и красивом веб-сайте!
Вот как работают страницы GitHub, очень просто! Вы можете создать неограниченное количество сайтов-репозиториев плюс сайт одного пользователя. Сайт «Пользователь» - это то, что мы только что создали. Точно так же создаются сайты-репозитории.
Вы можете оставить все свои сомнения в разделе комментариев, и я к вам вернусь.
Хорошего дня!
Об авторе: Хеманг Кумар - разработчик с открытым исходным кодом, второкурсник в USICT, Нью-Дели, владеющий BTech CSE, любит разрабатывать код, веб-интерфейсы и пользовательские интерфейсы. С ним можно связаться по адресу https://www.linkedin.com/in/ Хемангкумар
Если вы также хотите продемонстрировать здесь свой блог, посетите GBlog, где вы можете писать в гостевом блоге на GeeksforGeeks.