Автоматический деплой проекта с использованием GitHub и FTP на хостинг Timeweb

В этой статье мы рассмотрим процесс создания репозитория на GitHub и настройки автоматического деплоя проекта на хостинг с использованием локального сервера и FTP. Этот подход позволит нам автоматизировать процесс деплоя и упростить развертывание проекта на удаленном сервере.

Шаг 1: Создание репозитория на GitHub

Первым шагом является создание нового репозитория на GitHub. Для этого перейдите на https://github.com, войдите в свою учетную запись и нажмите кнопку «New» (Создать). Задайте имя репозитория, описание и выберите настройки видимости (public или private). Нажмите кнопку «Create repository» (Создать репозиторий).

Шаг 2: Настройка локального проекта

Далее нам нужно настроить локальный проект и его репозиторий для связи с удаленным репозиторием на GitHub. Для этого выполните следующие действия:

  1. Откройте терминал или командную строку.

  2. Перейдите в корневую директорию вашего проекта с помощью команды cd <путь_к_проекту>

  3. Инициализируйте локальный репозиторий с помощью команды git init

  4. Свяжите локальный репозиторий с удаленным репозиторием на GitHub, используя команду git remote add origin <URL_удаленного_репозитория> Замените <URL_удаленного_репозитория> на URL вашего репозитория на GitHub. Например, «https://github.com/Stacss/like-feedback.git»

  5. Добавьте и зафиксируйте ваш проект в локальном репозитории с помощью команд git add . и git commit -m "Первоначальный коммит"Вместо "Первоначальный коммит" вы можете использовать любое сообщение коммита, описывающее ваше начальное состояние проекта.

  6. Отправьте ваш локальный репозиторий на GitHub с помощью команды git push -u origin master

Шаг 3: Настройка автоматического деплоя с помощью GitHub Actions и FTP

Теперь настало время настроить автоматический деплой с локального сервера на ваш хостинг через FTP. Мы будем использовать инструмент Continuous Integration (CI) под названием GitHub Actions для выполнения этой задачи. Далее следуем шагам:

  1. В вашем репозитории на GitHub откройте вкладку «Actions» (Действия).

  2. Нажмите на «Set up a workflow yourself» (Создать собственный workflow).

  3. Замените содержимое файла на следующий код, который определяет действие для автоматического деплоя проекта на хостинг:

 name: Deploy to Hosting on:   push:     branches:       - master  jobs:   deploy:     runs-on: ubuntu-latest      steps:       - name: Checkout Repository         uses: actions/checkout@v2        - name: Deploy to Hosting         uses: SamKirkland/FTP-Deploy-Action@4.0.0         with:           server: ${{ secrets.FTP_SERVER }}           username: ${{ secrets.FTP_USERNAME }}           password: ${{ secrets.FTP_PASSWORD }}           server-dir:  //здесь нужно указать папку вашего проекта на хостинге 

Путь к проекту server-dir указывать в формате mysite.ru/public_html/.

  1. Нажмите на кнопку «Start commit» (Начать коммит), введите сообщение коммита (например, «Добавление автоматического деплоя на хостинг») и нажмите на кнопку «Commit new file» (Зафиксировать новый файл).

  2. Теперь нам нужно добавить секреты для защиты ваших учетных данных FTP. Для этого перейдите во вкладку «Settings» (Настройки) вашего репозитория на GitHub.

  3. В левой панели выберите «Secrets and variables», далее – «Actions».

  4. Нажмите на кнопку «New repository secret» (Новый секрет репозитория).

  5. Создайте три секрета с именами FTP_SERVER, FTP_USERNAME, FTP_PASSWORD. При создании введите соответствующие учетные данные FTP в поля «Value» (Значение) каждого секрета из админпанели личного кабинета Timeweb, где FTP_SERVER – это хост, FTP_USERNAME – это логин, FTP_PASSWORD – пароль.

  6. Убедитесь, что все три секрета (FTP_SERVER, FTP_USERNAME и FTP_PASSWORD) были добавлены и сохранены.

Поздравляю! Теперь ваш репозиторий настроен для автоматического деплоя проекта на хостинг каждый раз, когда вы делаете push в ветку master, GitHub Actions будет запускать ваш workflow, который клонирует репозиторий и автоматически деплоит проект на ваш хостинг с использованием FTP.

Обратите внимание, что вы можете настроить этот процесс деплоя более подробно, добавив дополнительные шаги или настройки в ваш workflow. Это позволяет адаптировать его под ваши конкретные потребности и требования.

