Setup VueJS in under 5 min.
2 min readMar 2, 2018
If you liked my article Setup React.js with Npm, Babel 6 and Webpack in under 1 hour then maybe you will like this one to, I have to say that it was a lot easier and faster to setup VueJS than React so the time needed is a lot shorter and also my article is shorter ;)
Not to spoil anything but I also like VueJS better, we don't need to put our HTML in the JS-file, yeah!!, as Offspring sings “ You gotta keep ’em separated”. Me like!!
Anyway here we go, lets create your first VueJS app :
Start with downloading VueJS here or add this in your lower <body> tag
<script src="https://cdn.jsdelivr.net/npm/vue@2.5.13/dist/vue.js"></script>Create your HTML, or copy this
<main id="app">
<h1>{{ headline }}</h1>
<p>{{ text }}</p>
<span>{{ count }}</span>
<a href="#" v-on:click="likeMeHandler">{{ link }}</a>
</main>create your CSS or copy this
main {
padding: 24px;
}
h1 {
font-family: Arial;
font-weight: bold;
font-size: 22px;
line-height: 24px;
margin: 0 0 22px;
padding: 0;
}
p {
font-family: Arial;
font-weight: normal;
font-size: 16px;
line-height: 18px;
margin: 0 0 12px;
padding: 0;
}
span {
font-family: Arial;
font-weight: bold…