Articles

Wat is een Web Framework, en waarom zou ik er een gebruiken?

← Home

“Framework” is een woord dat veel wordt gebruikt in relatie tot code. Maar wat is een raamwerk eigenlijk? Als we het over frameworks hebben, vallen die frameworks normaal gesproken in drie verschillende categorieën — frontend, backend, en CSS of gebruikersinterface frameworks. Maar zelfs als je weet wat frameworks zijn, welke moet je dan leren of gebruiken en waarom? Deze post zal bespreken wat een framework is, welke frameworks er zijn, en hoe u beslissingen kunt nemen over wat voor soort framework u zou moeten gebruiken voor uw projecten!

Wat zijn Frameworks

Als we kijken naar een paar verschillende webapplicaties, kunnen we zien dat er veel dubbele functies zijn. Velen hebben gebruikersauthenticatie, pagina’s die renderen, ze maken verbinding met databases, ze hebben profielen waar je naar kunt kijken, ze hebben allemaal gestileerde feeds met informatie, enz. Als ik zou willen, zou ik al die logica zelf kunnen schrijven elke keer als ik een nieuwe applicatie wil bouwen; er zijn echter ook een heleboel tools beschikbaar die dat voor ons kunnen doen.

Daar komt nog bij dat we, als we applicaties bouwen, onze code op bepaalde manieren willen indelen, zodat we efficiënter worden en andere ontwikkelaars onze code beter kunnen begrijpen. Webframeworks helpen ons om structuur aan te brengen in onze toepassingen, en ze geven ons extra mogelijkheden die we kunnen toevoegen zonder al te veel extra werk. Raamwerken geven ons een plek om te beginnen, zodat we ons kunnen concentreren op functies in plaats van op configuratiedetails.

Code wordt veel vaker gelezen dan geschreven, en het is zo belangrijk wanneer je met andere ontwikkelaars werkt dat ze weten waar de code voor bepaalde taken wordt geschreven, zodat ze die in hun eigen code kunnen gebruiken. De frameworks hebben ook conventies voor de manier waarop de code wordt geschreven en gestructureerd, die standaardiseren hoe de ontwikkelaars hun code schrijven.

De meeste websites hebben een zeer vergelijkbare (om niet te zeggen identieke) structuur. Het doel van frameworks is om een gemeenschappelijke structuur aan te bieden, zodat ontwikkelaars het niet helemaal opnieuw hoeven te doen en de aangeleverde code kunnen hergebruiken. Op deze manier kunnen frameworks ons veel werk uit handen nemen en veel tijd besparen.

Om kort te gaan: je hoeft het wiel niet opnieuw uit te vinden.

van Awwwards.

Onder de motorkap zijn frameworks gewoon codebibliotheken (d.w.z. code van anderen), en de populaire zijn open source! Dus je kunt de code van je bibliotheek online bekijken!

Backend vs Frontend

  • De frontend van een webapplicatie is het gedeelte dat je ziet en waar interactie mee is. Het bestaat uit het webontwerp en de interactie van de site. Wat programmeertalen betreft, bestaat dit bijna altijd uit de CSS, HTML en JavaScript van de pagina.

  • De backend bestaat uit de server, de database en de code die hiermee in wisselwerking staat. Deze bestaat ook uit de code die dynamische gegevens doorgeeft aan de voorkant van de site. Dit kan in de meeste programmeertalen worden gedaan. De talen die we vandaag voornamelijk zullen bespreken zijn Python, Ruby en Node JavaScript, maar er zijn talloze andere.

What I Wish I Knew Before Learning to Code Ebook Cover

Wilt u meer advies over leren coderen?

Download mijn gratis Ebook!

User Interface Frameworks

User interface frameworks helpen gestileerde en professioneel ogende webapplicaties te maken. De meeste omvatten een soort van rastersysteem, zodat u uitlijnen elementen, ze hebben kleurenschema’s, zodat wordt afgehandeld voor u, en ze stileren uw HTML-componenten met behulp van CSS, zodat ze zien er schoon en professioneel. Deze vallen binnen het frontend domein; maar normaal gesproken hebben we het over JavaScript frameworks als we het over frontend frameworks hebben.

