Articles

Mi az a webes keretrendszer, és miért érdemes használni?

← Főoldal

A “keretrendszer” egy sokat használt szó a kóddal kapcsolatban. De mi is az a keretrendszer? Amikor keretrendszerekről beszélünk, ezek a keretrendszerek általában három különböző kategóriába sorolhatók — frontend, backend és CSS vagy felhasználói felület keretrendszerek. De még ha tudod is, hogy mik azok a keretrendszerek, melyiket érdemes megtanulnod vagy használnod és miért? Ebben a bejegyzésben arról lesz szó, hogy mi a keretrendszer, milyen keretrendszerek léteznek, és hogyan dönthetsz arról, hogy milyen keretrendszert használj a projektjeidhez!

Mi a keretrendszerek

Ha megnézünk néhány különböző webes alkalmazást, láthatjuk, hogy sok a duplikált funkció. Sokukban van felhasználói hitelesítés, renderelhető oldalak, adatbázisokhoz kapcsolódnak, vannak profilok, amiket megnézhetsz, mindegyikben van stilizált adatfolyam stb. Ha akarnám, magam is megírhatnám mindezt a logikát minden alkalommal, amikor új alkalmazást akarok készíteni; azonban rengeteg olyan eszköz is rendelkezésre áll, amely helyettünk megteszi ezt helyettünk.

Az alkalmazások készítésekor ráadásul sokszor bizonyos módon szeretnénk formázni a kódunkat, ami segít nekünk hatékonyabbá válni, és segít más fejlesztőknek megérteni a kódunkat. A webes keretrendszerek segítenek elérni a struktúrát az alkalmazásainkban, és olyan további funkciókat adnak, amelyeket túl sok extra munka nélkül hozzáadhatunk. A keretrendszerek adnak egy kiindulópontot, így a konfigurációs részletek helyett a funkciókra koncentrálhatunk.

A kódot sokkal többször olvassák, mint ahányszor megírják, és más fejlesztőkkel való együttműködés során nagyon fontos, hogy tudják, hogy bizonyos feladatok kódját hova írják, hogy azt a saját kódjukban használni tudják. A keretrendszereknek konvenciói is vannak a kód megírására és felépítésére, amelyek szabványosítják, hogyan írják a fejlesztők a kódjukat.

A legtöbb weboldal felépítése nagyon hasonló (hogy ne mondjam, azonos). A keretrendszerek célja, hogy közös struktúrát biztosítsanak, hogy a fejlesztőknek ne kelljen a nulláról újrakezdeniük, hanem újra felhasználhassák a rendelkezésre bocsátott kódot. Ily módon a keretrendszerek lehetővé teszik, hogy a munka nagy részét kivágjuk, és rengeteg időt spóroljunk meg.

Összefoglalva: nem kell újra feltalálni a kereket.

Awwwards-tól.

A motorháztető alatt a keretrendszerek csak kódkönyvtárak (azaz mások kódja), és a népszerűek nyílt forráskódúak! Tehát online megnézheted a könyvtár kódját!

Backend vs. Frontend

  • A webes alkalmazás frontendje az a rész, amit látsz és amivel interakcióba lépsz. Ez a webdesignból és az oldal interakciójából áll. A programozási nyelvek tekintetében ez szinte mindig az oldal CSS-éből, HTML-jéből és JavaScriptjéből áll.

  • A backend a szerverből, az adatbázisból és a velük kölcsönhatásban lévő kódból áll. Ebbe tartozik az a kód is, amely dinamikus adatokat szolgáltat az oldal frontendjének. Ez a legtöbb programozási nyelven kezelhető. Amiket ma elsősorban tárgyalni fogunk, az a Python, a Ruby és a Node JavaScript, de számtalan más is létezik.

What I Wish I Knew Before Learning to Code Ebook Cover

Még több tanácsot szeretne a kódolás megtanulásához?

Töltse le az ingyenes Ebookomat!

Használói felület keretrendszerek

