Mýliť sa je ľudské – toto prastaré príslovie môže pochádzať z čias, keď ešte neboli napísané prvé riadky kódu, no platí aj dnes. Robeniu chýb sa nedá vyhnúť, najmä ak ide o opakovanie. Pri nasadzovaní webových stránok opakovanie prechádza celým procesom.
Ak je vaša stránka dostatočne komplexná, možno budete musieť na začiatok spustiť určitý počet úloh NodeJS (inštalácia skriptov, konverzia SCSS na CSS atď.) alebo Composer (inštalácia knižníc, spustenie testov atď.). Potom budete musieť preniesť všetky súbory na server, vymazať vyrovnávaciu pamäť a uistiť sa, že všetko funguje tak, ako má.
Aj keď sa tieto úlohy opakujú, nie je také ťažké zvládnuť ich – teda keď lietate sólo. Čím viac ľudí začne pracovať na jednom projekte, tým je to komplikovanejšie.
Našťastie to môžete urobiť jednoduchým a odolným voči chybám pomocou automatizácie nasadenia WordPress.
V tejto príručke preskúmame, ako automatizovať opakujúce sa úlohy a urobiť z vášho procesu nasadenia hračku Kamarát. Poďme túto show na cestu!
Jediný zdroj pravdy: Git Repo
Skôr než začnete s prenosom súborov na server, zamyslime sa nad tým, čo môžete urobiť, aby ste zabezpečili, že každý člen tímu pracujúci na vašom projekte bude mať prístup k rovnakým súborom – to zahŕňa všetky zmeny zavedené ostatnými. To všetko môžete získať s Git. Bez toho, aby sme zachádzali do podrobností o samotnom Gite, tu je niekoľko vecí, ktoré vám tento systém na správu verzií poskytuje:
- Prístup k aktuálnej verzii súborov pre všetkých spolupracovníkov.
- Podrobná história zmien.
- Pobočky: spôsob, ako pracovať na zmenách v izolovaných prostrediach.
Keď začnete používať Git, môžete sa rozlúčiť s prepisovaním zmien pripravených inými vývojármi a zabudnúť na dni zisťovania, kedy a kde bol napísaný chybový kód.
Existuje mnoho spôsobov, ako používať Git:
- Pomocou príkazového riadku.
- Prostredníctvom nástrojov zabudovaných do populárnych editorov kódu, ako je Visual Studio Code.
- So špecializovanými nástrojmi, ako sú Gitkraken alebo Git Tower.
Zamyslime sa aj nad vecami, ktoré by ste mali mať v a Úložisko Git. Existuje mnoho stratégií a prístupov, ktoré sa menia v závislosti od toho, na čom práve pracujete. Ak chcete začať našu cestu, odporúčam použiť súbor .gitignore s týmto obsahom:
# Ignorujte všetko v koreňovom adresári okrem adresára „wp-content“.
/*
!.gitignore
!wp-content/
# Ignorujte všetko v adresári „wp-content“, okrem adresárov „mu-plugins“, „plugins“ a „themes“.
wp-content/*
!wp-content/mu-plugins/
!wp-content/plugins/
!wp-content/themes/
S touto konfiguráciou bude úložisko ukladať iba súbory z wp-content/plugins, wp-content/mu-pluginsa wp-content/themes.
Odporúčam prečítať tento článok GitKraken aby ste mohli začať s Git.
Pripojenie úložiska k Buddymu
Po nastavení úložiska ho pripojte k Buddymu. Najprv vyberte, kde budete hostiť svoje súbory. Vyberte si medzi GitHub, Bitbucket, GitLab, Buddy Git Hosting a súkromným serverom Git.
Keď pripojíte úložisko, Buddy vás vyzýva, aby ste pridali svoju prvú akciu a začali automatizovať.
Pridávanie potrubí
Čo je to potrubie? Predstavte si to ako súbor akcií vykonaných v určenom poradí, spustených udalosťou podľa vášho výberu.
Keď pridávate nový kanál, musíte definovať jeho názov, zvoliť spúšťač (manuálny, push do repo, opakovanie) a zvoliť vetvu, ktorú kanál spracováva.
Kliknutím na „Pridať nový kanál“ zobrazíte zoznam akcií.
Budovanie majetku a inštalácia knižníc
Vďaka správcom balíkov, ako je Composer alebo npm, si môžete výrazne uľahčiť život, pokiaľ ide o správu verzií balíkov a zabezpečenie vzájomnej kompatibility všetkých nainštalovaných knižníc alebo balíkov.
Okrem toho môžete vykonať veľa vecí pomocou skriptov spustených v programe Composer alebo npm:
- Konverzia SCSS na CSS
- Spustenie jednotkových testov
- Kontrola chýb v kóde s linters alebo PHPCS
Skôr než však začnete pridávať akcie do svojho kanála, odporúčam prečítať si tieto články:
Teraz, keď viete, ako používať týchto správcov balíkov, poďme sa zaoberať akciami. Ak chcete do svojho kanála pridať Composer, pridajte akciu PHP a zadajte tieto riadky do terminálu akcie:
cd wp-content/themes/THEME_NAME
inštalácia skladateľa
Ďalej nainštalujte knižnice a spustite skripty npm. Môžete to zvládnuť pridaním akcie NodeJS a zadaním týchto príkazov do terminálu akcie:
cd wp-content/themes/THEME_NAME
inštalácia npm
npm spustiť zostavenie
Príkaz npm run build nie je univerzálny – vaša aplikácia môže na spustenie zostáv použiť iný príkaz. Skontrolujte súbor package.json a zistite, aký príkaz sa používa na zostavenie.
V tomto bode by váš kanál mal vyzerať takto:
Unit testy a analýza kódu
Webová stránka je teda pripravená na nasadenie – všetky knižnice stiahnuté, všetky aktíva vytvorené. Teraz je to všetko o nahraní na server, však? Predtým, ako to urobíte, čo keby ste vykonali nejaké testy, ktoré skontrolujú, či kód, ktorý ste napísali, funguje tak, ako by mal?
Túto fázu testovania môžete zvládnuť niekoľkými rôznymi spôsobmi:
V závislosti od vašich konkrétnych potrieb sa rozhodnite, ktoré nástroje a prístupy sú pre vás vhodné.
Použite Composer na inštaláciu potrebných nástrojov a pridanie nových príkazov do súboru skladateľ.json, napríklad:
{
“scripts”: {
“test”: “vendor/bin/phpunit”,
“phpstan”: “vendor/bin/phpstan analyzovať testy src”
}
}
Po manipulácii s nástrojmi pridajte do svojho kanála akciu PHP a do terminálu akcie pridajte tieto príkazy:
inštalácia skladateľa
skladateľský test
skladateľ phpstan
Teraz by váš kanál mal vyzerať takto:
Nasadenie do prípravného prostredia
V tomto bode máte nielen celý svoj kód pripravený, ale je tiež skontrolovaný a otestovaný na prípadné chyby. Čas na nasadenie do výroby? Drž svoje kone, kovboj!
Najprv nasadíme lokalitu do pracovného prostredia. Ak máte server Hostinger, vytvorenie pracovného prostredia je mimoriadne jednoduché. Postupujte podľa tohto návodu a budete mať hotovo.
Keď je prostredie pripravené, je čas preniesť tam všetky súbory. Použite na to akciu SFTP v Buddy. Nezabudnite zadať správnu vzdialenú cestu — adresár, do ktorého sa súbory nahrávajú.
Je dobré použiť kartu Ignorovať cesty akcie na zadanie zoznamu súborov a adresárov, ktoré nechcete nahrať na server, napr. node_modules.
Keď je všetko nahrané na pracovný server, musíte sa uistiť, že sa žiadne ďalšie akcie nespustia bez vášho konkrétneho súhlasu. prečo? Skutočnosť, že kód bol dôkladne otestovaný, automaticky neznamená, že ho chcete hneď tlačiť do výroby.
Niekedy tím QA chce kliknúť a skontrolovať niekoľko vecí manuálne. Mali by ste im na to dať príležitosť.
Na uľahčenie pridajte akciu Čakať na schválenie, ktorá zastaví vykonávanie akýchkoľvek následných krokov, kým ich neschváli osoba so správnymi povoleniami.
Takto by malo vaše potrubie teraz vyzerať:
Dodatočné testy
Viem, že je lákavé len schváliť realizáciu, mať to za sebou a nasadiť aplikáciu do produkcie. Ale holé so mnou – urobme ďalšie testy a uistite sa, že nič nie je zlomené. Stojí to za to, verte mi!
Buddy má niekoľko akcií, ktoré môžete použiť na spustenie ďalších testov. Určite vás poteší, že nevyžadujú takmer žiadnu dodatočnú konfiguráciu.
Začnime s Vizuálne testy, čo sú regresné testy, ktoré vám umožňujú skontrolovať, či sa vzhľad špecifikovaných sekcií nezmenil nežiaducim spôsobom. Ak to chcete urobiť, jednoducho pridajte zoznam stránok, ktoré chceme porovnať. Ak Buddy zistí rozdiely medzi stránkami, musíte mu dať zelenú, aby ste označili akciu za úspešnú.
Ďalej sa oplatí skontrolovať, či naše zmeny nemajú negatívny vplyv na hodnotenie rýchlosti stránky Google. Nechceme spomaliť načítanie stránky. Ak to chcete zmerať, môžete použiť Maják akcie. Jediné, čo musíte urobiť, je určiť stránku, ktorú chcete testovať, a prahové hodnoty pre výsledky.
Posledná vec, ktorú sa oplatí skontrolovať, je, či všetky odkazy na vašej stránke skutočne fungujú. Ak to chcete urobiť, môžete použiť Validátor odkazov akciu, ktorá skontroluje, či niektorý z odkazov na vašom webe vracia chybné stavové odpovede 4xx alebo 5xx.
Je toto všetko, čo môžete urobiť? Samozrejme, že nie! Nebudem však opisovať VŠETKO. Zaoberali sme sa najuniverzálnejšími a najužitočnejšími prípadmi, ale pokojne si prečítajte aj ďalšie zaujímavé akcie tu.
Takto by mal váš kanál vyzerať po pridaní všetkých dodatočných testov:
Nasadenie do výroby
Dobre, teraz je čas nasadiť do výroby. Konečne!
Prvý krok — aktivácia režimu údržby pomocou WP-CLI. Aby sa to stalo, pridajte akciu SSH, nakonfigurujte podrobnosti prístupu k serveru a pridajte tieto príkazy do terminálu akcie:
cd public_html
aktivujte režim údržby wp
Vďaka tomu dostane používateľ pri nahrávaní súborov na server príslušnú správu o výpadku.
Ďalej pridajte akciu SFTP, ktorá prenesie všetky súbory na server. Konfigurácia akcie bude veľmi podobná konfigurácii, ktorú sme použili na prenos súborov na pracovný server:
Potom pridajte ďalšiu akciu SSH, ktorá deaktivuje režim údržby. Pridajte tieto príkazy do terminálu akcie:
cd public_html
wp režim údržby deaktivovať
Po vykonaní všetkých týchto krokov je dobré upozorniť všetkých relevantných ľudí, ktorí používajú Slack, Telegram alebo iné komunikačné médiá. Prečítajte si viac o všetkých dostupných integráciách tu.
Neprestaňte posielať upozornenia, keď všetko ide podľa plánu. Je dobré komunikovať, keď sa niečo pokazí, aby váš tím mohol zasiahnuť a opraviť chyby čo najskôr.
Takto vyzerá konečný kanál, keď používate Slack na upozornenia:
Teraz poznáte automatizáciu nasadenia WordPress
Vďaka automatizácii a testom nasadenia WordPress vám nasadenie do produkcie už nebude spôsobovať nočné mory.
Aj keď vám implementácia prezentovaného postupu môže chvíľu trvať, nikto nehovorí, že tieto kroky nemôžete pridávať postupne.
Môžete začať jednoducho s vytvorením svojich aktív a nasadením. Potom sa oplatí stráviť nejaký čas pridávaním testov do mixu — začnite tými, ktoré nevyžadujú príliš veľa konfigurácie, ako napríklad PHPCS alebo PHPStan. Prípadne môžete použiť testovacie akcie, ktoré Buddy ponúka – vizuálne testy, maják atď.
Keď budete pripravení, vytiahnite veľké zbrane a pridajte testy, ktoré si musíte pripraviť sami, ako napríklad PHP Unit alebo Cypress.io.