Enkele user interface frameworks zijn onder andere:

  • Bootstrap
    • Zeer bekend en gebouwd door Twitter
    • Gemakkelijk te leren en ziet er professioneel uit
    • Kan gemakkelijk te herkennen zijn “Bootstrap Sites”
    • Kan moeilijk zijn om componenten aan te passen
  • Materialize
    • Ziet er schoon uit
    • Een beetje “leuker” dan Bootstrap
    • Veel styling en kleur opties
    • Volgt Google’s Material style guide
  • Foundation
    • Veel voorbeelden
    • Professioneel
  • Semantische UI
    • Veel ingebouwde
  • in
  • Built-in thema’s zodat het aanpasbaar is
  • Grommet
    • Heeft een enorme focus op toegankelijkheid
    • Ziet er echt schoon uit
    • Niet zo gebruikt als sommige anderen
    • Maakt voor React JS (een ander framework waar we later naar zullen kijken)
  • Kiezen voor een UI Framework

    Het kiezen van een User Interface framework komt vooral neer op persoonlijke voorkeur in uiterlijk en de doelen van de site. De verschillende stijlen kunnen verschillende branches aanspreken of een andere boodschap overbrengen aan gebruikers.

    Frontend Frameworks

    Frontend frameworks zijn, in de meeste gevallen, geschreven in JavaScript en zijn voor het organiseren van de functionaliteit, interactiviteit van uw website. Sommige van deze omvatten:

    • Vue
      • Makkelijk te leren
      • Zeer snel
      • Alle tools die erbij horen zijn goed verpakt
      • Haalt delen uit Angular en React en optimaliseert ze
      • Minder wijdverbreid geadopteerd dan sommige anderen
      • Flexibel –. je kunt het op meerdere manieren gebruiken
    • AngularJS
      • Gebouwd door Google
      • Goede ondersteuning
      • Hoeveel mogelijkheden
      • Verbetert de schaalbaarheid van applicaties
      • Moeilijk te debuggen
      • Grote leercurve
    • Angular 2+
      • Gebouwd door Google
      • Goede ondersteuning
      • Gemakkelijk her te gebruiken
      • Versterkt de schaalbaarheid van applicaties
      • Grote leercurve
    • React
      • Gebouwd door Facebook
      • Bundelt frontend code in componenten
      • Organiseert code en data om code meer herbruikbaar te maken
      • Grote leercurve
    • Ember
      • Geeft een grote hoeveelheid functionaliteit out of the box
      • Geïntegreerd (je moet zijn opmaak gebruiken)
      • Steile leercurve

    Het kiezen van een Frontend Framework

    De wereld van frontend frameworks evolueert bijzonder snel, het lijkt alsof er elke paar maanden een nieuw frontend framework in opkomst is. Leer wat voor jou zinvol is, en maak je niet te druk over wat op dit moment de “heetste” is.

    Sommigen beweren dat React en Vue bibliotheken zijn in plaats van frameworks, maar veel mensen beschouwen ze als frameworks, dus heb ik ze opgenomen!

    Backend frameworks

    Backend frameworks zijn een stuk gevarieerder. Ze zijn geschreven in verschillende programmeertalen en hebben een grote verscheidenheid aan functies. Hieronder staat, net als in de bovenstaande lijst, een zeer onvolledige lijst van enkele frameworks die er zijn voor het schrijven van applicatie backends.

    • Spring MVC
      • Java (moeilijkere taal om te leren)
      • Zeer snel
      • Minder opiniërend
    • Django
      • Python (makkelijkere taal om te leren)
      • Gelukkige middenweg tussen zeer opiniërend en minder gestructureerd
      • Geeft je veel functionaliteit out of the box (zoals authenticatie van gebruikers, database connecties, en view rendering)
      • Kan moeilijk zijn om een fancy front-end te integreren.
      • Python’s data handling is geweldig
    • Flask
      • Python (makkelijkere taal om te leren)
      • Minder vooringenomen en meer aanpasbaar dan Django
      • Geeft je minder out of the box (je moet meer bouwen)
    • Ruby on Rails
      • Ruby (makkelijkere taal om te leren)
      • Zeer eigenwijs
      • Hebt geweldige tools zoals scaffolding zodat je snel dingen kunt bouwen
      • Geeft je veel functionaliteit out of the box (zoals authenticatie van gebruikers, database connecties, en view rendering)
      • De asset pipeline helpt bij front-end ontwikkeling
      • Ruby doet er langer over om programma’s uit te voeren dan sommige andere programmeertalen
    • Meteor
      • JavaScript (makkelijkere taal om te leren)
      • Geeft je veel functionaliteit out of the box (zoals authenticatie van gebruikers, database connecties, en view rendering)
      • Steelt zeer goed met moderne front-ends
    • Express
      • JavaScript (eenvoudiger taal om te leren)
      • Zeer goed aanpasbaar
      • Zeer licht
      • Lager in gewicht
      • Minder ingebouwdein functies
      • Node is zeer snel

    Het kiezen van een Backend Framework

    Normaal gesproken, kiest u een backend raamwerk op basis van de programmeertaal waarin het is geschreven. Houd ook rekening met de functies die u wilt toevoegen – als u authenticatie (of gebruikers login) voor uw website, bijvoorbeeld, schrijven in Django waar authenticatie is ingebouwd zal een stuk makkelijker zijn dan schrijven in Flask waar je een extra service nodig.

    Learn More

    Als u wilt gebruiken of leren een kader, hier zijn een heleboel toepassingen gebouwd met verschillende, zodat u kunt evalueren welke het meest zinvol is voor jou. Er zijn veel meer frameworks van verschillende grootte en populariteit, maar dit artikel geeft een kort overzicht van een aantal van de populaire frameworks die er zijn en waar je kunt beginnen. Er is geen juist antwoord op de vraag wat je eerst moet leren! Er zijn voors en tegens aan alles, dus weeg af wat voor jou het belangrijkst is en ga van daaruit verder. Frameworks zijn super handig en maken het schrijven van code een stuk sneller in de meeste gevallen, maar het hebben van een sterke programmeer basis daarvoor is ook super belangrijk — dus zorg ervoor dat je de taal waarin je framework geschreven is eerst goed kent. Frameworks zijn super handig voor het schrijven van websites omdat ze een structuur afdwingen die andere ontwikkelaars in het framework begrijpen, en ze geven je gemeenschappelijke functionaliteit zodat je het wiel niet opnieuw hoeft uit te vinden!

    Waar te beginnen met leren…

    • Django Girls Tutorial – Ik leerde mijn eerste framework via hun online tutorial!
    • Code Academy
    • TodoMVC
    • CodeNewbie Podcast

    En als je een idee nodig hebt voor een applicatie…

    • Awesome App Ideas
    • 15+ APP IDEAS TO BUILD TO LEVEL UP YOUR CODING SKILLS

    Wees als eerste op de hoogte van mijn berichten!