У світі розробки ви часто зустрічаєте терміни GitHub і WordPress. Інтеграція WordPress і GitHub може спростити робочий процес розробника та зробити його більш продуктивним.

GitHub — це хмарна платформа, яка дозволяє відстежувати, керувати та зберігати вихідний код. З іншого боку, WordPress — це система керування вмістом (CMS) для створення веб-сайтів.

Чому вам потрібно інтегрувати обидва?

• Контроль версій: за допомогою GitHub ви можете відстежувати всі зміни у вихідному коді WordPress з часом. Таким чином, ви можете легко керувати своїм власним кодом, темами WordPress і плагінами.
• Розгалуження: після інтеграції WordPress із GitHub вам більше не потрібно підтримувати веб-сайт у стані «на обслуговуванні». Створюйте нові гілки, працюйте над окремими функціями, тестуйте їх і розгортайте їх, коли ви переконаєтеся, що все працює належним чином.
• Співпраця. Можливо, ви створюєте великий веб-сайт, для якого потрібні різні розробники. GitHub дозволяє залучити членів вашої команди та призначити їм різні ролі.
• Перевірка коду: під час створення програми WordPress щось може піти не так, і ваша програма виходить з ладу. GitHub дозволяє переглядати всі зміни у вихідному коді WordPress перед розгортанням для розробки.
• Резервне копіювання та відновлення коду: зберігання вихідного коду WordPress на вашому комп’ютері може бути ризикованим, оскільки машина може вийти з ладу або пошкодитися. GitHub зберігає вихідний код у хмарі, дозволяючи вам клонувати його назад на свою машину, якщо трапиться нещастя.
• Прозорість і підзвітність: GitHub чітко відстежує всі зміни, внесені у вихідний код WordPress, і ким.

Що таке WordPress?

WordPress це система керування вмістом із відкритим кодом, яку люди без досвіду кодування можуть використовувати для створення веб-сайтів. Ця платформа спочатку була розроблена для блогів, але тепер еволюціонувала, і користувачі можуть створювати платформи електронної комерції, форуми, соціальні платформи, мобільні програми та бізнес-сайти.

Той факт, що WordPress є відкритим кодом, є однією з найбільших приваб для розробників і дизайнерів. Таким чином, ви можете завантажити вихідний код WordPress, редагувати та поширювати його. Однак ви повинні придбати доменне ім’я та хостинг, щоб опублікувати свій веб-сайт в Інтернеті.

Навіщо використовувати WordPress?

• Простий у використанні: WordPress розроблений таким чином, щоб бути зручним для користувачів, незалежно від того, новачок ви в програмуванні чи експерт. Ви можете використовувати редактор із скиданням і перетягуванням, щоб створити професійний веб-сайт без написання жодного рядка коду.
• Різноманітність тем: у WordPress є тисячі тем, які ви можете редагувати відповідно до своїх потреб. Ви також можете створити власну тему та завантажити її на свій веб-сайт.
• Різноманітні плагіни: вам не потрібно створювати все з нуля, оскільки ви можете використовувати плагіни. Наприклад, ви можете інтегрувати програму WordPress із платіжними шлюзами за допомогою плагінів.
• Велика спільнота: якщо ви застрягли, ви завжди можете покластися на велику спільноту WordPress. Ви також можете використовувати масу ресурсів для усунення несправностей і вирішення різних проблем.

Що таке GitHub?

GitHub це хмарна платформа розробки програмного забезпечення. Ця платформа може зберігати, відстежувати та співпрацювати над різними проектами розробки. GitHub дозволяє користувачам створювати безкоштовні облікові записи, створювати репозиторії та запрошувати співавторів для різних проектів. Платформа бездоганно працює з Git, платформою контролю версій, яка дозволяє локально відстежувати зміни у вашому проекті.

GitHub пропонує безкоштовний хостинг для статичних веб-сайтів Сторінки GitHub і може бути хорошим варіантом для сторінок портфоліо. Ви також можете використовувати GitHub як платформу соціальної мережі, оскільки вона дозволяє публічно показувати проекти. Ця функція також дозволяє розробникам легко досліджувати проекти з відкритим кодом, у які вони можуть внести свій внесок.

