Vue.js for Beginners : A Step-by-Step Guide to Building Web Apps
Vue.js is a progressive front-end framework for building modern web applications. In this book, you'll learn how to
138 25 1MB
English Pages 191 Year 2023
Table of contents :
Foreword
introduction
I - Your first Vue.js Web Application
Building UpVote in Vue.js
Development environment setup
JavaScript ES6/ES7
Setting up the view
Making the view data-driven in Vue.js
List rendering in Vue.js
Sorting in Vue.js
Event handling (our app’s first interaction) nents
Components in Vue.js
v-bind and v-on shorthand syntax in Vue.js
II - Single-file components
Setting up our development environment in Vue.js
Getting started in Vue.js
Single-File Components in Vue.js
Breaking the app into components in Vue.js
Managing data between components in Vue.js
Simple State Management in Vue.js
Steps to building Vue apps from scratch in Vue.js
Step 1: A static version of the app
Step 2: Breaking the app into components
Step 3: Hardcode Initial States
Step 4: Create state mutations (and corresponding component actions)
III - Custom Events
JavaScript Custom Events
Vue Custom Events
Event Bus in Vue.js
Custom events and managing data in Vue.js
IV - Introduction to Vuex
What is Flux?
Flux implementations
Vuex
Refactoring the note-taking app in Vue.js
Vuex Store in Vue.js
Building the components in Vue.js
V - Vuex and Servers
Preparation in Vue.js
The Server API in Vue.js
Playing with the API in Vue.js
Client and server in Vue.js
The Vuex Store in Vue.js
productModule in Vue.js
cartModule in Vue.js
Interactivity in Vue.js
VI - Form Handling
Forms 101 in Vue.js
The Basic Button in Vue.js
Text Input in Vue.js
Multiple Fields in Vue.js
Validations in Vue.js
Form Modules in Vue.js
VII - Routing in Vue.js
What is routing? in Vue.js
URL in Vue.js
Single-page applications in Vue.js
Basic Vue Router in Vue.js
Dynamic Route Matching in Vue.js
The Server API in Vue.js
Starting point of the app in Vue.js
Integrating vue-router in Vue.js
Supporting authenticated routes in Vue.js
Implementing login in Vue.js
Vue Watchers in Vue.js
Navigation Guards in Vue.js
Recap and further reading in Vue.js
VIII - Unit Testing
End-to-end vs. Unit Testing in Vue.js
Testing tools in Vue.js
Testing a basic Vue component
Setup
vue-test-utils
Foreword
introduction
I - Your first Vue.js Web Application
Building UpVote in Vue.js
Development environment setup
JavaScript ES6/ES7
Setting up the view
Making the view data-driven in Vue.js
List rendering in Vue.js
Sorting in Vue.js
Event handling (our app’s first interaction) nents
Components in Vue.js
v-bind and v-on shorthand syntax in Vue.js
II - Single-file components
Setting up our development environment in Vue.js
Getting started in Vue.js
Single-File Components in Vue.js
Breaking the app into components in Vue.js
Managing data between components in Vue.js
Simple State Management in Vue.js
Steps to building Vue apps from scratch in Vue.js
Step 1: A static version of the app
Step 2: Breaking the app into components
Step 3: Hardcode Initial States
Step 4: Create state mutations (and corresponding component actions)
III - Custom Events
JavaScript Custom Events
Vue Custom Events
Event Bus in Vue.js
Custom events and managing data in Vue.js
IV - Introduction to Vuex
What is Flux?
Flux implementations
Vuex
Refactoring the note-taking app in Vue.js
Vuex Store in Vue.js
Building the components in Vue.js
V - Vuex and Servers
Preparation in Vue.js
The Server API in Vue.js
Playing with the API in Vue.js
Client and server in Vue.js
The Vuex Store in Vue.js
productModule in Vue.js
cartModule in Vue.js
Interactivity in Vue.js
VI - Form Handling
Forms 101 in Vue.js
The Basic Button in Vue.js
Text Input in Vue.js
Multiple Fields in Vue.js
Validations in Vue.js
Form Modules in Vue.js
VII - Routing in Vue.js
What is routing? in Vue.js
URL in Vue.js
Single-page applications in Vue.js
Basic Vue Router in Vue.js
Dynamic Route Matching in Vue.js
The Server API in Vue.js
Starting point of the app in Vue.js
Integrating vue-router in Vue.js
Supporting authenticated routes in Vue.js
Implementing login in Vue.js
Vue Watchers in Vue.js
Navigation Guards in Vue.js
Recap and further reading in Vue.js
VIII - Unit Testing
End-to-end vs. Unit Testing in Vue.js
Testing tools in Vue.js
Testing a basic Vue component
Setup
vue-test-utils
