Što je Gatsby? Je li riječ o natjecatelju za WordPress?

Što je Gatsby


Sa toliko mogućnosti za stvaranje web stranice ili bloga 2020. godine vani, tu je nova stvar koja se zove Gatsby – najmlađi igrač igre koji bi mogao biti samo održiva alternativa klasičnim putevima WordPressa, Joomle i puno toga. Ili je? Što je uopće Gatsby? Koliko je lako postaviti i implementirati web mjesto na Gatsbyju? Kako se Gatsby uspoređuje s WordPressom? Na to je pitanje puno odgovora.

Ovo je korak po korak vodič za početak rada s Gatsby-om plus usporedba s WordPress-om. Do kraja ovog posta trebali biste biti u mogućnosti odgovoriti odgovara li Gatsby vašoj web stranici.

Što je Gatsby?

Gatsby

Najjednostavniji odgovor na "što je Gatsby" pitanje je ovo: Gatsby (aka. GatsbyJS) je generator statičkih stranica koji je izgrađen na ReactJS.

U svojoj najjednostavnijoj definiciji, statična web stranica je skupina HTML stranica koja ne izvlači nikakve podatke iz baze podataka kada je gledatelj posjeti. Dakle, statično mjesto izgleda isto kao i svaki posjetitelj. Statičke web stranice također se brže učitavaju jer poslužitelj šalje isti odgovor svakom posjetitelju. Međutim, ne možete prilagoditi sadržaj za posjetitelje.

S druge strane, web mjesto s WordPressom dinamično je, što znači da prikazani sadržaj ovisi o posjetitelju. Poslužitelj analizira svaki zahtjev i odlučuje kako odgovoriti.

�� Ideja o "statična web stranica za WordPress" nešto smo istražili u jednom od prethodnih postova na ovom blogu – aka. bezglava WordPress. Gatsby je još jedna tehnologija koja omogućuje statički WordPress ili statičku alternativu WordPressu.

Početak rada s Gatsbyjem

U redu, sada kada znamo što je Gatsby, naučimo kako najbolje započeti s tim:

Gatsby je izgrađen s Reactom, tako da je potrebno neko znanje o JavaScript-u i njegovim okvirima prije nego što stvarno krenete na zemlju. Evo vodiča na JavaScriptu za WordPress programere.

Prije nego što stvorite razvojnu verziju svoje web stranice na Gatsbyju, prvi korak je pripremiti vaš sustav za instalaciju Gatsbyja. Budući da je Gatsby izgrađen s Reactom, upravljanje paketom vrši se kroz npm, što je dio bilo koje NodeJS instalacije.

Ako vaš razvojni stroj radi na Windows ili MacOS, možete jednostavno koristiti jedan od instalacijski programi na stranici za preuzimanje NodeJS. U Linux okruženju možete koristiti instalacijski paket poput yum ili apt da biste ga instalirali.

sudo apt update
sudo apt instalirati nodejs npm

Uz to, Gatsby zahtijeva da instalirate Git, alat za kontrolu verzija, kao preduvjet za izradu razvojne web stranice. Idi preko stranica za preuzimanje git-a da biste dobili instalacijski program. Imajte na umu da ako već koristite GUI agent za Git, kao što je GitHub Desktop ili SourceTree, možda ćete ipak trebati zasebno instalirati Git da biste ga koristili kao naredbu na terminalu.

Uz instalirane zahtjeve, napokon ste spremni za instaliranje Gatsbyja! Evo brzi vodič za početak iz Gatsbyjeve dokumentacije.

Otvorite naredbeni redak NodeJS koji dolazi kao dio aplikacije u sustavu Windows, a koju možete pokrenuti iz svog startnog izbornika. U sustavu temeljenom na Unixu, kao što je Linux ili MacOS, u terminal možete upisati naredbeni čvor da biste pokrenuli naredbeni redak NodeJS. Da biste instalirali GatsbyJS, koristite instalacijski program npm. Opcija -g čini paket dostupan svim korisnicima u vašem sustavu.

npm instaliraj -g gatsby-cli

Instalacijski program vodi računa o svim ovisnostima paketa. Nakon uspješne instalacije spremni ste stvoriti svoju prvu GatsbyJS stranicu.

Stvorite svoju prvu Gatsby stranicu

Za stvaranje Gatsby stranice trebate pokrenuti sljedeću naredbu u naredbenom retku NodeJS.

gatsby nova moja stranica