Теперь вы можете наслаждаться автоматическим деплоем проекта на хостинг с локального сервера при каждом push в ваш репозиторий на GitHub. Это значительно упрощает и ускоряет процесс развертывания проекта, освобождая вас от рутинных задач и позволяя сконцентрироваться на разработке.

Межтекстовые Отзывы
Посмотреть все комментарии
guest

Что такое виджет и как им пользоваться

Разработка #Веб-дизайн #JavaScript #Оптимизация #Windows Разработчики софта и владельцы сайтов стараются упростить процесс взаимодействия со своим продуктом. Одним из...

Может ли робот обрести сознание? И если обретет, то как мы об этом узнаем?

Разработка #Технологии #Тренды #Нейросети #Наука #Разбор Часть экспертов считает, что люди могут запросто создать разумного робота и понять,...

Обзор лучших WYSIWYG-редакторов

Разработка #Обзор #Контент #JavaScript #OpenSource Рассматриваем лучшие текстовые WYSIWYG-редакторы, которые можно встроить на сайты и в веб-приложения. Полнофункциональные, быстрые...

Удиви Divi: как сделать сайт на самом продаваемом шаблоне для WordPress

Разработка #Шаблоны #Настройка #WordPress В статье я покажу, как сделать лендинг на базе Divi. Это шаблон от компании Elegantthemes,...

Создаем свой шаблон для Joomla. Пошаговое руководство

Разработка #Шаблоны #HTML/CSS #Joomla! В этой статье пойдет речь о создании своего шаблона для Joomla 3.х с возможностью...

Обзор Vue.js

Разработка #Фреймворки #Обзор #JavaScript Vue.js или просто Vue – это прогрессивный JavaScript-фреймворк, который используется для создания пользовательских интерфейсов....

PHP: работа с БД MySQL

Разработка #Серверы #MySQL #PHP #Базы данных Базы данных используются для удобного хранения информации, а также для её структурирования....

Что такое объектно-ориентированное программирование

Разработка #C/C#/C++ #Программы #Обзор #JavaScript Рассказываю об одной из важнейших парадигм в программировании.  Парадигмы программирования и их виды...

Что такое скрипт

Разработка #Разбор #JavaScript #PHP #Windows Активные пользователи компьютера время от времени сталкиваются со словом «скрипт», не всегда понимая,...

Что такое User agent и как его изменить

Разработка #Браузеры #Веб-дизайн #Безопасность Во время взаимодействия с браузером пользователь может встретить такое понятие, как User agent. Используется...

Как пользоваться редактором Atom

Разработка #GitHub #Редакторы кода #HTML/CSS #PHP Atom – это многофункциональный текстовый редактор от разработчиков GitHub. Он поддерживает огромное...

Как пользоваться Visual Studio Code

Разработка #IDE #Редакторы кода #Программы #Обзор #Windows Visual Studio Code – это один из наиболее популярных редакторов кода,...

Как ускорить ответы клиентам с помощью чат-бота в VK. Пошаговая инструкция

Разработка #ВКонтакте #Боты #JavaScript Нередко бывает так, что в вашу группу во «Вконтакте» в один момент написали много...

Push-уведомления: типы, назначение, советы по созданию

Разработка #Конверсия #Интернет-магазин #Веб-дизайн #Продажи Сегодня поговорим о push-уведомлениях. Как они работают, зачем нужны и какими должны быть.  Что такое...

Руководство по изучению Python

Разработка #Обзор #Веб-дизайн #Python Язык программирования Python считается одним из наиболее перспективных для написания кода, используемого в различных...

Работаем с объектами в JavaScript

Разработка #Настройка #JavaScript В прошлой статье я рассказывал о массивах в JavaScript. Из нее мы можем понять, что...

Что такое рефакторинг кода

Разработка #Обзор #Технологии #IDE #Редакторы кода #JavaScript Зачем разработчики на регулярной основе переписывают свой и чужой код, не...

В Windows 11 добавится поддержка USB 4 2.0 со скоростью передачи данных до 80 Гбит/с

Новости #Обновления #Windows Реклама. ООО «ТаймВэб». erid: LjN8K8PQJ Корпорация Microsoft начала распространять пакет функциональных обновлений KB5034848 для Windows 11...

Руководство по разработке приложений: как сделать приложение для iOS и Android самостоятельно

Разработка #Конверсия #Подборка #Разбор #UX/UI #Конструктор Разработка мобильного приложения от А до Я – это довольно долгая и...

Как создать сайт на WordPress с нуля

Разработка #Настройка #WordPress #Базы данных #Оптимизация Поговорим о том, как создать сайт на базе WordPress и Timeweb. Сайт,...