Besteltool pastadag scouts

Introductie

Ik ontwikkelde een complete full stack applicatie waarmee ouders, leiding en sympathisanten eenvoudig online pasta konden bestellen voor onze jaarlijkse pastadag van de oudste tak.

Bij Scouts en Gidsen Retie organiseren we elk jaar een gezellige pastadag ten voordele van onze oudste tak, de Givers. Waar we vroeger werkten met een Google Formulier om bestellingen te verzamelen, hebben we dit jaar gekozen voor een professionelere aanpak.

Om meer controle te hebben over het bestelproces, het ontwerp en de verwerking van de gegevens, ontwikkelde ik een eigen full stack webapplicatie. Deze applicatie laat ouders, leiding en sympathisanten toe om op een gebruiksvriendelijke manier hun pastabestelling online door te geven.

Naast een vlottere bestelervaring biedt de applicatie ook een overzichtelijk administratiescherm voor de organisatoren. Hier kunnen bestellingen eenvoudig beheerd worden en er zijn handige printfuncties voorzien voor het afdrukken van individuele bestelkaartjes per tafel. Zo zorgen we voor een vlot verloop van de pastadag, zowel voor bezoekers als voor de keukenploeg.

Realistatie

Voor de ontwikkeling van de applicatie koos ik voor een moderne full stack aanpak, waarbij gebruiksgemak, schaalbaarheid en eenvoudige onderhoudbaarheid centraal staan.

De backend is opgebouwd met Node.js en Express, waarbij de data wordt opgeslagen in een MongoDB Atlas-database. Er is één overzichtelijk schema waarin alle bestellingen worden bijgehouden, wat het verwerken en opvragen van gegevens efficiënt maakt.

De frontend werd ontwikkeld in Vue.js 3, in combinatie met PrimeVue voor het ontwerpen van een intuïtieve en responsieve gebruikersinterface. Voor authenticatie binnen het beheerpaneel maakte ik gebruik van Firebase Authentication, zodat enkel bevoegde personen toegang hebben tot het administratiescherm.

Bij elke bestelling ontvangen de gebruiker en ik automatisch een bevestigingsmail, verstuurd via Nodemailer.

De applicatie werd als volgt gehost:

  • Frontend op een domein dat ik via school kreeg: www.maximpeeters.be, gehost via Combell.
  • Backend via Vercel, wat zorgt voor snelle en stabiele hosting van de API.

Deze technische opzet resulteerde in een betrouwbare en professioneel ogende oplossing die zowel de gebruikers als de organisatoren een vlottere ervaring biedt tijdens de jaarlijkse pastadag.

Reflectie

Tijdens het ontwikkelen van deze besteltool heb ik veel bijgeleerd over het opzetten van een volledige full stack applicatie, van backend tot frontend. Ik heb mijn kennis van Node.js, Express en MongoDB verder verdiept, vooral op het vlak van het structureren van data en het opzetten van een efficiënte API. Ook het werken met Vue.js 3 en PrimeVue heeft mijn vaardigheden in het bouwen van moderne, gebruiksvriendelijke interfaces versterkt.

Daarnaast heb ik ervaring opgedaan met het implementeren van authenticatie via Firebase en het versturen van automatische e-mails met Nodemailer. Het hosten van de verschillende onderdelen op aparte platformen (Combell en Vercel) leerde me meer over het beheren en deployen van webapplicaties in de praktijk.

Tot slot heb ik geleerd hoe belangrijk het is om een applicatie niet alleen technisch goed te bouwen, maar ook te zorgen voor een vlotte gebruikerservaring en een eenvoudig beheer voor de organisatoren. Deze inzichten neem ik mee naar toekomstige projecten.