A felhasználói felület keretrendszerek segítenek stilizált és professzionális megjelenésű webes alkalmazások létrehozásában. A legtöbbjük tartalmaz valamilyen rácsrendszert, hogy az elemeket igazítsuk egymáshoz, vannak színsémáik, hogy ezt kezeljék helyettünk, és CSS segítségével stilizálják a HTML-összetevőket, hogy azok tisztán és professzionálisan nézzenek ki. Ezek a frontend tartományba tartoznak; azonban általában, amikor frontend keretrendszerekre hivatkozunk, akkor JavaScript keretrendszerekről beszélünk.

A felhasználói felület keretrendszerek közé tartoznak a következők:

  • Bootstrap
    • Nagyon ismert és a Twitter építette
    • Egyszerűen megtanulható és professzionálisan néz ki
    • Egyszerű lehet kiszúrni a “Bootstrap oldalakat”
    • Nehéz lehet a komponensek testreszabása
  • Materialize
    • Tiszta kinézetű
    • Kicsit “szórakoztatóbb”, mint a Bootstrap
    • Sok stílus- és színválasztási lehetőség
    • Követi a Google Material stílus útmutatóját
  • Foundation
    • Sok példa
    • Professzionális megjelenés
  • Semantic UI
    • Sok beépített-in
    • Built-in themes így testreszabható
  • Grommet
    • Nagy hangsúlyt fektet a hozzáférhetőségre
    • Tényleg tisztának tűnik
    • Nem annyira használt, mint néhány másik
    • React JS-re készült. (egy másik keretrendszer, amit később megnézünk)

A felhasználói felület keretrendszer kiválasztása

A felhasználói felület keretrendszer kiválasztása leginkább a személyes preferenciákon múlik a megjelenés és az oldal céljai szempontjából. A különböző stílusok különböző iparágakat szólíthatnak meg, vagy különböző üzenetet közvetíthetnek a felhasználók felé.

Frontend keretrendszerek

A frontend keretrendszerek a legtöbb esetben JavaScript nyelven íródnak, és a webhely funkcionalitásának, interaktivitásának megszervezésére szolgálnak. Néhány ezek közül a következők:

  • Vue
    • Egyszerűen tanulható
    • Nagyon gyors
    • A hozzá kapcsolódó eszközök jól csomagoltak
    • Az Angular és React részeit veszi át és optimalizálja
    • kevésbé elterjedt, mint néhány másik
    • Flexibilis… többféleképpen is használhatod
  • AngularJS
    • A Google készítette
    • Jól támogatott
    • Nagyszámú funkció
    • Javítja az alkalmazás skálázhatóságát
    • Nehéz hibakeresés
    • Nagyon nagy mennyiségű tanulási görbe
  • Angular 2+
    • Built by Google
    • Well supported
    • Encourages reusability
    • Improves application scalability
    • Large learning curve
  • React
    • Built by Facebook
    • Bundles frontend code into components
    • Organizálja a kódot és az adatokat, hogy a kód újrafelhasználhatóbb legyen
    • Large learning curve
  • Ember
    • Gives a nagy mennyiségű funkcionalitást a dobozból
    • Meghatározó (használnia kell a formázását)
    • Mély tanulási görbe

Frontend keretrendszerek kiválasztása

A frontend keretrendszerek világa különösen gyorsan fejlődik, úgy tűnik, mintha néhány havonta egy-egy új frontend keretrendszer kerülne előtérbe. Tanuld meg, aminek számodra van értelme, és ne foglalkozz túlságosan azzal, hogy mi a pillanatnyilag “legmenőbb”.

Mások azzal érvelnek, hogy a React és a Vue könyvtárak és nem keretrendszerek, de sokan tartják őket keretrendszereknek, ezért bevettem őket!

Backend keretrendszerek