Ovo je korak koji zahtijeva Git. Kada stvorite novu instancu Gatsby, ona klonira podatke iz zadana tema startera od Gatsbyja i sprema ga u direktorij moje web stranice. Mi ćemo raspravljati o Gatsby-ovim početnim temama u sljedećem odjeljku.

Kako biste pregledali razvojnu verziju web mjesta, promijenite aktivni direktorij u novostvoreni direktorij moje web lokacije i pokrenite razvojni poslužitelj.

cd moja stranica
razvija se gatsby

Kad dobijete poruku o uspjehu, prijeđite na http: // localhost: 8000 da biste provjerili trenutnu verziju svoje web stranice. Najvjerojatnije će izgledati ovako:

Prvo mjesto

Prije nego što unesemo bilo kakve promjene u sadržaj, prođite kroz postupak stvaranja izrade proizvodnje za web mjesto. Za početak izrade statičkih stranica za vaše web mjesto koristite sljedeću naredbu:

gatsby graditi

Primijetit ćete da se statičke datoteke stvaraju u javnom direktoriju unutar moje web stranice. Da biste pokrenuli lokalni HTML poslužitelj koji će vašu web stranicu prikazati u statičkom obliku koji je spreman za proizvodnju, trebate koristiti sljedeću naredbu. Imajte na umu da prije pokretanja posluživanja morate koristiti naredbu build.

gatsby poslužiti

Kao što je naznačeno u poruci o uspjehu, možete se uputiti na http: // localhost: 9000 da biste provjerili statičku verziju novostvorene web stranice.

Gatsby starta i teme

Kad ste instalirali praznu Gatsby stranicu, klonirali su je zadani početni predložak iz GitHub-a. Pokretači su u potpunosti funkcionalne Gatsby stranice koje se mogu klonirati i ponovo upotrebljavati putem Gatsby CLI. Možete smisliti pokretač kao početni predložak na kojem ćete graditi svoju web stranicu. Zajednica GatsbyJS izgradila je mnoge početnike imajući u vidu razne potrebe poput bloganja, e-trgovine i dokumentacije..

Gatsby drži knjižnica startera za dokumentiranje svih pokretača koje možete koristiti. Od travnja 2019. tu je izbor od preko 150 započinjenih!

gatsby starteri

Iako početnici pružaju sjajnu platformu za izgradnju web stranice u gotovo nikakvom vremenu, oni nisu sjajna ideja u ozbiljnijim scenarijima razvoja. Primarni razlog za to je nemogućnost ažuriranja startera tijekom vremena.

Krajem 2018. Gatsby uveo koncept tema. Omogućila je upotrebu datoteke gatsby-config.js za stvaranje teme za višekratnu upotrebu. Ovo je velika promjena u onome što je Gatsby i za što je sposoban, posebno u usporedbi s WordPressom.

Tamo je zajednica programera za Gatsby teme, međutim, treba učiniti mnogo da se dođe do tema spremnih za proizvodnju – nešto što uopće nije problem sa WordPressom.

Migracija na Gatsbyja

Najlakši način unošenja postova u Gastby je putem Markdown-a. Bez obzira na blog koji možda imate, rezultate morate izvesti u Markdown format da biste sve premjestili u Gatsby.

Kao što je rečeno, većina platformi za web stranice, uključujući WordPress, ne nude Markdown izvoz izvan okvira, tako da ćete prvo morati izvesti svoj sadržaj u HTML ili XML, a tek onda sve pretvoriti u Markdown. Jednom kada su vaše Markdown stranice spremne, evo vodič za dodavanje popisa Markdown postova do Gatsbyja.

Ako su vam na razvojnom stroju instalirani WordPress i Gatsby, možda ćete htjeti istražiti paket gatsby-wordpress-migrate u npm. Stranica paketa sadrži upute kako to učiniti prelaze s WordPressa.

Uz to, migracija s nedavne verzije WordPressa može biti lakša uz pomoć WordPress REST API-ja. Ovdje je korak po korak vodič kako koristiti GraphQL i WordPress Rest API za dobivanje postova s ​​vašeg WordPress bloga do Gatsbyja.

Gatsbyjeve prednosti i nedostaci

