Diafragmaat
logo Diafragmaat

Waarom website ontwikkel tools

Logo Diafragmaat.

Als full-stack websiteontwikkelaars wil je natuurlijk snel dynamische, onderhoudsvriendelijke en herbruikbare applicaties bouwen en/ of onderhouden. Een belangrijke methode om dit te bewerkstelligen is door gebruik name van ontwikkeltools. Diafragmaat gebruikt voor al haar sites, de zogenaamde TALL-stack. De TALL-stack bestaat uit 4 technologische onderdelen of ook wel framewerken genoemd.

TALL is een acroniem voor TailwindCSS, Alpine.js Laravel en Livewire. Door gebruik te maken van deze framewerken, kunnen we makkelijker begrijpbare code gebruiken die vele kenmerken kan hebben. Zodoende zijn de ontwerp mogelijkheden zowel in de front-end als backend zeer uitgebreid. Dit terwijl de code goed leesbaar, herbruikbaar en netjes blijft.

De full stack websiteontwikkelaar

Daar waar Laravel ontwikkelaars zich voor een groot deel op de backend concentreren kunnen we met de 3 andere TALL leden, vooral ook het front-end van de webapplicatie bedienen.

Door de complete TALL-stack te gebruiken, kunnen we wat makkelijker full stack ontwikkelen. De connectie met de bron is vaak een database. De database functionaliteit en de interactie met de database wordt als backend gezien. Terwijl ontwerp en website functionaliteit meer aan de kant van de front-end ontwikkelaar liggen.

Tailwind

TailwindCSS is een framewerk voor de opmaak van een HTML-web pagina. Het wordt geleverd met een uitgebreide lijst van klassen. Deze klassen zijn puur gebaseerd op één of enkele utiliteiten.

Je hoeft hierdoor vrijwel nooit de CSS (stijl-lijst) in te zien of zelfs maar aan te passen.

Behalve standaardisatie van klassen namen, is er een groot voordeel dat de klassen alleen in de uiteindelijke CSS lijst komen, als men ze ook daadwerkelijk gebruikt. Dit komt ten goede aan de omvang van het bestand, die vaak een fractie is van andere framewerken.

Alpine.js

Alpine.je is een klein Javascript framewerk dat zich richt vaak voorkomende aanpassingen binnen de objecten van je html pagina. Via 15 attributen, 6 eigendommen en 2 methoden kan je bijvoorbeeld elementen, tekst en zichtbaarheid aanpassen.

Een voorbeeld van gebruik van Alpine.js op deze pagina is de menubalk bovenaan in deze pagina. Deze animeert omhoog als we naar beneden scrollen en terug als we weer naar boven scrollen.

Laravel

Laravel is een PHP framewerk met een elegante en structurele zinsbouw. Creatie van een Laravel webapplicatie concentreert zich meer op de applicatie zelf, als op de PHP details, die Laravel gedeeltelijk uit handen neemt.

Als ontwikkelaar heb je met Laravel krachtige kenmerken tot je beschikking: Zo heeft het onder andere een expressieve database-abstractie laag, een test suite, taken planning, en een grondige afhankelijkheidsinjectie.

Laravel groeit met de ontwikkelaar mee. Vanaf de eerste stappen in Laravel, tot uitgebreide professionele web Laravel-applicaties.

Livewire

Livewire blinkt uit in de simpliciteit waarmee full stack ontwikkelaars aan de slag kunnen. Livewire is een full-stack framewerk, specifiek voor Laravel, dat het maken van dynamische interfaces makkelijker maakt.

Vue en React zijn ook voorbeelden van zeer uitgebreide interface framewerken, maar voegen vaak ook grote complexiteit aan de code toe.

Livewire is prima vanuit een SEO-oogpunt, omdat het het interactieve component initieel al laat zien. Tijdens interactie, wordt op de achtergrond verbinding gelegd met de server middels een AJAX aanvraag. De server zal het object updaten en terugsturen, waarna Livewire het onderdeel intelligent muteert met de nieuwe verandering.

Lees ook mijn blog over onderwerpen die onder andere gaan over deze tools:

Uit het blog

1 month ago

AI
SEO

Bestaat SEO in 2025 nog?

SERP, ofwel de zoekresultaten pagina's, worden meer en meer door AI gegenereerd. SEO ofwel Search Engine Optimalisatie, gaat daarom een steeds kleinere rol spelen. Wat gaat er veranderen jou website?

Guido

Eigenaar Diafragmaat

5 months ago

Technisch
Socials

Delen? OG tag toch!

OG, ofwel Open Graph is een set van afspraken die het delen van inhoud, op sociale media defineerd. Maar is het eigenlijk wel de moeite waard om dit te doen?

Guido

Eigenaar Diafragmaat

7 months ago

Technisch
AI
SEO

Ai ai aii! SEO!

SEO, het slimme neefje op het internetmarketingfeestje staat tegenwoordig pal naast AI. Samen maken onderdeel uit van de digitale VIP's!

Guido

Eigenaar Diafragmaat

9 months ago

Technisch
Laravel

Blade componenten - WOO!

De blade componenten van Laravel zorgen voor overzicht, uniformiteit, en vooral ook snelheid. We gaan er vandaag een maken en gelijk toepassen op de pagina! We hanteren als zodanig de werkwijze WOO (Write Only Once). Of door de makers van Laravel, ook wel DRY (Don't Repeat Yourself) genoemd.

Guido

Eigenaar Diafragmaat

11 months ago

Technisch
Livewire

Het is tijd voor tijd.

Verre vakanties, vele verhalen, soms vreemde vogels, en vaak verzetten. Bij het verzetten, gaat het dan over de klok. Ik heb eens gekeken hoe we het verschil in tijdzone het beste kunnen uitleggen op een webpagina. Al doende kwam ik op het idee een live wereldklok te maken die ook verschillen in de zomer & wintertijd bijhoudt.

Guido

Eigenaar Diafragmaat