Zrozumienie konfiguracji Frontity React Framework dla WordPress

Frontity to nowa, gorąca platforma front-end do tworzenia szybkich witryn WordPress

WordPress od dawna jest najpopularniejszym systemem zarządzania treścią. Nie tylko obsługuje ponad 30% witryn w Internecie, ale także może pochwalić się ogromną społecznością współtwórców, którzy utrzymują żywy i silny ekosystem WordPress.

WordPress to przede wszystkim oprogramowanie serwerowe oparte na PHP. Istnieją tysiące niestandardowych ulepszeń i rozszerzeń do WordPressa, które są głównie w formie wtyczek opartych na PHP. Nic więc dziwnego, że pojawiło się wiele prób integracji frameworków innych niż PHP z WordPress, zwłaszcza frameworków JavaScript, które szybko przejmują przestrzeń Frontendu w tworzeniu stron internetowych.

Jednym z takich frameworków, który naprawdę wspina się na listach przebojów, jest framework React.js dla WordPressa o nazwie Frontity. Jest rozwijany przez startup z siedzibą w Hiszpanii. Rozwój Frontity trwa już od kilku lat. Jednak ostatnio pojawiła się wiadomość, gdy zebrała rundę 1 miliona euro kierowaną przez firmę stojącą za WordPressem, Automatyczne i venture capital KFundName. Aby zrozumieć przyczynę tego, należy najpierw zrozumieć, czym jest struktura Frontity i jakie przynosi korzyści.

Co to jest Frontity?

Zanim dowiemy się o Frontity, niezbędna jest znajomość podstawowej architektury WordPressa. Jak być może wiesz, WordPress to oprogramowanie serwerowe oparte na PHP. Wymaga oprogramowania serwerowego, takiego jak Apache lub Nginx, do obsługi żądań oraz oprogramowania bazodanowego, takiego jak MySQL, do przechowywania danych (posty, strony, użytkownicy itp.).

Architektura WordPress

Po otwarciu powiedz, że strona główna witryny WordPress zadzwoni index.php w backendzie, który zwróci kod HTML, CSS i JS dla strony głównej, która następnie zostanie wyświetlona w przeglądarce. W ten sposób PHP działa jako Common Gateway Interface (CGI) dla strony internetowej i dlatego wszelkie ulepszenia frontendu muszą być oparte na PHP.

Architektura frontowa

Ponieważ Frontity to React-based framework, porozmawiajmy najpierw trochę o React JS. React to front-endowy framework Javascript opracowany i opublikowany przez Facebook. Jest niezwykle popularny ze względu na łatwość tworzenia szybkich, stabilnych i responsywnych interfejsów użytkownika. React działa jako moduł Node JS i dlatego strona korzystająca z Reacta musi być oparta na serwerze Node JS.

Teraz, jeśli chcesz używać wyłącznie frameworka JavaScript, takiego jak React, do ulepszania interfejsu, tj. do tworzenia niestandardowych motywów, jest to kłopotliwe. Powodem jest to, że framework taki jak React działa w połączeniu z Node, który uruchamia własny serwer. Jak wspomnieliśmy wcześniej, WordPress współpracuje z serwerem PHP CGI na zapleczu. Dlatego nie ma prostego sposobu na tworzenie niestandardowych motywów i interfejsów użytkownika za pomocą React dla WordPress.

Istnieje jednak sposób na zdalne pobieranie danych z bazy danych WordPress. Można to zrobić za pomocą WordPress REST API, który jest w pełni zintegrowany z rdzeniem WordPressa od wersji WP 4.7 i nowszych. Jeśli możemy zdalnie pobrać dane WordPress, oznacza to, że możemy teraz wyświetlać pobrane dane tak, jak chcemy. Użytkownicy od dawna używają REST API do tworzenia niestandardowych aplikacji, stron internetowych, aby uzyskać dostęp do danych WordPress bezpośrednio z bazy danych. Tego typu systemy zarządzania treścią (CMS) są również określane jako bezgłowy CMS.

Frontity opiera się na tej właśnie koncepcji. Łączy się z bazą danych WordPress przez REST API, zajmuje się parsowaniem i porządkowaniem pobranych danych. Pozostawia tobie, jakiego motywu chcesz użyć do wyświetlenia strony. Ponieważ jest oparty na React, każdy motyw React może być użyty na stronie internetowej. Jeśli chcesz, możesz również opracować własny motyw niestandardowy. Frontend WordPress oparty na PHP będzie nadal używany przez twórców/administratorów do tworzenia treści lub zmiany ustawień. Ale frontend oparty na Frontity będzie używany jako strona główna witryny.

Tak więc w konfiguracji Frontity wymagane będą dwa serwery: jeden to serwer WordPress, który ma uruchomiony REST API i zwraca dane WordPress, a drugi to serwer Node JS, na którym działa Frontity, aby wywoływać REST API i wyświetlać dane za pomocą React .

Droga naprzód?

Ponieważ firma stojąca za WordPressem zebrała 1 milion euro, a React wprowadziła bogate doświadczenie użytkownika do WordPressa, nie będzie przesadą stwierdzenie, że Frontity jest drogą naprzód dla współczesnych stron internetowych opartych na WordPressie. Interfejs użytkownika WordPress będzie nadal używany jako pulpit nawigacyjny do tworzenia treści, podczas gdy część wyświetlająca zostanie przeniesiona na serwer Frontity.

Możesz przeczytać więcej o Frontity tutaj. Jeśli masz witrynę WordPress i chcesz wypróbować Frontity, możesz wykonać opisane tutaj kroki, aby to zrobić.