End Result Demo
Install Vue.js CLI (https://vuejs.org/v2/guide/installation.html#CLI)
Create new Vue.js Project, skipping defaults
Run npm install for node_module folders in the project if not done already
Open index.html ; include bootstrap in markup
Open HelloWorld.vue component (dir: src/components/HelloWorld.vue)
- replace script with the following
- replace template for the component with the following
(notice Vue binders syntax including v-on:click - mapping to add() method, v-model, . v-for utilized to display list of todo items)
Run npm run dev to build the project locally on port http://localhost:8080
View end result demo in browser
see the code - https://github.com/nickforce/VueJSTodoApp
Install Vue.js CLI (https://vuejs.org/v2/guide/installation.html#CLI)
$ npm install --global vue-cli
Create new Vue.js Project, skipping defaults
$ vue init webpack todo-project
$ npm installOpen index.html ; include bootstrap in markup
Open HelloWorld.vue component (dir: src/components/HelloWorld.vue)
- replace script with the following
- replace template for the component with the following
(notice Vue binders syntax including v-on:click - mapping to add() method, v-model, . v-for utilized to display list of todo items)
Run npm run dev to build the project locally on port http://localhost:8080
$ npm run dev
View end result demo in browser
see the code - https://github.com/nickforce/VueJSTodoApp