Postoje određene prednosti korištenja Gatsbyja koje mogu biti privlačne potencijalnim korisnicima. Web-lokacija izrađena s Gatsbyjem u osnovi je aplikacija za jednu stranicu. To znači da klikom na internu vezu ne postoji potreba za učitavanjem potpuno novog resursa, što zauzvrat štedi puno HTTP zahtjeva. U WordPressu morate slijediti određene najbolje prakse kako biste bili sigurni da je vaša web lokacija optimizirana za brzinu ili da su vaše slike optimizirane..

Na primjer, u Gatsbyju je optimizacija slike automatska. Za početak, Gatsby uklanja sve metapodate sa slika, mijenja ih veličinu i komprimira, a također provodi lijeno učitavanje! U WordPressu predlažemo korištenje usluge poput Optimole za optimizaciju slike.

Nadalje, Gatsby također obavlja i druge zadatke poput spajanja i Reduciranje resursa na vašoj web stranici prije posluživanja. I na kraju, kako je web mjesto statično, svako ažuriranje odražava se u proizvodnoj verziji čim stigne guranje.

Općenito, statičke web lokacije također su sigurnije jer u stvari nema nigdje hakera, osim probijanja samog poslužitelja. Uz WordPress, svi dobivaju pristup osnovnim PHP datotekama koje mogu biti osjetljive na više različitih napada. S mnogim WordPress web lokacijama koje koriste više od 20 dodataka istovremeno, postoji opravdana šansa da se jedan od tih dodataka iskoristi i koristi kao gateway za proboj na vašu web lokaciju. Kao da se dogodilo ne tako davno s dodatkom P3.

Gatsby vs WordPress

U ovom trenutku, svi možemo razumjeti temeljne razlike između Gatsbyja i WordPressa: jedan je statički generator web stranica, a drugi je potpuno razvijen dinamički motor web mjesta i CMS, ali pogledajmo svaki pojedinačni aspekt:

Jednostavnost stvaranja nove stranice uz Gatsby vs WordPress

U usporedbi s WordPressom, rekao bih da instalacija Gatsbyja zahtijeva sličnu razinu vještine. U WordPressu vam je potreban web poslužitelj (Apache), PHP i baza podataka instalirana prije nego što se zaobiđete za instaliranje WordPress-a.

To je posebno vrijedno ako razgovaramo o instaliranju WordPress-a u razvojne svrhe – što znači da će vam najvjerojatnije trebati instalirati WordPress ručno i ne iskorištavajte gotovu instalaciju WordPressa od strane vašeg web hostinga.

Jednostavnost stvaranja prazne stranice uz Gatsby vs WordPress

Što se tiče Gatsbyja, u usporedbi s WordPressom, stvaranje prazne stranice s Gatsbyjem malo je teže, jer uključuje korištenje terminala.

U WordPressu imate dobar čarobnjak za instalaciju koji vas lijepo prolazi kroz korake, a jedino što morate ručno učiniti je pripremiti bazu podataka.

Kako se Gatsby teme uspoređuju s WordPressom?

S obzirom na zrelost WordPress projekta, postoji ogromna kolekcija WordPress tema za odabir. Ako se prebacite na Gatsbyja, vaše su mogućnosti vrlo ograničene, osim ako ne želite ispočetka razviti temu.

Da i ne spominjemo, instaliranje i prebacivanje tema u WordPressu vrlo je jednostavno, a prilagođavanje istih nije ni mnogo teže, čak iako imate apsolutno nula znanja o programiranju.

Općenito, u tematskom odjelu nema natječaja. WordPress dominira.

Zaključak

Ok, nadam se da ste pronašli svoj odgovor na odgovor "što je Gatsby?" ovdje pitanje. Sveukupno, Gatsby predstavlja zaista zanimljivu alternativu ljudima koji su umorni od WordPress-a ili jednostavno žele testirati što još postoji.

Iako je WordPress jasan pobjednik u pogledu popularnosti, zajedništva, jednostavnosti uporabe i općenite funkcionalnosti cijele platforme, Gatsby u svom izvornom obliku pruža i izvrsne značajke.

Ovaj je projekt još uvijek vrlo mlad i redovito dodaje nove značajke. Međutim, da biste mogli u potpunosti iskoristiti dobrote u Gatsbyju, potrebno se udobno snalaziti oko JavaScript-a i React-a, što bi moglo biti najveća prepreka Gatsbyjevoj prihvaćanju od strane šire zajednice.

Ne zaboravite se pridružiti našem tečaju o ubrzanju ubrzanja stranice WordPress. Pomoću nekih jednostavnih ispravki možete smanjiti vrijeme učitavanja za čak 50-80%:

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map