Расскажу как легко и бесплатно разместить свой сайт на бесплатном хостинге прямо из репозитория GitHub и настроить автоматическое обновление по пушу в ветку.
Предположим, есть у вас сверстанный сайт. Не важно, работаете ли вы на фрилансе, или может быть вы начинающий разработчик. Цель одна – опубликовать свой сайт быстро и легко. Такое решение есть, сейчас расскажу.
Что нам понадобится:
- Аккаунт на GitHub – сделать легко и бесплатно
- Зарегистрироваться на vercel.com – еще легче, авторизуемся с аккаунтом GitHub
- Готовая верстка сайта. Сразу скажу, что сайты с php-скриптами не подойдут, Wordpress сайты – тоже.
Первое, что мы сделаем – это создадим репозиторий своего проекта на гите. Для этого на компьютере должен быть установлен git. Инструкций в интернете куча как это сделать, думаю, что вы справитесь.
Переходим в GitHub и ищем кнопку New Repository – она сверху, где плюсик. Нажимаем придумываем имя и готово.
Далее, загружаем наш проект в репозиторий любым способом. Можем прямо через сайт закинуть туда архив с файлами, а можем сделать это через консоль или интерфейс Visual Studio Code или другого редактора кода. Сейчас рассмотрим последние два.
Как загрузить через консоль (терминал)
Когда вы создали репозиторий, то GitHub уже сам вам все рассказал, что нужно сделать в консоли. Но я чуть-чуть подскажу.
Копируем ссылку, как на картинке выше и идем в редактор кода, а точнее в открытую консоль в корневой папке проекта. Вводим команду git init, а затем git remote add origin [ссылка, которую скопировали] – это мы присоеденили наш репозиторий к локальной папке на компьютере. Далее вводим команды по очереди и жмем Enter:
git add . – закрепили все файлы для коммита в гит
git commit -m "тут можно написать любое сообщение" – делаем коммит (скажите, если нужно рассказать про гит подробнее)
git push --set-upstream origin master – отправляем изменения в ветку master
Вот все наши файлы уже в удаленном репозитории на github.
Теперь научим наш репозиторий публиковаться в интернете. Для этого переходим на vercel.com и ищем кнопку Add New... и выбираем Project.
Так как мы авторизовались в Vercel через GitHub, то все наши репозитории уже подгружены и нам осталось только выбрать нужный. Если вы впервые на GitHub'е, то он у вас будет единственный. Нажимаем Import напротив нужного репозитория.
Можем задать имя для нашего проекта и задеплоить его, нажав на кнопку Deploy.
Тут нас уже поздравляют с тем, что у нас все получилось! И мы можем перейти в дашбоард – Continue to Dashboard
Уже по этой ссылке мы можем перейти и глядеть на наш сайт в интернете и делиться этой ссылкой с заказчиками или друзьями.
Также хочется сказать, что Vercel – это очень удобный и мощный инструмент. С помощью которого можно разворачивать свои сайты и веб-приложения.
Например, при следующем пуше в основную ветку на github или в любую другую, то ваши изменения автоматически докатятся до сайта и обновятся, а также создаться отдельная ссылка для каждой ветки.
Если вам понравилась статья, то буду благодарен за лайк. Постараюсь рассказывать вам еще о полезностях из мира веб-разработки.