English | MP4 | AVC 1920×1080 | AAC 44KHz 2ch | 147 lectures (13h 38m) | 2.14 GB
Build GeniusGPT Full-Stack App with Next.js 14+, OpenAI , Clerk Auth, Prisma, Tailwind, Shadcn-ui DaisyUI, Typescript
Embark on a journey to mastering modern web development with our comprehensive video course on building applications using Next JS 14 and the OpenAI API. This course is meticulously designed for beginners and intermediate developers who are keen to elevate their skills. You’ll start from the ground up by learning how to create a new Next.js app, understand its files and folders structure, and explore the intricacies of routing including link components, nested routes, and dynamic routes.
Immerse yourself in front-end design with TailwindCSS and DaisyUI, and learn to craft responsive layouts, manage themes, and create a unified look for your entire app with layout components. Dive into the backend mechanics with server vs client components, fetching data in server components, handling loading and errors gracefully, and implementing nested layouts
Discover how to enhance your app’s functionality with CRUD operations using Server Actions, manage user interactions, and validate data using the Zod library. You’ll also learn to integrate a database by hosting with Planetscale and add essential features like authentication with CLERK Service.
By the end of this course, you’ll be adept at deploying your NextJS application on Vercel, setting up and toggling themes with DaisyUI, and enriching your app with powerful APIs from OpenAI and Unsplash. Learn how to send prompts, receive responses, and even generate images within your application.
With a hands-on approach, tackle numerous challenges throughout the course to immediately apply your newfound knowledge. This is not just a tutorial; it’s a transformative learning experience that will arm you with the tools and confidence to build cutting-edge web applications.
What you’ll learn
- Build modern Next JS applications
- Authenticate your Next JS applications with Clerk
- Store data in database with Prisma and PlanetScale
- Use OpenAI API in your Next JS Applications
Table of Contents
1 Introduction to Next.js
2 Tutorial Overview
3 Create New Next.js App
4 Files and Folder Structure
5 Home Page
6 More Pages
7 Link Component
8 Nested Routes
9 First Challenge
10 CSS
11 TailwindCSS
12 DaisyUI
13 Layout File
14 Navbar Challenge
15 Server Component VS Client Component
16 Counter Challenge
17 Fetch Data
18 Loading Component
19 Error Component
20 Nested Layouts
21 Dynamic Routes
22 Drinks List – Challenge
23 Single Drink – Challenge
24 Static Images
25 Remote Images
26 Responsive Images
27 More Routing
28 Prisma Setup
29 Prisma Model
30 Prisma CRUD
31 Display Tasks – Challenge
32 Server Actions – Info
33 First Server Action
34 Refactor App
35 Delete Task
36 Edit Task – Setup
37 Edit Task – Complete
38 Pending State
39 Error Checking
40 Zod Library
41 Providers
42 Delete Button – Challenge
43 Route Handlers – Info
44 Route Handlers – GET
45 Route Handlers – POST
46 Middleware
47 Render (optional)
48 PlanetScale
49 Local Build
50 Force Dynamic
51 Deploy
52 Intro
53 New App
54 Libraries
55 First Pages
56 Home Page
57 Clerk Setup
58 Custom Auth Pages
59 React Icons
60 Dashboard Layout
61 Sidebar
62 Sidebar Header
63 Nav Links
64 Member Profile
65 Theme Toggle
66 Boilerplate Overview
67 User Profile
68 React Hot Toast Library
69 Chat Structure
70 React Query – Info
71 React Query – Setup
72 OpenAI – Pricing
73 OpenAI – Playground
74 OpenAI – Docs
75 First Prompt
76 Context
77 Display Messages
78 New Tour – Setup
79 New Tour – Form
80 New Tour – React Query
81 Tour Prompt
82 Generate Tour Response
83 Tour Info
84 PlanetScale
85 Tour Model
86 Save Tour
87 Timeout Info
88 GetAllTours Function
89 Tours Page – Setup
90 Tours List
91 Search Functionality
92 Single Tour Page
93 Generate Image
94 Unsplash API
95 Custom Pages – Bug/Fix
96 Tokens – Intro
97 Max Tokens
98 Token Actions
99 Display Tokens
100 Tours Logic
101 Chat Logic
102 Deploy
103 Intro
104 Setup
105 Shadcn-ui
106 Shadcn-ui API
107 Layout and Homepage
108 Create Pages
109 Clerk Auth
110 Nav Links
111 Dashboard Layout
112 Sidebar
113 Navbar
114 Dropdown Links
115 Change Theme
116 Toggle Theme
117 Shadcn-ui Forms
118 Types
119 Custom Form Components
120 CreateJobForm Continued
121 Render and Prisma
122 CreateJobAction
123 Toast Component
124 React Query – Setup
125 CreateJobForm – Complete
126 GetAllJobsAction – Overview
127 GetAllJobsAction
128 Jobs Page – Setup
129 SearchForm Component – Setup
130 SearchForm Component – Functionality
131 JobsList Component
132 Additional Shadcn-UI Components
133 JobCard Component
134 JobInfo Component
135 Delete Job
136 Single Job Page
137 EditJobForm Component
138 Seed Database
139 Stats Action
140 Charts Actions
141 Stats Container
142 Loading Skeleton
143 Charts Container
144 Button Component
145 Complex Button Component
Resolve the captcha to access the links!