Навіщо використовувати GitHub?

• Простий у використанні: налаштувати обліковий запис GitHub легко, навіть якщо ви не розбираєтесь у техніці.
• У хмарі: GitHub зберігає ваш вихідний код у хмарі, тобто ви можете отримати до нього віддалений доступ або навіть відновити свої файли, якщо ваш комп’ютер зламався.
• Контроль версій: GitHub відстежує всі зміни, внесені у вихідний код. Ви також можете створювати різні гілки для легкого відстеження.
• Співпраця: Ви можете запросити членів команди до свого проекту GitHub для співпраці. Ця платформа також дозволяє створити організацію, де ви можете надати членам різні ролі та права.

Як використовувати GitHub для WordPress

Ви повинні створити локальний сервер розробки перед розробкою та інтеграцією сайту WordPress із GitHub.

Існують різні рішення для створення сервера розробки. Однак ми можемо використовувати Місцевий WP для цієї статті.

Вимоги до інтеграції WordPress Github

• Git. Він попередньо встановлений, якщо у вас є комп’ютер, що працює на останній версії Linux або macOS. Ви можете скористатися цією командою, щоб перевірити, чи він доступний: git –version.
• Робочий обліковий запис GitHub. Якщо у вас немає Git і GitHub, ви можете використовувати цей посібник.
• Розуміння того, як працює WordPress

Встановити Local WP

• На сторінка випускувиберіть дистрибутив, який відповідає вашій операційній системі (я використовую Ubuntu).
• Після завантаження дотримуйтеся посібника зі встановлення відповідно до вашої операційної системи.

• Local WP запропонує вам створити безкоштовний обліковий запис. Ви можете пропустити цей крок, натиснувши кнопку «X».

• Виберіть перший варіант, який дозволяє створити новий сайт WordPress.

• Виберіть своє середовище. Наразі перейдемо до «Переважного».

• Налаштуйте ім’я користувача та пароль.

• Установіть додатковий компонент, який допоможе вам використовувати редактор коду. Ви переходите до кнопки розширення в лівій частині WP Local. Якщо ви використовуєте VS Code, ви можете встановити це:

Тепер у вас є сайт WordPress, який можна розробляти локально. Наступним кроком буде інтеграція сайту в GitHub.

Як підключити WordPress до GitHub

В інтерфейсі WP Local ви можете натиснути «Перейти до папки сайту», як показано на цьому знімку екрана.

Тепер ми можемо відкрити вихідний код сайту WordPress, який ми створили локально. Оскільки я використовую код VS, структура папок буде такою, як показано нижче:

Наразі не турбуйтеся про різні папки та файли.

Створіть репозиторій GitHub

Якщо у вас налаштовано Git і GitHub, ви можете виконати такі дії, щоб створити репозиторій і використовувати Git як засіб керування версіями:

• Увійдіть на GitHub і натисніть «Новий»

• Дайте вашому сховищу ім’я, яке запам’ятовується, установіть відповідні прапорці та натисніть «Створити репозиторій».

• Ініціалізуйте вихідний код із папки проекту WordPress. GitHub надасть вам кілька команд, які ви можете скопіювати та вставити у свій термінал, щоб почати. У вас будуть такі команди:

echo "# GitHub-WordPress" >> README.md
git init
git add README.md
git commit -m "first commit"
git branch -M main
git remote add origin [email protected]:username/repository-name.git
git push -u origin main

Замініть «username» і «repository-name» своїм іменем користувача та назвою сховища, яке ви вибрали на другому кроці.

• Надішліть джерело WordPress на GitHub. Ви використовуєте ці команди:

git add . (Це етапує всі файли у вашому проекті)

git commit -m «зафіксувати папку проекту»

git push (цей комміт надсилає всі файли на GitHub)

Після цих кроків ви інтегрували свій локальний сайт WordPress із GitHub.

Перевірте цей знімок екрана:

