Створити

Як зробити власний сайт на Github з безкоштовним доменом

В цій статі-мануалі ми розберемося як зробити власний сайт, задеплоїти його на Github, та зарегеструвати власний домен *.pp.ua. Бонусом є те що сайт не потребує коштів на утримання.


Нам знадобляться: Github аккаунт та аккаунт на сайті NIC.UA. Пропоную зареєструвати обидва до початку роботи.

Підготовка Github репозиторія

На Github створюємо новий репозиторій, натиснувши кнопку New:

Впишіть назву, наприклад mysite, перевірте що сайт має статус Public та натисніть кнопку Create repository:

Ви опинитесь на сторінці репозіторія. Зробить сайт доступним, відкрийте налаштування репозиторія:

Оберіть Джерело (Source) – Deploy from a branch та Гілку (Branch), збережіть.

Створюємо сторінку для тестування

Створимо index.html для того щоб перевірити що сайт працює.

Повернемося на вкладку Code, та створемо файл, нажав Create a new file (Створити новий файл).

Впишіть назву файла index.html, текст та нажміть Commit changes…:

Після цього можно перейти на вкладку Actions і побачите як файл публікується для відображення на сайті:

Перейдіть у виконану останню задачу, та знайдіть біля шагу deploy посилання на ваш сайт:

Як зарєеструвати власний домен pp.ua?

Припустимо що у вас є аккаунт NIC.UA. Увійдіть в аккаунт. Перейдіть на сторінку пошуку доменів, та введіть назву домена:

Додайте домен в кошик і нажміть Оформити замовлення:

Додаємо новий контакт Платника та Реєстранта:

На третьому шазі зробіть оплату у 0 гривень.

Далі перейдіть до списку власних доменів та побачите що ваш домен потребує авктивації:

Перейдіть по лінку для активації і слідуйте інструкціям по активаціїї домена. Я обрав варіант телеграм бота.

Через деякий час домен перейде в статус активований. Після цього треба привʼязати домен до NS серверов Github:

Змініть сервери імен на сервери імен NIC.UA:

Перейдіть в шалаштування NS-серверов:

Замінить NS-сервера на ті що наведені нижче:

NS-сервера:

185.199.108.153
185.199.109.153
185.199.110.153

Поверніться до налаштувань репозиторія Github та пропишіть назву домена:

Після цього деякий час відбудеться приєднення сертефікатів та перевірка DNS (це займає до 15 хв):

Щоб увімкнути HTTPS, після завершення процесу перевірки DNS, поставте відмітку у полі Enforce HTTPS:

Тепер можете ввести назву домена в браузері та побачите сторінку сайта:

Висновки

Тепер ви знаєте як створити власний сайт з симпатичним доменом, використовуя гітхаб та NIC.UA. Так, цей процес займає деякий час (приблизно до 1 години), але таким чином у вас буде практично безкоштовний сайт, який не залежить від примх компаній таких як WiX.

Щоб сайт став більш схожим на сайт – можно використати один з інструментів, таких як Hugo або Jeklly. Ці дві програми здатні перетворити текстові файли на HTML, який буде зберігатися на гітхабі. Приклади можете побачити на сторінці Hugo Showcase та Jeklly Showcase.

7 коментарів

Леммі 2рр
Поскаржитись
1

@javascript наскільки розумію хоче верифікацію по карті мати. В мене карта прикручена, гроші не знімає.

Леммі 2рр
Поскаржитись
1

@javascript Цікаво було б послухати, ще опиши які бонуси дає така схема. Я б хотів перенести файли з гугл-клауду на власний сервер та налаштувати NextCloud.

HimarsTime 2рр
Поскаржитись
1

Стоп, а чому на останньому скріні адреса йде через http а не https? Я коли робив чисто через гітхаб сайт, то мені надали саме https

Леммі 2рр
Поскаржитись
1

@himarstime Так, гітхаб пропонує увімкнути HTTPS у налаштуваннях. Додам у пост.

Леммі 2рр
Поскаржитись
1

@javascript Сорі, для мене така схема виглядає супер-заплутаною. Це для доступу до контенту? Наскільки розумію, сам Cloudflare пропонує схожу до DynDNS функціональність, переівір: https://developers.cloudflare.com/dns/manage-dns-records/how-to/managing-dynamic-ip-addresses/

Сумні_Збочення 2рр
Поскаржитись
1

Є така особливість UJ - в 10:00 натискаєш кнопку створити пост, пишеш його, додаєш зображення, форматуєш і публікуєш в 11:00. Але в стрічці Свіжого він буде розташований за часом як 10:00. Тому дивишся пости і начебто знизу все прочитав, аж ні - є щось новеньке.

p.s. GoodComedian ти попередь як я наближусь до межі "Чекаю на оформлене ТЗ"

Леммі 2рр
Поскаржитись
1

@sumni3bochennia Зрозумів, є такий недолік. Треба переробити роботу з датою публікації. Дякую що помітив.