A keretrendszerek jönnek és mennek, és bár Gatsby végül a technika fejlődésével sodródhat, a teljesítmény és a termelékenység növelése erős érv azonnali búvárkodás mellett.
Várj, mi az a Gatsby?
A Gatsby a React-en alapuló ingyenes és nyílt forráskódú keretrendszer, amely segít a fejlesztőknek lángoló, gyors weboldalak és alkalmazások létrehozásábanHangsúlyuk (később elmagyarázom). Szeretem a React App létrehozása szteroidokon leírni, ahol egyszerű módja a React alkalmazás indításának, és arra összpontosítunk, hogy produktívvá váljunk az alkalmazás valóban különböző részeivel. Lényegében egy dicsőített Webpack alkalmazás, ahol minden ugyanazon Webpack csővezetékre épül, amelynek megírására és teljes megértésére mind a mai napig küzdöttél (vagy talán csak én vagyok).
A szépség azonban az, hogy amit statikus weboldal (egyszerű HTML fájl) bocsát ki, az alkalmazásod előre megjelenítve van az optimális szállítás érdekében. Ez azt jelenti, hogy lényegében bárhol futtatható, például egyszerűen bedobja az S3-ba és statikus weboldalként szolgál, vagy még egyszerűbb, ha a Netlify felépíti és kiszolgálja az Ön számára.
Mindez a forgatókönyvekben található
A Gatsby a sok rendelkezésre álló eszköz egyike, amely támogatja a JAMstack architektúrát. Az ismeretlenek számára a JAM a Javascript API-kat és a Markup-ot jelenti, vagy nagyjából egy statikus HTML webhely, amely javascript-et használ a varázslat megvalósításához.
A JAMstack alkalmazásoknak sok előnye van már a dobozból, beleértve:
- Könnyen házigazdája
- Olcsó házigazdának
- Nagyon gyorsan töltődik be (az idő nagy részében)
Ez azt jelenti, hogy általában gyakrabban fordul elő, hogy lesz egy gyors weboldala, amely nem fog sok pénzbe kerülni a házigazdának és a fenntartónak egyaránt.
Kicsit ismerősnek tűnik?
Könnyű ezt összehasonlítani a Rails-szel, amint azt gyakran hallom másoktól a csapatomban, és jogosan. Nagyon sok varázslat van a színfalak mögött Gatsby-ban!
De hacsak nem pusztán pluginokra és témákra támaszkodik (ami rendben is van), a nap végén még mindig React alkalmazást épít, mint bárhol máshol. Az alkalmazás nagyjából bármely más keretrendszerbe portálható (kivéve az adatforrást és az oldalgenerálást). Az alkatrészek komponensek, a stílusok stílusok.
const Nav = () => { return ( A normal nav component in a normal Gatsby app. ) }A Gatsby sok szempontból véleményezett, de ezek a vélemények többnyire kívül esnek azon az elképzelésen, hogy még mindig webpack alkalmazást építesz, és ezek a konvenciók a webpack és a mögötte lévő konfigurációk, nem feltétlenül Gatsby.
Szóval, mi teszi valójában olyan nagyszerűvé?
Szó szerint bootstrap egy perc alatt
Komolyan. Egy új Gatsby webhely felpörgetése a szó szerinti definíció mindazoknak a kattintásos csalikkal kapcsolatos cikkeknek, amelyek szerint 5 perc alatt megtehet valamit. Telepítse a CLI-t, és 3 parancsra van az alkalmazásától, amely helyileg vagy statikusan felépült.
Például, ha új barebones projektet akart felpörgetni a Sass-szal:
$ gatsby new my-cool-gatsby-project //github.com/colbyfayock/gatsby-starter-sass $ cd my-cool-gatsby-project $ yarn develop
Az indítók közössége egyszerű belépési pontot biztosít az új alkalmazáshoz (vagy az egészhez, amit szeretne).
Megjegyzés: az egész „egy perc alatt” attól függ, hogy milyen kapcsolatot használ, mivel meg kell várnia a függőségek letöltését és telepítését.
Összehozza az egészet a tartalmi hálóba
A Gatsby mögött álló egyik fogalom az az elképzelés, hogy a „tartalmi háló”, és Gatsby jelent megoldást az összes összekapcsolására. Sok és egyre növekvő alkalmazás épül a JAMstack architektúrával, ami segít abban az elképzelésben, hogy annyi tartalmat szerezhetünk be, ahány helyet akarunk, és előadói módon egyetlen alkalmazásba tudjuk hozni.
Ha mindent elmondott és kész, statikusan összeállított alkalmazásba sok forrásból gyűjthet adatokat. Ez valóban gyorsan lángol. ?
Ingyenes teljesítménynövelés!
A dobozból megkapja a feltöltött webcsomag-konfigurációt, beleértve a kódfelosztást, az előhívást, az inline stílusokat, az eszközök kicsinyítését és rengeteg más nagyszerűséget. Könnyen frissíthet számos, könnyen konfigurálható pluginnal, például állítsa be alkalmazását PWA-ként (progresszív webalkalmazás), és biztosítsa offline mód módját
Rengeteg buzzword van ott, de a nap végén ez azt jelenti, hogy a webhelyének főként a legjobb gyakorlatok alapján kell lennie, amelyek optimalizálják webhelye összes eszközét a sebesség és a szállítás érdekében, mindezt úgy, hogy a lehető legelérhetőbbé tegye őket régebbi böngészők és annak biztosítása, hogy a lassú kapcsolatok ne pazarolják az értékes erőforrásokat. Nehéz megerősíteni kemény statisztikának, de Kyle Mathews (Gatsby alapító) szerint a Gatsby webhelyek 2-3x gyorsabbak, mint a hasonló típusú webhelyek.
Megnövelt termelékenység!
Most már nem kell aggódnia azzal a bonyolultsággal, hogy megbizonyosodjon arról, hogy az alkalmazás teljesít-e, átírva és módosítva a webcsomag-konfigurációt az új bevált gyakorlatokhoz minden új alkalmazáshoz. Gatsby mindezt megteszi helyetted. Segítségével az import bitekre összpontosíthat, amelyek különlegessé teszik az alkalmazását, nem pedig az állványokra.
Ez egy lépéssel tovább megy Gatsby pluginjeivel és a Themes hozzáadásával. A témák nem azok, amelyeket elvárhatunk a hagyományos értelemben, vagy azok, amelyeket elvárhat a Wordpress-től, de lehetővé teszik a Gatsby alkalmazás bármely részének elvonatkoztatását, így az alkalmazást újra felhasználhatja az alkalmazásra.
Rendelkezik minden egyes alapkomponens-könyvtárral? Tedd témává. Van egy speciális konfigurációja az adatforrásokhoz, amelyet nem akar minden alkalommal átírni? Legyen plugin. Ha elvonatkoztatja ezeket a kulcsfontosságú elemeket az alkalmazásában, időt és stresszt takarít meg minden új projektben, amelyet felpörget, nem beszélve arról, hogy ezeket a darabokat egy helyen tudja fenntartani, hibákat és javításokat egyszerű csomagfrissítéssel javít.
Nagy közösség
Magának a Gatsbynak már tisztességesen nagy közössége van, de ezen felül van még egy ideje a Webpack és a React. A React jelenleg a legnépszerűbb felhasználói felület keretrendszer, amely sokkal egyszerűbbé teszi a hibakeresést egy egyszerű Google-kereséssel. Nehéz olyan problémát találni, amelybe te vagy az első, és akibe belebotlik.
Ha konkrétan Gatsby-kérdése van, a Github-problémáik olyan emberektől hemzsegnek, akik hajlandók segíteni a hibakeresésben vagy a következő hiba elhárításában. Csak annyit kérnek, hogy udvariasan biztosítsd nekik a szaporodás módját, ami csak megkönnyíti számukra az első segítséget!
Hackerman barátja
Szeretné feltekerni az ujját, és maga csípni a csővezetéket? A Gatsby egyszerű módszereket kínál a feldolgozás javításához, függetlenül attól, hogy bekapcsolódik-e a build életciklusába, vagy módosítja a webpack konfigurációt. Ez lehetővé teszi, hogy az alkalmazás lényege olyan egyszerű vagy fejlett legyen, amennyit csak akar, bár ha olyan fejlett vagy, akkor talán segít egy-két plugin megírásában!
A talán nem is olyan nagyszerű…
A gyors építkezés további hibákat eredményez
Arra kell számítani, hogy ide-oda eltalál néhány csúcsot, a legfrissebbek és a legfrissebbek maradva, elvégre nyílt forráskódú szoftvereket fejlesztenek, nem csupán az Ön egyedi webhelyéhez.
A Gatsby csapata nagyon gyorsan épít, ami fantasztikus, de a gyors mozgás hajlamos arra, hogy figyelmen kívül hagyja a dolgokat, miközben építenek. Szerencsére az automatizált tesztelés kezdetét veszik a kód megkeményítésének elősegítése érdekében, és szándékosan próbálják elkerülni a rohanó munkát az ilyen típusú problémák megoldására.
Csak ügyeljen arra, hogy alaposan tesztelje a csomagfrissítéseket, és ne féljen leminősíteni és lezárni a csomag verzióját, ha problémák merülnek fel.
A statikus webhelyek első osztályúak, nem webalkalmazások
A Gatsby maga is mindent magában foglaló megoldás statikus és nem statikus alkalmazásokhoz egyaránt, de igaz? A csak kliens útvonalak támogatásához plugin vagy oldal létrehozása szükséges, ami rendben van, de a hangvételük arra utal, hogy nem mindig egyformán koncentrálnak a kettőre.
Tényleg az egyetlen érv itt az, hogy miért használná a Gatsby-t a Create React App felett az adott esethez? Bár nem biztos, hogy első osztályú, mégis elég funkcionális a Gatsby alapjául szolgáló szabványos előnyök bónuszával, de egyértelműen a hibákat és funkciókat nem fogjuk prioritásként kezelni e cél elérése érdekében.
Csak adj már egy lövést!
Az én véleményem vagy más véleményem nem számít, amíg ki nem próbálja. A legrosszabb esetben szó szerint 5 percet vesztegetett a függőségek telepítése és a mappának a benne lévő projekttel való törlése között, ami pozitívumként véve tanulási élmény. A legjobb eset, amikor egy fantasztikus eszközt fedezett fel, amely nagyszerű dolgokhoz segít.
Menj, építs, kísérletezz, és oszd meg, milyen nagyszerű dolgokat csinálsz!
Szerkesztés: Megváltoztatta a „lassulást”, hogy „elkerülje a rohanást”, hogy tisztázza a kijelentési szándékot, mivel nem lassítja a tényleges munka mennyiségét, hanem igyekszik óvatosabb lenni vele.
- ? Kövess a Twitteren
- ? ️ Iratkozzon fel a Youtube-ra
- ✉️ Iratkozzon fel a hírlevelemre
Eredetileg a //www.colbyfayock.com/2019/09/what-is-gatsby-and-why-its-time-to-get-on-the-hype-train webhelyen jelent meg