Nuxt.js - Vue.js on Steroids

6h 27m 50s
English
Paid

Welcome to the Nuxt.js Course - Elevate Your Vue.js Skills!This intensive training will guide you through enhancing your Vue apps using Nuxt.js, making your applications more optimized and capable with minimal overhead.

Course Overview

In this course, you'll learn to create Nuxt/Vue apps from scratch. We'll build a comprehensive project together, exploring the core features that Nuxt.js offers. By the end of this course, you'll have developed a complete, server-rendered, or statically rendered Vue app that's highly optimized.

Requirements

  • Basic knowledge of Vue.js is required; expertise is not necessary.
  • Everything else will be covered in the course!

Course Description

Vue.js is a powerful JavaScript framework for building interactive user interfaces and single-page applications. If you want to master Vue.js, consider joining my bestselling course on Vue.js on Udemy!

Take your skills further with Nuxt.js!

Nuxt.js is like a 'framework for a framework' that enhances Vue.js with:

  • Server-side rendering capabilities straight out of the box
  • Effortless Vue app configuration using folders and files

What You'll Learn

  • The role of Nuxt.js and its connection to Vue.js
  • How to leverage Nuxt.js for building superior Vue apps
  • Comprehensive understanding of Nuxt's folder & file configuration approach
  • Various building options including SSR apps, SPAs, or static web pages
  • Building a complete project with components like authentication using Nuxt.js
  • And much more!

Instructor Profile: Maximilian Schwarzmüller

I'm Maximilian Schwarzmüller, the creator of the Academind's webpage with Nuxt.js, and the instructor of the highly acclaimed Vue.js course on Udemy. Having worked with Vue and Nuxt since their beta stages, I am passionate about teaching these frameworks and excited to share my knowledge with you!

Who Should Enroll?

  • Developers aiming to build engaging, server-side rendered Vue.js applications
  • Individuals interested in a minimal-configuration approach to Vue.js
  • Anyone looking to create static websites using Vue.js and Nuxt as a static page generator

Learning Outcomes

  • Develop server-side-rendered single-page-applications (SPAs)
  • Create optimized SPAs with minimal configuration effort
  • Generate a static website from Vue.js code

About the Author: udemy

udemy thumbnail
By connecting students all over the world to the best instructors, Udemy is helping individuals reach their goals and pursue their dreams. Udemy is the leading global marketplace for teaching and learning, connecting millions of students to the skills they need to succeed. Udemy helps organizations of all kinds prepare for the ever-evolving future of work. Our curated collection of top-rated business and technical courses gives companies, governments, and nonprofits the power to develop in-house expertise and satisfy employees’ hunger for learning and development.

Watch Online 91 lessons

This is a demo lesson (10:00 remaining)

You can watch up to 10 minutes for free. Subscribe to unlock all 91 lessons in this course and access 10,000+ hours of premium content across all courses.

View Pricing
0:00
/
#1: Welcome & Introduction
All Course Lessons (91)
#Lesson TitleDurationAccess
1
Welcome & Introduction Demo
01:54
2
What is Nuxt.js?
02:59
3
Understanding Server Side Rendering
04:02
4
Nuxt vs "Normal" Server Side Rendering
01:33
5
Creating our First Nuxt App
05:08
6
Understanding the Folder Structure
05:39
7
What can we Build with Nuxt?
02:34
8
What's Inside This Course?
02:07
9
How To Get The Most Out Of This Course
01:58
10
Module Introduction
00:56
11
From Folders to Routes
06:33
12
Creating a Route with a Dynamic Path
05:25
13
Adding Links & Navigating Around
06:22
14
Validating Parameters
05:58
15
Creating Nested Routes
03:12
16
Layouts, Pages & Components - Theory
01:31
17
Adding a New Layout
03:53
18
Adding a Default Error Page
01:24
19
Working with "Normal" Components
07:52
20
Styling Nuxt Apps
05:36
21
Wrap Up
01:04
22
Module Introduction
01:14
23
Creating the Main "Sections" (Pages)
07:59
24
Adding External Fonts
03:50
25
Creating the Landing Page
05:51
26
Splitting the Page into Components
08:29
27
Adding Static Assets - The Background Image
02:34
28
Adding the Header Component
05:55
29
Vue Router vs. Nuxt Router
01:30
30
Working on the Post Page
04:34
31
Creating an Admin Section
12:37
32
Preparing the Backend
10:21
33
Improving the App
02:38
34
Adding a Separate Layout to the Admin Area
02:51
35
Module Introduction
01:01
36
Adding Dynamic Data
05:53
37
Preparing Data on the Server-Side (through Nuxt)
09:09
38
asyncData on Client & Server
03:18
39
A Closer Look at the Context Object
02:46
40
Adding Async Data to a Single Post
05:32
41
Handling Errors with a Callback
01:56
42
Using Promises in asyncData
03:18
43
Adding the Vuex Store
08:00
44
Vuex, fetch() and nuxtServerInit()
09:27
45
Wrap Up
03:13
46
Module Introduction
00:46
47
Executing Code on the Server
03:37
48
Adding Firebase as a Backend
02:07
49
Using Firebase to Store Data
04:56
50
Fetching Data from the Backend
04:18
51
Initializing our Store
02:55
52
Fetching all Posts
05:10
53
Editing Posts
04:33
54
Synchronizing Vuex and the Backend
10:38
55
Wrap Up
02:00
56
Module Introduction
00:58
57
The Nuxt Config File
06:29
58
The Loading Property
03:29
59
Working with Environment Variables
05:39
60
Manipulating Routing Settings
04:35
61
Animating Page Transitions
03:18
62
Adding Plugins
05:17
63
Registering a Date Filter
02:11
64
Understanding Modules
08:09
65
Wrap Up
00:47
66
Module Introduction
00:45
67
What is Middleware?
06:47
68
Adding User Signup
06:50
69
Adding User Login
02:54
70
Storing the Token
06:00
71
Using the Token for Authentication
03:22
72
Implementing a Middleware
04:11
73
Invalidating the Token
02:53
74
Persisting the Token Across Page Refreshes
09:54
75
Implementing Cookies
09:34
76
Fixing the Logout Timer
06:20
77
Adding the Logout Functionality
05:04
78
A Quick Bugfix
00:49
79
Module Introduction
01:14
80
Adding Server Side Middleware
06:19
81
Testing the Middleware
02:12
82
Starting a Project with a Server Side Template
03:10
83
Module Introduction
00:32
84
Universal vs SPA vs Static
03:02
85
Building our App as a Universal App
02:03
86
Building our App as a SPA
05:45
87
Building our App as a Static Website
03:22
88
Improving the Generate Process
04:44
89
Limiting the Amount of http Requests
03:05
90
Adjusting the Store
02:34
91
Course Roundup
00:57
Unlock unlimited learning

Get instant access to all 90 lessons in this course, plus thousands of other premium courses. One subscription, unlimited knowledge.

Learn more about subscription