Vele websites, zoals deze eigenste site, worden ontworpen met een ontwerpprogramma zoals AdobeXd of Figma en vervolgens omgezet naar HTML5, (S)CSS en JavaScript code. Daarbij wordt bijzondere aandacht geschonken aan een mobile-first benadering en een logische opdeling van de code in secties en componenten. Een voorbeeld van hoe dit er in de praktijk precies uitziet vind je in de broncode voor deze website op deze Github-pagina.

Het ontwikkelen gaat (soms) sneller als je kan verder bouwen op het werk van anderen. Bibliotheken waar ik mee vertrouwd ben:

• JQuery: voorbeeld
• Bootstrap: voorbeeld
• Semantic UI: voorbeeld

Al die code beheren en optimaliseren gebeurt meestal met één van de volgende tools:

• ParcelJs
• Webpack
• GulpJs: voorbeeld

Layouts en visuele animaties kunnen in alle mogelijke kleuren en configuraties. Een selectie voorbeelden en experimenten vind je op mijn Codepen:

NodeJs een solide open-bron runtime-omgeving voor JavaScript. Het is een heel erg veelzijdige omgeving om applicaties in te bouwen die vervolgens op zowat elk platform kunnen worden uitgevoerd. JavaScript is dé taal van het web en via NodeJs kan je dezelfde programmeertaal hanteren voor zowel de gebruikersinterface (UI) als de logica voor de server of backend taken. In combinatie met TypeScript, een superset van JavaScript, kan je met NodeJs heel solide en performante programma's bouwen: van webservers en REST API's tot Command Line applicaties en test oplossingen.

Je web app moet bereikbaar zijn via een server en een domeinnaam. Het configureren van domeinnamen en DNS (Domain Name Servers) met subdomeinen, email, SSL certificaten en eventueel een CDN (Content Delivery Network) is een taak die hoort bij elke website.

Serverbeheer is niet mijn hoofdactiviteit maar ik ben wel voldoende vertrouwd met het opzetten en onderhouden van virtuele servers (VPS) voor zowel voor NodeJs apps als Wordpress websites. Werken met tools zoals Nginx (reverse proxy), PM2, SSH of Docker containers, is mij niet vreemd:

• Nginx configuratie: voorbeeld
• Docker Compose configuratie: voorbeeld
• Bash script voor automatische code updates naar VPS server: voorbeeld
• Geautomatiseerde builds en cloud functies via Netlify/AWS: voorbeeld

Voor het ontwikkelen van applicaties wordt een beroep gedaan op een ontwikkelingsomgeving of IDE, Integrated Development Environment. Een collectie programma's en instrumenten om je code te schrijven en te testen.

Mijn basisconfiguratie bestaat uit Windows Subsystem for Linux (WSL2) en Visual Studio Code, aangevuld met verschillende extensies en plugins voor bijvoorbeeld Docker, het formatteren van code (Prettier) of het automatisch genereren van suggesties (Tabnine AI).

Broncode beheer: Git (Git Flow), Github en Gitea (zelf gehost op eigen server).

Projectbeheer: Ik ben vertrouwd met Enterprise oplossingen zoals Jira maar voor persoonlijke projecten verkies ik een Kanban workflow via Taiga —  tot ook dat weer verandert.

Andere programmeertalen?

Mijn focus ligt op JavaScript en bij uitbreiding TypeScript. Als webontwikkelaar en Wordpress-bouwer kom je natuurlijk ook af en toe in contact met PHP.

Python wordt terecht geroemd voor z'n elegantie en eenvoud en het is een programmeertaal waar ik steeds vaker en heel graag mee experimenteer: voorbeelden op Github.