English | MP4 | AVC 1280×720 | AAC 48KHz 2ch | 6.5 Hours | 866 MB
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 can join my bestselling course on Vue.js, here on Udemy, if you want to learn more about this awesome framework!
Nuxt.js takes it to the next level!
It’s a library for Vue.js (kind of a “framework for a framework”) and it adds two major things to Vue.js:
Server-side-rendering of your Vue app out of the box
Easy Vue app configuration via folders and files
You’ll of course learn all the details in this course but the most important takeaway is that Nuxt.js makes the creation of better, more optimized and more capable Vue apps much easier – and all of that whilst adding pretty much no overhead.
In this course, I’ll teach you how to create Nuxt/ Vue apps from scratch! We’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 course will teach you …
- what Nuxt.js exactly is and how it’s connected to Vue.js
- how you use Nuxt.js to build better Vue apps
- everything you need to know about the “configure via folders & files” approach taken by Nuxt
- different build possibilities like SSR apps, SPAs or a static webpage
- how you build an entire project, including authentication, via Nuxt.js
- And way more!
What Will I Learn?
- Build server-side-rendered single-page-applications (SPAs)
- Build normal, optimized SPAs with minimal effort
- Generate a static webpage from Vuejs code
Table of Contents
Getting Started
1 Where to Find the Source Code
2 Welcome & Introduction
3 What is Nuxt.js
4 Understanding Server Side Rendering
5 Nuxt vs Normal Server Side Rendering
6 Creating our First Nuxt App
7 Understanding the Folder Structure
8 What can we Build with Nuxt
9 What’s Inside This Course
10 How To Get The Most Out Of This Course
Pages Routing Views
11 Useful Resources Links
12 Module Introduction
13 From Folders to Routes
14 Creating a Route with a Dynamic Path
15 Adding Links & Navigating Around
16 Validating Parameters
17 Creating Nested Routes
18 Layouts, Pages & Components – Theory
19 Adding a New Layout
20 Adding a Default Error Page
21 Working with Normal Components
22 Styling Nuxt Apps
23 Wrap Up
Project – Pages Routing Views
24 Useful Resources Links
25 Module Introduction
26 Creating the Main Sections (Pages)
27 Adding External Fonts
28 Creating the Landing Page
29 Splitting the Page into Components
30 Adding Static Assets – The Background Image
31 Adding the Header Component
32 Vue Router vs. Nuxt Router
33 Working on the Post Page
34 Creating an Admin Section
35 Preparing the Backend
36 Improving the App
37 Adding a Separate Layout to the Admin Area
Handling Data
38 Useful Resources Links
39 Module Introduction
40 Adding Dynamic Data
41 Preparing Data on the Server-Side (through Nuxt)
42 asyncData on Client & Server
43 A Closer Look at the Context Object
44 Adding Async Data to a Single Post
45 Handling Errors with a Callback
46 Using Promises in asyncData
47 Adding the Vuex Store
48 Vuex, fetch() and nuxtServerInit()
49 Wrap Up
Connecting our App to the Backend
50 Useful Resources Links
51 Module Introduction
52 Executing Code on the Server
53 Adding Firebase as a Backend
54 Using Firebase to Store Data
55 Fetching Data from the Backend
56 Initializing our Store
57 Fetching all Posts
58 Editing Posts
59 Synchronizing Vuex and the Backend
60 Wrap Up
Nuxt – Config Plugins Modules
61 Useful Resources Links
62 Module Introduction
63 The Nuxt Config File
64 The Loading Property
65 Working with Environment Variables
66 Manipulating Routing Settings
67 Animating Page Transitions
68 Adding Plugins
69 Registering a Date Filter
70 Understanding Modules
71 Wrap Up
Middleware Authentication
72 Useful Resources Links
73 Module Introduction
74 What is Middleware
75 Adding User Signup
76 Adding User Login
77 Storing the Token
78 Using the Token for Authentication
79 Implementing a Middleware
80 Invalidating the Token
81 Persisting the Token Across Page Refreshes
82 Implementing Cookies
83 Fixing the Logout Timer
84 Adding the Logout Functionality
85 A Quick Bugfix
The Server Side
86 Useful Resources Links
87 Module Introduction
88 Adding Server Side Middleware
89 Testing the Middleware
90 Starting a Project with a Server Side Template
Building a Nuxt App
91 Deploying a Universal App
92 Fetching Data in the SPA
93 Deploying SPAs and Static Webpages
94 Useful Resources Links
95 Module Introduction
96 Universal vs SPA vs Static
97 Building our App as a Universal App
98 Building our App as a SPA
99 Building our App as a Static Website
100 Improving the Generate Process
101 Limiting the Amount of http Requests
102 Adjusting the Store
Round Up
103 Course Roundup
Resolve the captcha to access the links!