O'Reilly logo

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

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

Video Description

Develop Effective, Performant, Maintainable Front-End Applications Using Vue.js

About This Video

  • Learn to setup Node.js and other software packages required to build a web application.
  • Build a single-page application using Vue.js and Node.js.
  • Learn to add Authorization and test cases to improve the reliability of your web application.

In Detail

Vue.js is a versatile, approachable, and performant open-source JavaScript framework for building UIs and has a maintainable and testable code base. In combination with modern tools and support libraries, Vue.js will incrementally scale your projects to a solid and robust architecture.

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.

Downloading the example code for this course: You can download the example code files for all Packt video courses you have purchased from your account at http://www.PacktPub.com. If you purchased this course elsewhere, you can visit http://www.PacktPub.com/support and register to have the files e-mailed directly to you.

Table of Contents

  1. Chapter 1 : Getting Started with Vue.js
    1. The Course Overview 00:03:32
    2. First Step Towards Vue 00:02:41
    3. Setting Up Vue Using Node.js 00:04:54
    4. Basics, Directives, and Reactivity 00:06:53
    5. Vue DevTools 00:05:35
  2. Chapter 2 : Building a Project with Vue.js
    1. Installing Vue-CLI and Creating a New Project 00:03:54
    2. Tour of Project Files and What Are Single-File Components? 00:04:13
    3. Using Axios to Consume a Third-Party API 00:05:54
    4. Creating Custom Components and Importing Them 00:05:22
  3. Chapter 3 : State Management and Routing
    1. Installing Vuex and vue-router and Adding Them to the Vue Instance 00:04:02
    2. Vue Core Concepts and How to Implement – Part 1 00:06:04
    3. Vue Core Concepts and How to Implement – Part 2 00:05:29
    4. How to Use vue-router and Router Links 00:06:45
    5. Application Structure – Part 1 00:06:33
    6. Application Structure – Part 2 00:02:33
  4. Chapter 4 : Setting Up the API
    1. Putting Together the Sample API Code and Adding to the Frontend Application 00:08:43
    2. How to Set Up the Database 00:05:53
    3. Demonstration of API in REST Client 00:04:08
    4. Creating an Account and Then Authenticating /Getting a Token – Part 1 00:05:30
    5. Creating an Account and Then Authenticating /Getting a Token – Part 2 00:05:18
  5. Chapter 5 : Create, Read, Update, and Delete with Node.js
    1. Setup Login Page, Functionality and Adding the User – Part 1 00:05:05
    2. Setup Login Page, Functionality and Adding the User – Part 1 00:04:29
    3. Using the API to Create, Read, Update, and Delete Items – Part 1 00:08:13
    4. Using the API to Create, Read, Update, and Delete Items – Part 2 00:05:06
    5. Using the API to Create, Read, Update, and Delete Items – Part 3 00:07:11
    6. Using the API to Create, Read, Update, and Delete Items – Part 4 00:07:07
    7. Using the Vuex Store as a Single Point of Contact to the API 00:04:57
    8. Testing 00:08:01
    9. Security 00:06:19