Fitsolution Website

Fitsolution is een personal training bedrijf van een kennis van mij. Rond 2020 vroeg hij me of ik een website kon maken voor zijn bedrijf. Hij had vooral behoefte aan enkele informatieve pagina's en een eenvoudige webshop om zijn trainingsschema's te verkopen. Ik stelde aanvankelijk voor om een platform zoals Squarespace te gebruiken, dat aan de meeste van zijn wensen voldeed. Het ondersteunde echter geen betalingen over Bancontact, een populaire betaalmethode in België. Squarespace werkte via Stripe, dat destijds enkel kredietkaarten ondersteunde. Daarom besloten we samen dat ik een website op maat voor hem zou maken.

Om dit te realiseren, had ik vier dingen nodig: een webframework, een CMS, een betaalprovider en een hostingdienst, bij voorkeur allemaal gratis. Op dat moment was NextJS aan populariteit aan he winnen. Aangezien ik al wat ervaring had met ReactJS, was dat de logische keuze voor het framework. Headless CMS'en waren ook in opkomst en na wat onderzoek koos ik voor Prismic vanwege het gebruiksgemak en de eenvoudige API. Voor betalingen werd het Mollie, een Nederlandse betaalprovider die ik al kende en die Bancontact ondersteunde.

Om tijd te besparen integreerde ik ook Shopify als zowel e-commerceplatform en CMS via de checkout-API en GraphQL. Ik zou deze beslissing niet opnieuw maken, maar omdat ik toen nog vrij nieuw was in NodeJS en backend development, was het destijds een ok keuze. Omdat ik NextJS gebruikte, was het de logische keuze om alles te hosten op Vercel.

Dus, wat heb ik geleerd? NextJS was mijn eerste kennismaking met de zogeheten meta-frameworks. Ik leerde concepten als hydration, SSG, SSR en waarom het belangrijk is om eerst een voltallig HTML document te sturen voor SEO. Ik werd ook veel vertrouwder met het werken met externe API's in NodeJS, dankzij de headless CMS-setup met Prismic. Daarnaast was dit ook mijn eerste ervaring met GraphQL. Ik vind het concept interessant, maar geef de voorkeur aan gewone REST-API's. Tot slot zette ik mijn eerste stappen in CI/CD, door mijn Git-repository te koppelen aan Vercel en ENV variabelen te beheren voor deploys. Kleine stappen, maar betekenisvolle.

De website is niet langer online, maar de screenshots hierboven tonen hoe ze er uit zag. Alles, behalve het logo en de (stock)foto's, werd door mij ontworpen. Dit project was een uitstekende leerervaring en vormde een opstap naar het Customer Content Website Rebuild-project waar ik later aan werkte bij The Park Playground.