Full Stack Web Development with Vue.js and Node.js

Full Stack Web Development with Vue.js and Node.js

English | MP4 | AVC 1920×1080 | AAC 48KHz 2ch | 2h 40m | 510 MB

Create full-stack reactive web applications with Vue.js and Node.js

This course will help you develop effective and maintainable full-stack web applications using Vue.js and Node.js. You’ll start by building the frontend to a songs playlist application, to log in, create a new playlist, and search through YouTube videos. You’ll learn how to build a scalable Vue.js frontend that can work well in combination with a Node.js backend application.

Next, you’ll learn how to consume data from a third-party API within your application as well as how to perform CRUD operations against a locally hosted API using the HTTP client Axios.

By the end of the course, you will have an understanding of fundamental Vue.js concepts and will know how to use its state management library, Vuex, and its frontend routing library, Vue-router. Also, you’ll be confident in building powerful and performant frontend web development using Vue.js.

In a practical manner, you will learn to implement various Vue.js modules, components, and features in order to build frontend applications and integrate the backend with Node.js for complete full stack web development, with a focus on the frontend.

What You Will Learn

  • Build the frontend to a songs playlist application, search videos and add them to the playlist, and give them a label and rating.
  • Learn to set up a blank Vue.js application on a Node.js server.
  • Learn about the HTTP client Axios to consume REST APIs to get data.
  • State management using Vuex and frontend routing using Vue-router.
  • Learn how to work with the Node.js backend of the application to persist data in the frontend.
  • Work with Vue libraries and modules that are useful for any SPA, such as unit testing and server-side rendering.
Table of Contents

Getting Started with Vue.js
1 The Course Overview
2 First Step Towards Vue
3 Setting Up Vue Using Node.js
4 Basics, Directives, and Reactivity
5 Vue DevTools

Building a Project with Vue.js
6 Installing Vue-CLI and Creating a New Project
7 Tour of Project Files and What Are Single-File Components
8 Using Axios to Consume a Third-Party API
9 Creating Custom Components and Importing Them

State Management and Routing
10 Installing Vuex and vue-router and Adding Them to the Vue Instance
11 Vue Core Concepts and How to Implement – Part 1
12 Vue Core Concepts and How to Implement – Part 2
13 How to Use vue-router and Router Links
14 Application Structure – Part 1
15 Application Structure – Part 2

Setting Up the API
16 Putting Together the Sample API Code and Adding to the Frontend Application
17 How to Set Up the Database
18 Demonstration of API in REST Client
19 Creating an Account and Then Authenticating Getting a Token – Part 1
20 Creating an Account and Then Authenticating Getting a Token – Part 2

Create, Read, Update, and Delete with Node.js
21 Setup Login Page, Functionality and Adding the User – Part 1
22 Setup Login Page, Functionality and Adding the User – Part 2
23 Using the API to Create, Read, Update, and Delete Items – Part 1
24 Using the API to Create, Read, Update, and Delete Items – Part 2
25 Using the API to Create, Read, Update, and Delete Items – Part 3
26 Using the API to Create, Read, Update, and Delete Items – Part 4
27 Using the Vuex Store as a Single Point of Contact to the API
28 Testing
29 Security