English | MP4 | AVC 1920×1080 | AAC 44KHz 2ch | 87 Lessons (7h 01m) | 1.27 GB
Learn to Build Full-stack Apps with Next.js, TypeScript, Prisma, Tailwind, and Radix UI
Clear. Concise. Comprehensive.
Tired of piecing together disconnected tutorials or dealing with rambling, confusing instructors? This course is for you! It’s perfectly structured into a series of bite-sized, easy-to-follow videos that cover both theory and practice.
What You’ll Learn
- Confidently build full-stack apps with Next.js 13+ and TypeScript
- Master a methodical approach to build software
- Build beautiful, modern UIs with Radix UI and Tailwind
- Implement routing and navigation using the new App router
- Build RESTful APIs
- Use Prisma to integrate your Next.js apps with a database
- Implement user authentication with NextAuth.js
- Optimize your apps for performance and SEO
- Learn VSCode shortcuts to increase your productivity
- Properly structure your Next.js projects
- Apply the latest techniques and best practices
- Troubleshoot errors with ease
- Deploy your Next.js apps
Table of Contents
1 Welcome
2 Prerequisites
3 Source Code
4 How to Take This Course
5 Project Roadmap
6 Setting Up the Development Environment
7 Creating the Project
8 Building the navbar
9 Styling the Active Link
10 Setting Up MySQL
11 Setting Up Prisma
12 Creating the Issue Model
13 Building an API
14 Setting Up Radix UI
15 Building the New Issue Page
16 Customizing Radix UI Theme
17 Adding a Markdown Editor
18 Handling Form Submission
19 Handling Errors
20 Implementing Client-side Validation
21 Extracting the ErrorMessage Component
22 Adding a Spinner
23 Discussion- Code Organization
24 Showing the Issues
25 Building the Issue Status Badge
26 Adding Loading Skeletons
27 Showing Issue Details
28 Styling the Issue Detail Page
29 Adding Markdown Preview
30 Building a Styled Link Component
31 Additional Loading Skeletons
32 Disabling Server-side Rendering
33 Refactoring- Organizing Imports
34 Adding the Edit Button
35 Applying the Single Responsibility Principle
36 Building the Edit Issue Page
37 Building an API
38 Updating Issues
39 Understanding Caching
40 Improving the Loading Experience
41 Adding a Delete Button
42 Adding a Confirmation Dialog Box
43 Building an API
44 Deleting an Issue
45 Handling Errors
46 Improving the User Experience
47 Removing Duplicate Skeletons
48 Setting Up NextAuth
49 Configuring Google Provider
50 Adding the Prisma Adapter
51 Adding the Login and Logout Links
52 Change the Layout of the NavBar
53 Adding a Drop-down Menu
54 Troubleshooting- Avatar Not Loading
55 Refactoring the NavBar
56 Adding a Loading Skeleton
57 Securing the Application
58 Building the Assignee Select Component
59 Populating the Assignee Select Component
60 Setting Up React Query
61 Fetching Data with React Query
62 Add Assigned Issues to Prisma Schema
63 Implementing the API
64 Assigning an Issue to a User
65 Showing Toast Notifications
66 Refactoring the Assignee Select Component
67 Building the Filter Component
68 Filtering Issues
69 Making Columns Sortable
70 Sorting Issues
71 Fix Filtering Bugs
72 Generating Dummy Data
73 Building the Pagination Component
74 Implementing Pagination
75 PaginatingIssues
76 Refactoring- Extracting IssueTable Component
77 Building the LatestIssues Component
78 Building the IssueSummary Component
79 Building the BarChart Component
80 Laying Out the Dashboard
81 Adding Metadata
82 Optimizing Performance Using React Cache
83 Removing.env File
84 Setting Up Error Tracking
85 Setting Up the Production Database
86 Deploying to Vercel
87 Course Wrap Up
Resolve the captcha to access the links!