Hello World Vernaillen.dev

Introducing a complete rewrite of the website for my freelance business, now built with Vue 3, Vite, Tailwind and Markdown

11 Jun 2022

Zottegem, Belgium

Sunset of Vernaillen.com

To be honest the most important reason I wanted to make a new website is because Vernaillen.com was made in Liferay and I didn’t want to keep a Liferay server running only for my personal website. Also, my main focus as a freelance consultant is not on Liferay any more lately, but more on full stack development with Spring micro-services, Angular or Vue.js, as well as on DevOps with Kubernetes, Jenkins, Sonar, etc.

I wanted to become more skilled in Vue.js anyway, so I decided to rewrite my website using Vue 3, Vite, Tailwind and Markdown:

Hello World for Vernaillen.dev

For the design I decided to use this Startup Tailwind CSS Template, cause I’m a developer, not a designer :D It was fun to port into the Vue app. And after changing the main colors to match my company branding and logo (design by my sister, Anneleen Vernaillen), I thought the result was quite nice.

Most of the fun for me was in learning the new features of Vue 3, learning how to use Vite and Tailwind, and create blog functionality based on markdown files. The result is a website that is very easy to edit and publish content updates,cause as a developer I’m obviously familiar with git and markdown anway.

Website Features

  • Pinia is used to keep track of the audio player state
  • Automated deployments / auto publishing on Netlify
  • Continous integration with CircleCI
  • Code quality check with SonarCloud
  • Unit tests with vitest
  • Edit: I’m currently also testing a custom Gallery functionality, which just loads all images in a given folder and allows view them using vue-easy-lightbox. Here’s the test page