The Nuxt 3 Bootcamp The Complete Developer Guide

Name: The Nuxt 3 Bootcamp The Complete Developer Guide
Price: 12.75 USD
Availability: InStock

16h 52m 7s

English

Paid

October 30, 2024

This is the most comprehensive Nuxt 3 course on the market. You will learn many of Nuxt's incredible features while building six real-world projects. With each new project, we will delve into more and more advanced Nuxt 3 concepts. By the end of the course, you can proudly label yourself as a Nuxt expert!

Course Introduction

In the introduction, you will learn precisely what Nuxt is and the problems it solves. You will explore client-side rendering and compare it with universal rendering.

Project 1: Vue 3 Refresher

In the first project, we will refresh your Vue 3 knowledge by building an app with the composition API. We will also cover TypeScript and how Nuxt handles components.

Project 2: Exploring Nuxt Ecosystem

In the second project, we will dive deeper into the Nuxt ecosystem. You'll learn about file-based routing, layouts, and defining page metadata.

Project 3: State Management with Composables

In the third project, we will explore global state management using composables.

Project 4: Handling HTTP Requests

In project number four, you will learn how to make HTTP requests using useFetch and useAsyncData.

Project 5: Building a REST API

In the fifth project, we will harness Nuxt's capabilities to build our very own REST API and utilize it on the client side.

Project 6: Integrating with Supabase

Lastly, in the sixth project, we will integrate our app with Supabase to leverage its authentication and SQL database services.

About the Author: udemy

Udemy is a global online marketplace for teaching and learning. It connects students with instructors who share skills in many fields.

Who Uses Udemy

Millions of learners use Udemy to gain skills for work and personal growth. Companies, governments, and nonprofits also use Udemy to train their teams.

What Udemy Offers

Udemy provides a curated set of business and technical courses. These courses help teams build practical skills and support ongoing learning at work.

Watch Online 155 lessons

0:00

#1: What We Will Be Building

All Course Lessons (155)