Ви помітите, що він має структуру папок, подібну до тієї, яку ми мали, коли відкривали вихідний код у редакторі коду.

Тепер ваша команда може клонувати репозиторій до своїх локальних машин створювати гілкипрацювати над різними функціями, фіксувати їх і надсилати на GitHub для зберігання.

Відредагуйте свій сайт WordPress

Більша частина кодування/створення буде в папці тем. Ви можете знайти цю папку за таким шляхом: app/public/wp-content/themes

У моїй папці є три теми, і я можу вибрати останню. Перед початком редагування мій сайт виглядає так:

Якщо я піду цим шляхом: app/public/wp-content/themes/templates/home.html, я зможу редагувати вміст домашньої сторінки.

Я можу змінити вміст

на домашній сторінці на «Це зразок інтеграції WordPress із GitHub».

Якщо я оновлю вміст локального сервера розробки, відобразиться ось що:

Як внести зміни в GitHub

Зміни, які я зробив вище, доступні лише локально. Ми можемо підготувати, зафіксувати та відправити їх на GitHub для зберігання. Виконайте такі дії:

• Виконайте цю команду: git status

Як бачите, на app/public/wp-content/themes/twentytwentythree/templates/home.html є невідстежувані файли

• Відредагуйте свої правки. Ви можете використовувати цю команду: git add .
• Здійснити. Використовуйте цю команду git commit -m «цей комміт редагує домашню сторінку»
• Проштовхніть зміни. Використовуйте цю команду: git push.

Якщо ми повернемося до репозиторію на GitHub, ми побачимо, що у нас є новий комміт, як показано на цьому знімку екрана.

Тепер ваша команда може вносити зміни, редагувати файли та надсилати їх до цього сховища.

Найкращі методи підтримки безперебійної інтеграції GitHub

• Скористайтеся перевагами контролю версій: найбільшою перевагою інтеграції WordPress із GitHub є функція контролю версій. Переконайтеся, що ви відстежуєте весь код, який ви пишете або змінюєте за допомогою контролю версій (Git)
• Створіть проміжне середовище: локальний сервер розробки є вашим проміжним середовищем. Перевіряйте всі зміни, які ви вносите на свій сайт WordPress через локальний сервер розробки, перш ніж здійснити їх і відправити на активний сайт.
• Використовуйте функцію .gitignore: вам не потрібно відстежувати кожну папку та файл під час розробки сайту WordPress. Ваша основна увага буде зосереджена на темах. Ви можете використовувати функцію .gitignore, щоб відстежувати лише релевантні зміни.
• Використовуйте гілки: у вас може бути кілька розробників, які одночасно працюють над різними функціями. Ви можете створити гілки для таких функцій і об’єднати їх із Main/Master після перевірки, чи все працює.
• Розробіть робочий процес: Хороший розробник повинен мати чіткий план, який показує всі етапи розробки. У вашому робочому процесі має бути вказано, коли тестувати та розгортати ваш сайт і які критерії мають бути виконані.
• Автоматизуйте тестування: використовуйте конвеєри безперервної інтеграції та безперервного розгортання (CD/CI), як-от Jenkins, щоб автоматично тестувати свій код під час розробки.
• Задокументуйте свою роботу: у документації має бути вказано, що робить кожна функція у вашому коді WordPress.

Висновок

Інтегрувати WordPress із GitHub легко, якщо виконати наведені вище дії. Наступним кроком є ​​надання вашим товаришам по команді посилання на репозиторій GitHub і призначення їм різних функцій для роботи. Якщо ви керуєте командою, ви завжди можете переглянути всі коміти, перш ніж їх затвердити. GitHub також полегшує доступ до вихідного коду, оскільки він зберігатиметься в хмарі.

З іншого боку, коли у вас є WordPress на вашому локальному комп’ютері, ви можете розмістити його на сторінках GitHub, якщо вам потрібен статичний веб-сайт. Ви також можете встановити різні плагіни з їхніх сховищ у своє локальне середовище розробки.

Ви можете переглянути нашу статтю про GitHub проти GitLab.