Tutorial: Building a simple Web Application with Vue (for absolute beginners)-focus on result and fun
I have created a tutorial “Building a web application with Vue” for the Conclusion Code Café (August 2023). You will find it here in a GitHub Repo.
Note: the tutorial is accompanied by this slide deck — containing further visual introductions of the concepts discussed in the tutorial.
A little history: I wanted to create a simple web application that publishes a calendar of all technical knowledge events anywhere in my company (Conclusion, an ecosystem of 30 autonomous companies) — to make these sessions more accessible to the over 2500 colleagues who work in all these companies. After hearing quite some positive sentiments around Vue, I decided to simply get going. I read up on Vue, started creating my application step by step, adding child components, events and handlers, state, reactivity and a rich components library as I needed them, I ran into several roadblocks — things I did not understand or could not immediately get to work. This tutorial is based on that experience and created right after I managed to get things to work and to understand enough to get to work. I am not a Vue expert — I am the novice who has had the first initiation. And that makes me the best possible guide for others who want to take that first step.
Why did I create it?
- I really liked my first experiences with Vue and I want others to have that same joy and feeling of accomplishment I had
- I know that by trying to turn my first experiences into a tutorial, I will better learn and understand myself what I have been doing; I force myself to better explore and document what I have pieced together from documentation, blog articles, ChatGPT, StackOverflow and other sources