Dzisiejszy wpis poświęcimy Gatsby.js – trochę bardziej technicznym aspektom tworzenia stron internetowych, nie znaczy to jednak, że dla naszych klientów, zupełnie nie zaznajomionych z kodowaniem będzie on bezużyteczny!
W Website Style wiemy, jak przekazywać wiedzę tak, by była ona zrozumiała i czytelna dla wszystkich naszych odbiorców.
Gatsby.js – co to jest?
To nowoczesny framework, który umożliwia budowę szybkich stron internetowych i aplikacji webowych. Działa w oparciu o React oraz GraphQL. Jego podstawowym zadaniem, a jednocześnie ogromną zaletą, jest optymalizacja kodu źródłowego strony.
Co wyróżnia Gatsby od innych frameworków?
- po pierwsze płynność: szybkość ładowania i działania witryn przygotowanych w oparciu o statyczne generatory stron (np. Hugo czy Jekyl),
- dynamiczne elementy aplikacji tworzonych z wykorzystaniem innych frameworków;
- wygodne i optymalne środowisko developerskie;
- możliwość zarządzania treściami z poziomu popularnych systemów CMS, np WordPress.
Podsumowując, strony stworzone przy użyciu Gatsby będą bardzo szybkie, wydajne oraz dobrze zoptymalizowana pod kątem SEO. Twórcy włożyli dużo pracy w optymalizację szybkości działania stron tworzonych przy jego pomocy. Internetowe strony www przygotowane z wykorzystaniem Gatsby są bezpieczniejsze niż oparte o tradycyjne systemy CMS. Dzięki budowaniu statycznych zasobów strony, podczas jej wczytywania przez użytkownika po stronie serwera nie jest wykonywany żaden kod.
Dlaczego warto?
- Przede wszystkim – strony oparte o framework Gatsby są szybkie i wydajne. Jest to główna zaleta oprogramowania, która w obecnym świecie, jak wiadomo jest bardzo ważna.
Framework w trakcie prac, twory statyczne pliki strony, których wczytywanie jest wręcz natychmiastowe. Podczas ładowania witryn, po stronie serwera nie są wykonywane żadne dodatkowe skrypty, toteż, zwracany jest statyczny plik html, css i js.
Po wczytaniu podstawowej struktury, treści i stylów strony doczytywany jest JavaScript, który uruchamia aplikację React i wstępnie ładuje część danych dotyczących pozostałych podstron. Dzięki temu przejście na inną podstronę nie wymaga przeładowania całej strony. Pobierze tylko treści danej podstrony i dynamicznie podmieni te części, które się zmieniły.
- Bezpieczeństwo
czyli coś, co jest w dzisiejszych czasach niezwykle ważne. Nie raz, nie dwa musieliśmy szybko reagować i udaremniać ataki spamerskie i hakerskie na stronach internetowych naszych klientów. Dlatego też, przykładamy wielką wagę do bezpieczeństwa naszych wszystkich rozwiązań i tworzonych serwisów.
Stosując Gatscy.js, dzięki budowaniu statycznych zasobów strony, podczas jej odczytywania przez użytkownika po stronie serwera nie jest wykonywany żaden kod.
CMS, w którym przygotowywane są treści (np. WordPress) można postawić w lokalnej sieci, za firewallem i na zewnątrz wystawiać tylko rozbudowaną wersję strony. Dzięki temu z zewnątrz w ogóle nie będzie dostępu nawet do panelu logowania systemu CMS, co praktycznie zmniejsza do zera niebezpieczeństwo włamów.
- Wtyczki
Gatsby umożliwia wielu danych z wielu źródeł na raz – jest to szczególnie ważne w przypadku większych portali, które po jakimś czasie klienci chcą połączyć w jeden serwis, zarządzany z jednego miejsca. Przykładowo, wpisy blogowe możemy uzupełniać w systemie WordPress, a produkty sklepowe mieć na platformie Presta – i możemy całość spiąć jednym front-endowym rozwiązaniem, Gatsby.js
Co ciekawe, framework oferuje także całkiem pokaźną bibliotekę wtyczek, które bardzo przypominają te dostępne na WordPressie – możemy wybierać spośród pluginów do optymalizacji obrazów w kontekście wyświetlania responsywnego czy pod kątem SEO.
- Indeksowanie
Stworzenie strony korzystając z Gatsby, zapewnia też pełne indeksowanie w wyszukiwarkach, mimo oparcia całej witryny o ReactJS. Podczas procesu budowania wszystkie podstrony i ich treści są renderowane do statycznych plików HTML i w momencie wczytania strony przez użytkownika najpierw zwracany jest HTML i CSS, a dopiero później jest ładowana aplikacja React. Dzięki temu podczas indeksowania, roboty wyszukiwarek mogą odczytać i zaindeksować całą treść strony czytając tylko HTML
- Udogodnienia dla programistów
Czyli coś, co mocno usprawnia prace developerskie – a jak wiadomo, im szybciej developer będzie w stanie ingerować w kod strony, tym łatwiej i niższym kosztem będziemy w stanie nanosić na nie zmiany i wdrażać kolejne elementy.
Lokalną deweloperską wersję strony można uruchomić jedną komendą, a wszystkie wprowadzane zmiany w kodzie są automatycznie, w czasie rzeczywistym na niej odzwierciedlane. Środowisko jest skonfigurowane tak, aby można było korzystać z najnowszych technologii, które w razie potrzeby zostaną skompilowane do wersji wspierających starsze przeglądarki
Jeśli oprogramowanie Gatsby to temat, którym Cię właśnie zaciekawiliśmy, jeśli chciałbyś odświeżyć swoją istniejącą już witrynę firmową – zachęcamy do wypełnienia krótkiej ankiety projektowej i skontaktowania się z nami. Doradzimy, wycenimy i jak zawsze – damy z siebie 100% aby efekt końcowy zachwycił nie tylko Ciebie, ale i Twoich klientów.
