Pochopenie rámca Frontity React nastaveného pre WordPress

Frontity je horúci nový front-end rámec na vytváranie rýchlych webových stránok WordPress

WordPress je už dlhú dobu najpopulárnejším redakčným systémom. Nielenže poháňa viac ako 30 % webových stránok na internete, ale môže sa pochváliť aj obrovskou komunitou prispievateľov, ktorí udržiavajú ekosystém WordPress pri živote a sile.

WordPress je primárne serverový softvér založený na PHP. Existujú tisíce vlastných vylepšení a rozšírení WordPress, ktoré sú hlavne vo forme doplnkov založených na PHP. Nie je preto prekvapením, že bolo veľa pokusov integrovať rámce bez PHP s WordPress, najmä rámce Javascript, ktoré rýchlo preberajú frontendový priestor vo vývoji webu.

Jedným takým rámcom, ktorý skutočne stúpa v rebríčkoch, je rámec React.js pre WordPress s názvom Frontity. Je vyvinutý startupom so sídlom v Španielsku. Vývoj pre Frontity prebieha už pár rokov. Nedávno však zverejnila správy, keď získala 1 milión EUR pod vedením spoločnosti stojacej za WordPress, Automatické a spoločnosť rizikového kapitálu KFund. Aby sme pochopili dôvod, ktorý je za tým, je najprv dôležité pochopiť, čo je rámec Frontity a aké výhody prináša.

Čo je Frontity?

Predtým, ako sa dozvieme o Frontity, je nevyhnutné poznať základnú architektúru WordPress. Ako možno viete, WordPress je serverový softvér založený na PHP. Vyžaduje serverový softvér, ako je Apache alebo Nginx, na obsluhu požiadaviek a databázový softvér, ako je MySQL, na ukladanie údajov (príspevky, stránky, používatelia atď.).

Architektúra WordPress

Keď otvoríte povedzme hlavnú stránku webu WordPress, zavolá sa index.php súbor v backende, ktorý vráti HTML, CSS a JS pre domovskú stránku, ktorá sa potom zobrazí v prehliadači. PHP teda funguje ako Common Gateway Interface (CGI) pre webovú stránku, a preto akékoľvek vylepšenia frontendu musia byť založené na PHP.

Frontitná architektúra

Keďže Frontity je a React-based framework, povedzme si najprv niečo o React JS. React je frontendový Javascript framework vyvinutý a publikovaný Facebookom. Je mimoriadne populárny vďaka svojej šikovnosti pri vytváraní rýchlych, stabilných a pohotových používateľských rozhraní. React funguje ako modul Node JS, a preto webová stránka používajúca React musí byť založená na serveri Node JS.

Teraz, ak chcete použiť čisto Javascriptový rámec, ako je React, na vylepšenie frontendu, t. j. na vytváranie vlastných tém, je to ťažkopádne. Dôvodom je, že rámec ako React funguje v spojení s Node, ktorý spúšťa vlastný server. A ako sme už spomenuli, WordPress pracuje s PHP CGI serverom na backende. Neexistuje teda žiadny priamy spôsob, ako vytvoriť vlastné témy a používateľské rozhrania pomocou React for WordPress.

Existuje však spôsob, ako získať údaje z databázy WordPress na diaľku. Dá sa to urobiť pomocou WordPress REST API, ktoré je plne integrované v jadre WordPress od verzie WP 4.7 a vyššej. Ak dokážeme načítať údaje WordPress na diaľku, znamená to, že teraz môžeme načítané údaje zobraziť tak, ako chceme. Používatelia už dlhú dobu používajú REST API na vývoj vlastných aplikácií a webových stránok na prístup k údajom WordPress priamo z databázy. Tieto typy systémov na správu obsahu (CMS) sa tiež označujú ako bezhlavý CMS.

Frontity je založený práve na tomto koncepte. Cez REST API sa pripája k databáze WordPress, stará sa o parsovanie a organizáciu načítaných dát. Nechá na vás, akú tému by ste chceli použiť na zobrazenie webovej stránky. Keďže je založený na React, pre webovú stránku možno použiť akúkoľvek tému React. Môžete si tiež vytvoriť vlastnú tému, ak sa tak rozhodnete. Tvorcovia/správcovia budú naďalej používať frontend WordPress založený na PHP na vytváranie obsahu alebo zmenu nastavení. Ako hlavná stránka webu sa však použije frontend založený na frontende.

V nastavení Frontity teda budú potrebné dva servery: jeden je server WordPress, ktorý má spustené REST API a vracia údaje WordPress, a druhý je server Node JS, ktorý spúšťa Frontity na volanie REST API a zobrazenie údajov pomocou React. .

Cesta vpred?

Keďže spoločnosť stojaca za WordPressom získala 1 milión eur a React prinášal do WordPressu bohatú používateľskú skúsenosť, nebude prehnané povedať, že Frontity je cestou vpred pre moderné webové stránky poháňané WordPress. Používateľské rozhranie WordPress sa bude naďalej používať ako informačný panel na vytváranie obsahu, zatiaľ čo zobrazovacia časť sa presunie na server Frontity.

Viac o Frontite si môžete prečítať tu. Ak máte webovú stránku WordPress a chcete vyskúšať Frontity, postupujte podľa krokov uvedených tu.