#	Lesson Title	Duration
1	What We Will Be Building Demo	01:24
2	Your Two Options	02:16
3	Creating a Nuxt App	04:07
4	Adding Tailwind CSS	04:42
5	Building the NavBar	03:55
6	Building the Home Hero	06:49
7	Building the Search Bar	04:36
8	Building the Side Bar	10:29
9	Building the Car Card	04:59
10	Building the Car Details Page	11:58
11	Intro to File Based Routing	07:00
12	Auto Importing Components	07:01
13	Dynamic and Optional Paths	07:16
14	Filling the Page With Components	03:17
15	Unique Dynamic Paths	05:45
16	The NuxtLink Component	02:17
17	Adding Programmatic Navigation	05:16
18	Implementing Nested Pages	05:25
19	Change Titles With useHead	07:13
20	Defining a Default Layout	06:17
21	Defining a Custom Layout	05:22
22	Storing Common Functionality in Composables	02:44
23	Adding a Page Not Found Page	05:34
24	The useError Composable	01:52
25	Dynamically Rendering the Car Cards	05:56
26	Dynamically Rendering the Car Details Page	06:51
27	Throwing a Custom Server Error	03:48
28	How Nuxt Renders Content	12:00
29	Updating the Location	07:06
30	Throwing a Client Side Error	03:12
31	NuxtErrorBoundary to Handle Client Side Errors	05:53
32	Optimizing Images with NuxtImg	04:50
33	The useState Composable	06:24
34	Adding the Vueuse Module	10:14
35	Forcing Client Side Rendering	04:09
36	Adding the Car Make Filter	09:31
37	Adding the Car Price Filter	16:11
38	Our New Feature	03:32
39	[OPTIONAL] - Assembling the Pages	47:09
40	Creating a Supabase Account	02:49
41	Connecting Supabase to Our Nuxt App	04:00
42	Enabling Google Authentication	04:22
43	Implementing Google OAuth	08:10
44	Conditionally Rendering UI Based on Auth Status	03:27
45	Implementing the Logout Functionality	06:20
46	Protecting Routes With Inline Route Middleware	08:23
47	Named Middleware For DRY Code	02:47
48	Global Middleware for DRYER Code	03:17
49	Intro to Server Endpoints	01:46
50	Creating a Server Endpoint	03:12
51	Extracting the Path Parameters	04:00
52	Extracting the Query Parameters	04:03
53	Fetching the Data From the Client	09:22
54	A Hacky Way of Refetching Data	03:12
55	Adding a Not Found Message for Better UI	02:00
56	Adding the Fetch Car Endpoint	07:18
57	Another Fetch Composable	03:47
58	Fixing an Issue With Error Handling	01:46
59	A Small SQL Crash Course	06:00
60	Installing an ORM	05:07
61	Programmatically Creating Our Tables	08:29
62	A Perfect Endpoint	22:03
63	HTTP Verbs	03:12
64	Fetching Data From the Database	05:13
65	Deleting Data From the Database	02:49
66	Adding the Other Two Endpoints	11:36
67	Complex Filters	08:11
68	Our Last Endpoint	01:27
69	Making a POST Request From the Client	15:52
70	Making a GET Request From the Client	01:27
71	Making a DELETE Request From the Client	08:21
72	Fixing the GET Endpoints	04:39
73	A POST Message Endpoint	09:16
74	A GET Message Endpoint	03:08
75	Storing Images in a Bucket	08:36
76	Retrieving the Image URL	05:39
77	Please Watch This	02:04
78	Introduction to Nuxt and it's Benefits	04:32
79	Client-Side vs Server-Side vs Universal Rendering	04:35
80	Pros and Cons of Client-Side and Universal Rendering	04:31
81	Course Prerequisite	03:08
82	App Overview	02:53
83	Creating a Nuxt App	03:17
84	Exploring the Boilerplate	04:36
85	Building the Boilerplate HTML	04:49
86	Styling Our App	09:18
87	Managing State	07:47
88	A Little Bit of TypeScript	13:02
89	Updating Our State After a Click Event	02:50
90	Adding the Names Array	07:53
91	Computing Names Based on Options	06:21
92	Creating the Name Cards	06:14
93	Working with Components	10:04
94	Passing Props to the Components	10:13
95	Computing the Class Names	07:34
96	Dealing with Nested Components	06:15
97	Emitting Events to the Parent Component	06:18
98	App Overview	04:43
99	Adding Bootstrap Globally	06:52
100	Creating the Landing Page	06:37
101	Adding Pages into Our App	06:15
102	Building the Restaurant Page	09:27
103	Adding the Restaurant Page Logic	11:00
104	Dynamic and Nest Routes	07:23
105	Extracting Path Parameters	08:56
106	Catching the Not Found Error	02:20
107	Defining the Default Layout	03:41
108	Creating a Custom Page Layout	08:30
109	Injecting Custom Elements to Layout Page	10:32
110	Option 1: Using Components	06:43
111	Option 2: Using Composables	03:24
112	App Overview	02:25
113	Approaches to State Management	06:54
114	Creating Our First Composable	06:09
115	Using the Compasable State	06:40
116	Mutating Our Global State	03:17
117	App Overview	04:37
118	Integrating Tailwind	08:11
119	Writing the HTML Structure	11:20
120	The Basics of HTTP Requests	04:07
121	The useFetch Composable	08:45
122	Refetching Data with useFetch	05:45
123	The useAsyncData Composable	08:10
124	Refetching Data with useAsyncData	02:13
125	Storing Data in the Browser with Cookies	02:19
126	The useCookie Composable	04:58
127	Storing Runtime Configs	08:21
128	Error Handling	06:52
129	App Overview	03:09
130	Our Endpoints	02:17
131	Creating Our Server	07:01
132	GET Requests	05:51
133	POST Requests and Body	07:07
134	PUT & DELETE with Dynamic Endpoints	15:44
135	Error Handling	06:39
136	Building the HTML	08:20
137	Making POST, PUT, DELETE Requests From the Frontend	08:54
138	Organizing Code in Composable	07:16
139	App Overview	03:26
140	Building the Authentication Card	12:42
141	Conditionally Displaying Signup or Signin Form	05:54
142	Creating a Supabase Account and Project	04:53
143	Connect Nuxt to Supabase	05:41
144	Implementing Signup Logic	12:24
145	Implementing Signin/Login Logic	05:50
146	Implementing Signout/Logout Logic	05:31
147	Handling Authentication Errors	04:15
148	Redirecting to Profile Page	07:25
149	Creating the Nav Component	09:28
150	Conditionally Render UI Elements Based on Auth Status	02:40
151	Protecting Routes with Middleware	09:57
152	Creating the Note Form	10:43
153	The Basics of SQL	09:48
154	Saving Data to the Database	05:59
155	Accessing Data From the Database	08:07

Unlock unlimited learning

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

Learn more about subscription