3 Beste JavaScript-framework / bibliotheek voor front-end ontwikkeling

JavaScript is in de loop der jaren steeds populairder geworden, de gemeenschap groeit snel en ontwikkelaars ontwikkelen en bouwen voortdurend tools voor de taal dagelijks.


Dit maakt het overweldigend als het erom gaat te beslissen welke tool / framework / bibliotheek voor een bepaalde taak moet worden gebruikt, omdat er altijd meerdere opties zijn voor letterlijk alles wat u in JavaScript wilt doen. In het begin is het nog steeds een uitdaging om te beslissen welke bibliotheek of welk raamwerk je wilt leren.

Dit artikel richt zich op het demystificeren van het voordeel van het gebruik van verschillende JavaScript front-end frameworks / bibliotheken en geeft er uiteindelijk een duidelijker beeld van. Het is bedoeld om het besluitvormingsproces om er een te selecteren gemakkelijker te maken.

Reageer

Reageer is geen raamwerk maar een JavaScript-bibliotheek voor het bouwen van gebruikersinterfaces.

Het is open source en wordt onderhouden door Facebook en een gemeenschap van individuele ontwikkelaars. React is in eerste instantie geschreven door Jordan Walke als interne tool op Facebook. Het werd later open source en in 2013 vrijgegeven voor het grote publiek, en heeft daarna een grote populariteit verworven.

Enkele van de functies zijn de volgende.

  • Biedt reactieve, aanpasbare en herbruikbare componenten
  • Maakt gebruik van een virtuele DOM
  • Extreem snel
  • Op componenten gebaseerd
  • One-way databinding
  • Herbruikbaarheid van code
  • Het heeft een levendig, bloeiend ecosysteem achter de rug
  • Handige staatsmanagement

Installatie / gebruik

React kan op twee fronten op de frontend worden gebruikt.

  • Over CDN
  • Node.JS gebruiken

Over CDN

U kunt naar hun verwijzen officiële site om een ​​scripts-link te krijgen, die u kunt opnemen in de header-tag in uw HTML-opmaak. Kies de links op basis van het doel.

Als u bijvoorbeeld in een ontwikkelomgeving gebruikt, dan:

En voor productie

Node.JS gebruiken

Ik neem aan dat je NodeJS al hebt geïnstalleerd. Typ het volgende commando om React te installeren.

sudo npm i -g create-react-app –save-dev

Typ de volgende opdracht zodra de installatie is voltooid

create-react-app mijn-eerste-react-applicatie

De bovenstaande opdracht installeert alle benodigde bibliotheken die nodig zijn om React correct te laten werken, waaronder een ontwikkelingsserver, webpack en babel.

Navigeer naar de map my-first-react-application en voer de volgende opdracht uit

npm start

Het bovenstaande zal een ontwikkelingsserver starten op poort 3000. En als je dan toegang krijgt tot je server IP met poort 3000, zou je zoiets als hieronder moeten zien.

React wint aan populariteit en on-demand bij een aantal grote organisaties. Als je geïnteresseerd bent om te leren, dan zou ik aanraden dit te nemen volledige cursus.

Vue.js

Vue.js is een progressief JavaScript-framework voor het bouwen van interactieve gebruikersinterfaces en applicaties met één pagina. Het is een model-view raamwerk met de kernbibliotheek, gericht op de view-laag. Vue is populair, omdat het toepassingen met één pagina mogelijk maakt. In tegenstelling tot React gebruikt Vue onbewerkte HTML en niet JSX.

Vue.js is een open-source en is in eerste instantie gemaakt door Evan You en openbaar gemaakt in februari 2014. Hieronder volgen enkele van de functies.

  • Het biedt reactieve en samenstellende beeldcomponenten.
  • Maakt gebruik van een virtuele DOM
  • Behoudt focus op de kernbibliotheek (d.w.z. routering en statusbeheer)
  • Scoping in CSS wordt afgehandeld zonder CSS-In-Js
  •  One-way binding binnen componenten.
  • Ondersteuning voor essentiële add-ons
  • Herbruikbaarheid van code

