We’ll start with a brief introduction to Vue.js: what it is and how it can be added to an existing website. Then we’ll take an existing landing page and add Vue.js to it so that we can make it interactive. We’ll touch a little bit on the ajax part too.
In the second part, we are going to learn about Vue.js components model, what it is, and how it was build to make components interact with each other. Once the component model is clear we’ll take the standard TodoMVC HTML template and fully transform it into a Vue.js components application.
The third part will take a podcast aggregator application and add incrementally Vue.js features to it:
Vue-router: we’ll add pages and navigate between them in the application.
Vuex: we’ll introduce Flux architecture with unidirectional data flow
REST: we’ll integrate with Axios to make backend calls and work with the responses we get
GraphQL: we’ll integrate with a GraphQL backend and make calls to it and deal with the response
For all 3 parts, we are going to store the code with Github and deploy it live using Netlify. This way all your code is safe and also available on the internet to share with others, just in case you want to. Nothing stops you to build your Vue.js applications and use the same ways to make it Live online.
This section will introduce a form validation framework and how we can use it with Vue.js.
We hope to see you in class!
Dragos & Razvan
A full stack developer that lives at the seaside and enjoys working with technology.
I’ve started fiddling with web pages since 2012, from implementing landing pages all the way up to using design systems for consistent web apps, with open-source and in-house frameworks.