real-world-vue

Course Take aways:

• Installation of NProgress to create a better experience for a user when they are interacting with our application.
  • Axios Interceptors
    • Not optimal for multiple API calls
    • We do not want to show the user the template before the data is available.
  • In-component Route Gaurds
  • Global and Per-Route Gaurds (Unltimately will use this.)
• Use the npx json-server -d 1500 --watch ./db.json command to simulate a slow network response.
• Good reasons to use interceptors:
  • On request to set authorization tokens
  • On respinse to format or filter data before it reaches into your app
  • On response to catch 401 not authorized responses

Following along?

We encourage you to follow the course on Vue Mastery, and code along with us. This course has tags representing the start and finish of each level, just in case you get stuck. Here's the start and ending code of each lesson, if you'd like to download them.

Lesson
2 - Vue CLI	n/a	Finished Code
3 - Optimizing your IDE	Starting Code	Finished Code
4 - Vue Router Basics	Starting Code	Finished Code
5 - Dynamic Routes & History Mode	Starting Code	Finished Code
6 - Single File Components	Starting Code	Finished Code
7 - Global Components	Starting Code	Finished Code
8 - Slots	Starting Code	Finished Code
9 - API Calls with Axios	Starting Code	Finished Code
11 - Vuex State & Getters	Starting Code	Finished Code
12 - Vuex Mutations & Actions Part 1	Starting Code	Finished Code
13 - Vuex Mutations & Actions Part 2	Starting Code	Finished Code
14 - Vuex Modules	Starting Code	Finished Code
15 - Success & Error Notifications	Starting Code	Finished Code

Project setup

npm install

Compiles and hot-reloads for development

npm run serve

Compiles and minifies for production

npm run build

Lints and fixes files

npm run lint