Installatie / gebruik

U kunt Vue.js aan de front-end gebruiken via de CDN of met Node.js

Om de CDN-manier, u kunt het volgende script toevoegen aan uw HTML-paginakoptekst.

Het bovenstaande script is geschikt voor ontwikkelingsdoeleinden omdat het een belangrijk consolebericht bevat. Voor productie moet u echter de onderstaande gebruiken.

En naar gebruik met Nodejs, je kunt het installeren met de opdracht npm.

npm install vue

Ik raad je ten zeerste aan de officiële Vue JS te lezen documentatie om meer te leren of te overwegen dit te nemen pad.

Hoekig

Hoekig is een structureel JavaScript-framework voor dynamische pagina’s. Het maakt het gebruik van HTML als sjabloontaal mogelijk en maakt het gebruik van HTML-syntaxis mogelijk om de applicatiecomponent duidelijk en beknopt uit te drukken. Het is een open-sourceproject dat wordt beheerd door Google en andere bijdragers.

Installatie

Zorg ervoor dat je de nieuwste Nodejs hebt geïnstalleerd. Het eerste dat we moeten installeren, is de Angular CLI-tool.

npm installeer -g @ angular / cli

Na installatie kunnen we een nieuw project maken met de volgende opdracht.

ng nieuwe mijn-eerste-hoek-app

Volg de instructies op het scherm. Dit genereert een aantal bestanden en mappen en gebruikt de npm-module om bibliotheken van derden te downloaden die nodig zijn om Angular goed te laten werken.

Voer de volgende opdracht uit vanuit de map apps om de zojuist gemaakte applicatie te starten.

ng server

Dit zou de server automatisch moeten opstarten op poort 4200.

[[email beveiligd] mijn-eerste-hoek-app] # ng serveren
10% bouwen van 3/3 modules 0 actief ℹ wds 」: Project draait op http: // localhost: 4200 / webpack-dev-server /
「「 wds 」: webpack output wordt aangeboden vanaf /
「「 wds 」: 404s zal terugvallen op //index.html

chunk {main} main.js, main.js.map (main) 47,8 kB [initial] [rendered]
brok {polyfills} polyfills.js, polyfills.js.map (polyfills) 264 kB [initial] [rendered]
chunk {runtime} runtime.js, runtime.js.map (runtime) 6,15 kB [entry] [gerenderd]
chunk {styles} styles.js, styles.js.map (styles) 10 kB [initial] [rendered]
chunk {vendor} vendor.js, vendor.js.map (vendor) 3,81 MB [initial] [gerenderd]
Datum: 2019-12-28T12: 08: 20.138Z – Hash: 5d4b93c7bf9e61979c4d – Tijd: 12864ms
** Angular Live Development Server luistert op localhost: 4200, open uw browser op http: // localhost: 4200 / **
ℹ 「wdm」: succesvol samengesteld.

Conclusie

Dus wat je kiest om te leren is meer een persoonlijke voorkeur dan “dat is een beter” ding.

Alle hierboven genoemde frameworks / bibliotheken zijn geweldig. Hier is een korte samenvatting;

  • U moet Angular leren als u een Framework wilt waarop u wilt vertrouwen zonder dat u te maken krijgt met externe afhankelijkheden.
  • Je zou React moeten leren als je een snelle, PWA, Single Page-applicatie wilt bouwen en je vertrouwd bent met JSX.
  • React heeft de meest levendige community en meer vacatures dankzij de grote community.
  • React is relatief eenvoudig om mee te beginnen.
  • React is zeer aanpasbaar en behandelt elk stuk gebruikersinterface als een onderdeel.
  • Vue heeft dezelfde voordelen als React, maar zonder JSX.
  • De arbeidsmarkt voor Vue neemt voortdurend toe.

Hier is een grafiek op Google Trends die een vergelijking toont van de populariteit van de drie van hen.

Als front-end development jouw interesse heeft, dan kun je dit bekijken Udemy natuurlijk.

TAGS:

  • Open source

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