Förstå Frontity React Framework som konfigurerats för WordPress

Frontity är det heta nya front-end-ramverket för att skapa snabba WordPress-webbplatser

WordPress har varit det mest populära innehållshanteringssystemet under lång tid nu. Den har inte bara makten över 30 % av webbsidorna på Internet, utan den har också en enorm gemenskap av bidragsgivare som håller WordPress-ekosystemet levande och starkt.

WordPress är i första hand en PHP-baserad servermjukvara. Det finns tusentals anpassade förbättringar och tillägg till WordPress som huvudsakligen är i form av PHP-baserade plugins. Det har således inte överraskande gjorts många försök att integrera icke-PHP-ramverk med WordPress, särskilt Javascript-ramverk som snabbt tar över frontend-utrymmet inom webbutveckling.

Ett sådant ramverk som verkligen klättrar på listorna är ett React.js-ramverk för WordPress som heter Frontity. Det är utvecklat av en startup baserad från Spanien. Utveckling för Frontity har pågått i ett par år. Men det kom nyligen med nyheter när det samlade in 1 miljon euro under ledning av företaget bakom WordPress, Automatisk och riskkapitalbolag KFund. För att förstå orsaken bakom detta är det först viktigt att förstå vad Frontity-ramverket är och vilka fördelar det medför.

Vad är Frontity?

Innan vi lär oss om Frontity är det viktigt att känna till den grundläggande arkitekturen för WordPress. Som du kanske vet är WordPress en PHP-baserad servermjukvara. Det kräver en serverprogramvara som Apache eller Nginx för att betjäna förfrågningar och en databasprogramvara som MySQL för lagring av data (inlägg, sidor, användare, etc.).

WordPress arkitektur

När du öppnar, säg huvudsidan på WordPress-webbplatsen, kommer den att ringa index.php fil i backend, vilket kommer att returnera HTML, CSS och JS för startsidan som sedan kommer att visas i webbläsaren. Således fungerar PHP som ett Common Gateway Interface (CGI) för webbplatsen och därför måste alla typer av förbättringar av frontend vara PHP-baserade.

Frontity arkitektur

Eftersom Frontity är en Reagera-based framework, låt oss prata lite om React JS först. React är ett front-end Javascript-ramverk utvecklat och publicerat av Facebook. Det är extremt populärt på grund av dess smidighet att skapa snabba, stabila, lyhörda användargränssnitt. React fungerar som en Node JS-modul och därför måste en webbplats som använder React vara baserad på en Node JS-server.

Nu, om du vill använda ett rent Javascript-ramverk som React för att förbättra frontend, det vill säga skapa anpassade teman, är det besvärligt att göra det. Anledningen är att ett ramverk som React fungerar tillsammans med Node, som startar en egen server. Och som vi nämnde tidigare, fungerar WordPress med en PHP CGI-server på backend. Det finns alltså inget enkelt sätt att bygga anpassade teman och användargränssnitt med hjälp av React för WordPress.

Det finns dock ett sätt att hämta data från WordPress-databasen på distans. Det kan göras med WordPress REST API, som är helt integrerat i kärnan i WordPress sedan WP version 4.7 och senare. Om vi ​​kan hämta WordPress-data på distans betyder det att vi nu kan visa hämtad data som vi vill. Användare har använt REST API under lång tid för att utveckla anpassade appar, webbsidor för att komma åt WordPress-data direkt från databasen. Dessa typer av innehållshanteringssystem (CMS) kallas också huvudlös CMS.

Frontity bygger på just detta koncept. Den ansluter till en WordPress-databas via REST API, tar hand om att analysera och organisera den hämtade datan. Det överlåter till dig vilket tema du vill använda för att visa webbplatsen. Eftersom det är baserat på React kan vilket React-tema som helst användas för webbplatsen. Du kan också utveckla ditt anpassade tema om du så vill. Det PHP-baserade gränssnittet av WordPress kommer fortfarande att användas av skapare/administratörer för att skapa innehåll eller ändra inställningar. Men Frontity-baserat gränssnitt kommer att användas som huvudsida på webbplatsen.

Således kommer det att krävas två servrar i en Frontity-installation: en är WordPress-servern, som har REST API igång och returnerar WordPress-data, och den andra är Node JS-server som kör Frontity för att anropa REST API och visa data med hjälp av React .

Vägen framåt?

Med företaget bakom WordPress som samlar in 1 miljon euro och React ger en rik användarupplevelse till WordPress, kommer det inte att vara en överdrift att säga att Frontity är vägen framåt för moderna WordPress-drivna webbplatser. WordPress UI kommer att fortsätta att användas som en instrumentpanel för att skapa innehåll medan visningsdelen kommer att flyttas till Frontity-servern.

Du kan läsa mer om Frontity här. Om du har en WordPress-webbplats och vill prova Frontity kan du följa stegen som nämns här för att göra det.