Nuxt 3 Fundamentals: Build Full-Stack Vue.js Apps

3h 5m 56s
English
Paid

Nuxt 3 is a powerful meta-framework built on top of Vue.js, offering a robust solution for creating server-rendered applications. The latest version, Nuxt 3, introduces a plethora of new features that benefit both end users and developers alike. Dive into this course to unlock the full potential of Nuxt 3 and enhance your development skills.

What You Will Learn

This course provides a comprehensive understanding of Nuxt 3 and its capabilities. Here's a glimpse of what you'll learn:

  • How to create a new Nuxt 3 project from scratch, covering every essential step.
  • Efficiently create routes with file-based routing to streamline your development process.
  • Master the art of working with async data to build responsive applications.
  • Additional advanced features and techniques to enhance your Nuxt 3 projects.

Key Features and Tools

One of the standout features of Nuxt 3 is its seamless integration with TypeScript, providing excellent auto-complete options within your IDE, thereby enhancing productivity and reducing errors. Get hands-on experience in leveraging these tools to write cleaner and more maintainable code.

About the Author: vueschool.io

vueschool.io thumbnail
Learning about new web technologies and staying-up-to-date is an ongoing process. That’s why we offer affordable subscription plans for individuals and teams.

Watch Online 33 lessons

This is a demo lesson (10:00 remaining)

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

View Pricing
0:00
/
#1: What is Nuxt.
All Course Lessons (33)
#Lesson TitleDurationAccess
1
What is Nuxt. Demo
07:18
2
Create a Nuxt App from Scratch
06:40
3
File Based Routing in Nuxt.js
05:09
4
NuxtLink for Navigation
04:17
5
Dynamic Route Params in Nuxt.js
05:28
6
Fetch Data with $fetch
09:22
7
Provide a Single Root Element for Page Components
02:31
8
Create Components that Auto Import
03:26
9
Fetch data with useAsyncData
03:42
10
De-dupe Async Data with a Key
03:11
11
Configure useAsyncData with Options
03:59
12
Call useFetch for a $fetch + useAsyncData Shorthand
02:16
13
Handle useFetch Errors
06:39
14
Call the useHead Composable for Good SEO
07:19
15
Create Flexible Custom Layouts
05:29
16
Define Nuxt Route Middleware
06:22
17
Abort Navigation or Redirect In Nuxt Middleware
06:00
18
Nuxt Server API Routes
04:54
19
Handle Different Nuxt API Request Methods
08:16
20
Global State Management with useState
10:37
21
Global State Management with Pinia
11:30
22
Overview of Nuxt Deployment Options
03:09
23
Deploy a Nuxt Site to Netlify
07:16
24
Hybrid Rendering with Nuxt
10:42
25
Course Conclusion
02:38
26
Intro to Nuxt Image
03:55
27
Installing Nuxt Image
01:56
28
The NuxtImage Component
05:45
29
Controlling When Images Load
03:00
30
Responsive Images
08:13
31
Image Modifiers
05:18
32
The NuxtPicture Component
04:43
33
Responsive Art Direction Hack
04:56
Unlock unlimited learning

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

Learn more about subscription