A backend keretrendszerek sokkal változatosabbak. Különböző programozási nyelveken íródnak, és sokféle funkcióval rendelkeznek. Az alábbiakban, a fenti listához hasonlóan, egy nagyon hiányos lista néhány, az alkalmazások backendjeinek írására szolgáló keretrendszerről.

  • Spring MVC
    • Java (nehezebben tanulható nyelv)
    • Nagyon gyors
    • Legkevésbé véleményes
  • Django
    • Python. (könnyebben megtanulható nyelv)
    • Boldog középút a nagyon véleményvezérelt és a kevésbé strukturált között
    • Egy csomó funkcionalitást ad a dobozból (pl. felhasználói hitelesítés, adatbázis-kapcsolatok, és nézet megjelenítés)
    • Nehéz lehet egy divatos front-end integrálása.
    • Python adatkezelése elképesztő
  • Flask
    • Python (könnyebben megtanulható nyelv)
    • Legkevésbé véleményes és jobban testreszabható, mint a Django
    • Kevesebbet ad out of the box (többet kell építeni)
  • Ruby on Rails
    • Ruby (könnyebben megtanulható nyelv)
    • Nagyon véleményes
    • Megfelelő eszközökkel rendelkezik, mint a scaffolding, így gyorsan építhetsz dolgokat
    • Nagyon sok funkciót ad out of the box (mint a felhasználói hitelesítés, adatbázis-kapcsolatok, és nézet megjelenítés)
    • Az eszközcsatorna segít a front-end fejlesztésnél
    • Ruby hosszabb időt vesz igénybe a programok futtatásához, mint néhány más programozási nyelv
  • Meteor
    • JavaScript (könnyebben megtanulható nyelv)
    • Megfelelően sok funkciót ad a dobozból (mint a felhasználói hitelesítés, adatbázis kapcsolatok, és nézet megjelenítés)
    • Elég jól integrálódik a modern front-endekkel
  • Express
    • JavaScript (könnyebben megtanulható nyelv)
    • Nagyon testreszabható
    • Nagyon könnyű súlyú
    • Kevésbé beépített-in features
    • Node nagyon gyors

Choosing a Backend Framework

Usually, a backend-keretrendszer kiválasztása a programozási nyelv alapján történik, amelyen íródott. Azt is vegye figyelembe, hogy milyen funkciókat szeretne hozzáadni — ha például hitelesítést (vagy felhasználói bejelentkezést) szeretne a weboldalához, akkor azt Django nyelven írni, ahol a hitelesítés be van építve, sokkal egyszerűbb lesz, mint Flask nyelven írni, ahol egy további szolgáltatásra lenne szüksége.

Tudjon meg többet

Ha egy keretrendszert szeretne használni vagy megtanulni, itt van egy csomó különböző keretrendszerekkel épített alkalmazás, így felmérheti, hogy melyiknek van a legtöbb értelme az Ön számára. Rengeteg további, különböző méretű és népszerűségű keretrendszer létezik, de ez a cikk rövid áttekintést ad néhány népszerű keretrendszerről, és arról, hogy hol kezdheted el. Nincs helyes válasz arra, hogy mit tanuljon meg először! Mindennek vannak előnyei és hátrányai, ezért mérlegelje, mi a legfontosabb az Ön számára, és onnan induljon el. A keretrendszerek nagyon hasznosak, és a legtöbb esetben sokkal gyorsabbá teszik a kódírást, de előtte is nagyon fontos, hogy erős programozási alapokkal rendelkezz – ezért először is győződj meg róla, hogy jól ismered a nyelvet, amelyen a keretrendszered íródott. A keretrendszerek szuper hasznosak a weboldalak írásához, mert olyan struktúrát kényszerítenek ki, amelyet a keretrendszer többi fejlesztője is megért, és közös funkciókat adnak, így nem kell újra feltalálnod a kereket!

Hol kezdj el tanulni…

  • Django Girls Tutorial – Én az első keretrendszeremet az online oktatóprogramjukon keresztül tanultam meg!
  • Code Academy
  • TodoMVC
  • CodeNewbie Podcast

És ha kell egy ötlet egy alkalmazáshoz…

  • Félelmetes alkalmazásötletek
  • 15+ APP IDEÁK ÉPÍTÉSÉRE, AMELYEK KÓDOLÁSI KÉSZSÉGEID SZINTESÍTIK

Tudj elsőként a bejegyzéseimről!