A JavaScript egyre népszerűbbé vált az évek során, a közösség gyorsan növekszik, és a fejlesztők folyamatosan fejlesztenek és építenek eszközöket a nyelvhez.
Ez elsöprő jelentőséggel bír annak eldöntésekor, hogy melyik eszközt / keretet / könyvtárat kell használni egy adott feladathoz, mert mindig többféle lehetőség áll rendelkezésre a Java alkalmazásban szó szerint bármi elvégzéséhez. Eleinte továbbra is kihívást jelent annak eldöntése, hogy milyen könyvtárat vagy keretet kell megtanulni.
Ez a cikk arra törekszik, hogy több Java front-end keretrendszer / könyvtár használatának előnyeit bizonyítsa, és végül világosabb képet nyújt róluk. Célja, hogy megkönnyítse a kiválasztási döntési folyamatot.
Reagál
Reagál nem egy keret, hanem egy JavaScript könyvtár a felhasználói felületek felépítéséhez.
Nyílt forráskódú, amelyet a Facebook és az egyes fejlesztők közössége tart fenn. A reagálást eredetileg írta Jordan Walke belső eszközként a Facebookon. Később nyílt forráskódúak voltak, és 2013-ban kiadták a nagyközönség számára, és azután azóta széles körű népszerűségre tett szert.
Néhány szolgáltatás a következőket tartalmazza.
- Reaktív, testreszabható és újrafelhasználható komponenseket biztosít
- Virtuális DOM-ot használ
- Rendkívül gyors
- Komponens alapú
- Egyirányú adatkötés
- Kód újrafelhasználhatóság
- Mögötte élénk, virágzó ökoszisztéma van
- Kényelmes államigazgatási kezelés
Telepítés / használat
A React kétféle módon használható az előlapon.
- CDN felett
- A Node.JS használata
CDN felett
Megnézheti az őket hivatalos oldal szkriptek link eléréséhez, amelyet a HTML-jelölés fejléc-címkéjébe beilleszthet. Válassza ki a hivatkozásokat a cél alapján.
Például, ha fejlesztői környezetben használja, akkor:
És gyártáshoz
A Node.JS használata
Feltételezem, hogy a NodeJS már telepítve van. A React telepítéséhez egyszerűen írja be a következő parancsot.
Sudo npm létrehozni-reagálni app – mentés-dev
A telepítés befejezése után írja be a következő parancsot
hozzon létre-reagál-alkalmazás-én-első-reagál-alkalmazás
A fenti parancs telepíti az összes szükséges könyvtárat, amelyekre szükség van a React megfelelő futtatásához, beleértve egy fejlesztői kiszolgálót, webpaket és babelt.
Keresse meg az alkalmazás első mappát, és futtassa a következő parancsot
npm indulás
A fentiek elindítanak egy fejlesztõszervert a 3000-es porton. És ha a 3000-es porttal fér hozzá a szerver IP-hez, akkor látnia kell valamit az alábbiak szerint.
A React számos nagyszervezet népszerûsödik és igény szerint növekszik. Ha érdekli a tanulás, akkor azt javaslom ezt venni teljes tanfolyam.
Vue.js
Vue.js egy progresszív JavaScript keretrendszer az interaktív felhasználói felületek és az egyoldalas alkalmazások létrehozásához. Ez egy alapnézet-keretrendszer a központi könyvtárral, a nézetrétegre összpontosítva. A Vue népszerű, mivel képes az egyoldalas alkalmazások üzemeltetésére. A Reaktálással ellentétben a Vue nyers HTML-t használ, és nem JSX-t.
A Vue.js nyílt forráskódú, eredetileg a Evan You és nyilvánosan 2014 februárjában jelent meg. Az alábbiakban bemutatjuk néhány funkciót.
- Reaktív és összeállítható nézetelemeket biztosít.
- Virtuális DOM-ot használ
- Fókuszban marad a központi könyvtár (azaz útválasztás és állapotkezelés)
- A kiterjesztés a CSS-ben a CSS-In-Js nélkül történik
- Egyirányú kötés az összetevőkön belül.
- Az alapvető kiegészítők támogatása
- Kód újrafelhasználhatóság
Telepítés / használat
Használhatja a Vue.js-t a kezelőfelületen akár a CDN-en keresztül, akár a Node.js-vel
A CDN módon, hozzáadhatja a következő szkriptet a HTML oldal fejlécének szakaszához.
A fenti szkript fejlesztési célokra alkalmas, mivel tartalmaz egy fontos konzolüzenetet. A gyártáshoz azonban az alábbiakat kell használnia.
És, hogy használja a Nodejs-rel, telepítheti az npm paranccsal.
npm telepítési vue
Erősen javaslom, hogy olvassa el a hivatalos Vue JS-t dokumentáció többet megtudni, vagy megfontolhatja ezt pálya.
Szögletes
Szögletes egy dinamikus oldalak szerkezeti JavaScript-keretrendszere. Lehetővé teszi a HTML használatát sablonnyelvként, és lehetővé teszi a HTML szintaxis használatát az alkalmazások összetevőinek világos és tömör kifejezésére. Ez egy nyílt forráskódú projekt, amelyet a Google és más közreműködők tartanak fenn.
Telepítés
Győződjön meg arról, hogy a legújabb Nodejs telepítve van. Az első dolog, amelyet telepítenünk kell, a szögletes CLI eszköz.
npm install -g @ szög / cli telepítése
A telepítés után létrehozhatunk egy új projektet a következő paranccsal.
új, első-szögletes alkalmazásom
Kövesse a képernyőn megjelenő utasításokat. Ezzel előállítja a fájlok és mappák egy részét, és az npm modul használatával letöltheti az Angular megfelelő működéséhez szükséges külső gyártók könyvtárait..
Az újonnan létrehozott alkalmazás elindításához futtassa a következő parancsot az alkalmazások mappából.
a szerverre
Ennek automatikusan el kell indítania a szervert a 4200-as porton.
[[Email protected] én-első-szög-app] # szolgál
10% 3/3 modulok építése 0 aktív ℹ wds ｣: A projekt fut a http: // localhost: 4200 / webpack-dev-server /
ℹ ｢wds｣: a webpack kimenete a /
｢｢ wds ｣: 404s visszakerül a //index.html fájlba
darab {main} main.js, main.js.map (main) 47,8 kB [kezdeti] [nyújtott]
darab {polyfills} polyfills.js, polyfills.js.map (polyfills) 264 kB [kezdeti] [nyújtott]
darab {runtime} runtime.js, runtime.js.map (runtime) 6.15 kB [bejegyzés] [nyújtott]
darab {stílusok} stílusok.js, stílusok.js.map (stílusok) 10 kB [kezdeti] [megjelenített]
darab {eladó} vendor.js, vendor.js.map (eladó) 3,81 MB [kezdeti] [nyújtott]
Dátum: 2019-12-28T12: 08: 20.138Z – Hash: 5d4b93c7bf9e61979c4d – Idő: 12864ms
** A Szögletes Élő Fejlesztő Szerver a következőt hallgatja a localhost-en: 4200, nyissa meg böngészőjét a http: // localhost: 4200 / ** -on.
｢｢ wdm ｣: Sikeresen összeállítva.
Következtetés
Tehát, amit úgy dönt, hogy megtanulja, inkább személyes preferencia, mint „ami jobb” dolog.
A fent felsorolt összes keret / könyvtár nagyszerű. Íme egy rövid áttekintés;
- Ha meg akarod tanulni egy olyan Keretet, amelyre támaszkodhat, anélkül, hogy foglalkoznia kellene a külső függőségekkel, akkor meg kell tanulnia a Szögletet.
- Meg kell tanulnia a Reakciót, ha gyors, PWA-t, Egyoldalas alkalmazást szeretne építeni, és kényelmesebbé teszi a JSX-t.
- A React a legaktívabb közösséggel rendelkezik, és nagyobb közösségének köszönhetően több munkalehetőséget kínál.
- A React viszonylag könnyű az induláshoz.
- A React nagymértékben testreszabható, és az UI minden egyes elemét összetevőként kezeli.
- A Vue ugyanazokkal az előnyökkel rendelkezik, mint a React, de JSX nélkül.
- A Vue munkaerőpiaca folyamatosan növekszik.
Az alábbiakban bemutatjuk a Google Trends táblázatot, amelyben összehasonlítják a három trend népszerűségi mutatóját.
Ha érdekli a front-end fejlesztés, akkor ezt megnézheti Udemy tanfolyam.
CÍMKÉK:
Nyílt forráskód
