Build highly engaging Vue.js apps with Nuxt.js. Nuxt adds easy server-side-rendering and a folder-based config approach
About This Video
In Detail
This course will take you on a journey where you'll you will learn to build highly engaging Vue.js apps with Nuxt.js. Nuxt adds easy server-side-rendering and a folder-based …
Build highly engaging Vue.js apps with Nuxt.js. Nuxt adds easy server-side-rendering and a folder-based config approach
About This Video
In Detail
This course will take you on a journey where you'll you will learn to build highly engaging Vue.js apps with Nuxt.js. Nuxt adds easy server-side-rendering and a folder-based config approach. Vue.js is an amazing JavaScript framework which you can use to build highly engaging user interfaces and single.- page applications. You'll master all the details in this course but the most important takeaway is that Nuxt.js makes creating better, more optimized, and more capable Vue apps much easier—and all of that while adding pretty much no overhead. You'll learn how to create Nuxt/ Vue apps from scratch! You'll build an entire course project and dive into the core features Nuxt.js offers. By the end of the course, you'll have a complete Vue app, built with Nuxt.js, which can be rendered on the server (or as a static website!) and which is highly optimized.
The code bundle for this video course is available at https://github.com/PacktPublishing/Nuxt.js---Vue.js-on-Steroids
Chapter 1 : Getting Started
Welcome & Introduction 00:01:21
What is Nuxt.js? 00:02:58
Understanding Server Side Rendering 00:04:02
Nuxt vs “Normal” Server Side Rendering 00:01:33
Creating our First Nuxt App 00:05:07
Understanding the Folder Structure 00:05:38
What can we Build with Nuxt? 00:02:34
What’s Inside This Course? 00:02:07
How To Get The Most Out Of This Course 00:01:11
Chapter 2 : Pages, Routing & Views
Module Introduction 00:00:56
From Folders to Routes 00:06:32
Creating a Route with a Dynamic Path 00:05:25
Adding Links & Navigating Around 00:06:22
Validating Parameters 00:05:58
Creating Nested Routes 00:03:12
Layouts, Pages & Components – Theory 00:01:30
Adding a New Layout 00:03:52
Adding a Default Error Page 00:01:24
Working with “Normal” Components 00:07:52
Styling Nuxt Apps 00:05:35
Wrap Up 00:01:03
Chapter 3 : Project - Pages, Routing & Views
Module Introduction 00:01:13
Creating the Main “Sections” (Pages) 00:07:58
Adding External Fonts 00:03:49
Creating the Landing Page 00:05:50
Splitting the Page into Components 00:08:28
Adding Static Assets - The Background Image 00:02:34
Adding the Header Component 00:05:54
Vue Router vs. Nuxt Router 00:01:29
Working on the Post Page 00:04:34
Creating an Admin Section 00:12:37
Preparing the Backend 00:10:21
Improving the App 00:02:38
Adding a Separate Layout to the Admin Area 00:02:50
Chapter 4 : Handling Data
Module Introduction 00:01:01
Adding Dynamic Data 00:05:52
Preparing Data on the Server-Side (through Nuxt) 00:09:09
asyncData on Client & Server 00:03:17
A r Look at the Context Object 00:02:45
Adding Async Data to a Single Post 00:05:31
Handling Errors with a Callback 00:01:55
Using Promises in asyncData 00:03:18
Adding the Vuex Store 00:08:00
Vuex, fetch() and nuxtServerInit() 00:09:26
Wrap Up 00:03:12
Chapter 5 : Connecting our App to the Backend
Module Introduction 00:00:45
Executing Code on the Server 00:03:36
Adding Firebase as a Backend 00:02:06
Using Firebase to Store Data 00:04:56
Fetching Data from the Backend 00:04:18
Initializing our Store 00:02:54
Fetching all Posts 00:05:09
Editing Posts 00:04:33
Synchronizing Vuex and the Backend 00:10:37
Wrap Up 00:01:59
Chapter 6 : Nuxt - Config, Plugins & Modules
Module Introduction 00:00:57
The Nuxt Config File 00:06:29
The Loading Property 00:03:29
Working with Environment Variables 00:05:38
Manipulating Routing Settings 00:04:34
Animating Page Transitions 00:03:18
Adding Plugins 00:05:17
Registering a Date Filter 00:02:11
Understanding Modules 00:08:09
Wrap Up 00:00:47
Chapter 7 : Middleware & Authentication
Module Introduction 00:00:44
What is Middleware? 00:06:47
Adding User Signup 00:06:49
Adding User Login 00:02:53
Storing the Token 00:06:00
Using the Token for Authentication 00:03:22
Implementing a Middleware 00:04:11
Invalidating the Token 00:02:53
Persisting the Token Across Page Refreshes 00:09:53
Implementing Cookies 00:09:34
Fixing the Logout Timer 00:06:20
Adding the Logout Functionality 00:05:03
A Quick Bugfix 00:00:48
Chapter 8 : The Server Side
Module Introduction 00:01:13
Adding Server Side Middleware 00:06:18
Testing the Middleware 00:02:12
Starting a Project with a Server Side Template 00:03:09
Chapter 9 : Building a Nuxt App
Module Introduction 00:00:32
Universal vs SPA vs Static 00:03:02
Building our App as a Universal App 00:02:03
Building our App as a SPA 00:05:44
Building our App as a Static Website 00:03:21
Improving the Generate Process 00:04:43
Limiting the Amount of http Requests 00:03:05
Adjusting the Store 00:02:33
Chapter 10 : Round Up
Course Roundup 00:00:53