Next.js Projects: Build an Issue Tracker

Name: Next.js Projects: Build an Issue Tracker
Price: 9 USD
Availability: InStock

7h 1m 57s

English

Paid

June 6, 2024

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.

Watch Online Next.js Projects: Build an Issue Tracker

Join premium to watch

Go to premium

#	Title	Duration
1	1- Welcome	02:06
2	2- Prerequisites	00:51
3	3- Source Code	00:39
4	4- How to Take This Course	00:59
5	1- Project Roadmap	02:17
6	2- Setting Up the Development Environment	01:18
7	3- Creating the Project	02:53
8	4- Building the navbar	08:53
9	5- Styling the Active Link	06:19
10	1- Setting Up MySQL	01:59
11	2- Setting Up Prisma	01:47
12	3- Creating the Issue Model	06:41
13	4- Building an API	06:56
14	5- Setting Up Radix UI	02:34
15	6- Building the New Issue Page	04:58
16	7- Customizing Radix UI Theme	04:54
17	8- Adding a Markdown Editor	01:57
18	9- Handling Form Submission	08:44
19	10- Handling Errors	06:50
20	11- Implementing Client-side Validation	06:15
21	12- Extracting the ErrorMessage Component	03:23
22	13- Adding a Spinner	04:22
23	14- Discussion- Code Organization	03:59
24	1- Showing the Issues	05:05
25	2- Building the Issue Status Badge	08:09
26	3- Adding Loading Skeletons	06:20
27	4- Showing Issue Details	06:47
28	5- Styling the Issue Detail Page	04:11
29	6- Adding Markdown Preview	03:35
30	7- Building a Styled Link Component	06:41
31	8- Additional Loading Skeletons	05:16
32	9- Disabling Server-side Rendering	02:59
33	10- Refactoring- Organizing Imports	05:28
34	1- Adding the Edit Button	04:44
35	2- Applying the Single Responsibility Principle	07:32
36	3- Building the Edit Issue Page	06:29
37	4- Building an API	06:45
38	5- Updating Issues	02:04
39	6- Understanding Caching	08:18
40	7- Improving the Loading Experience	06:59
41	1- Adding a Delete Button	07:03
42	2- Adding a Confirmation Dialog Box	04:05
43	3- Building an API	02:44
44	4- Deleting an Issue	02:12
45	5- Handling Errors	04:30
46	6- Improving the User Experience	02:22
47	7- Removing Duplicate Skeletons	04:03
48	1- Setting Up NextAuth	03:48
49	2- Configuring Google Provider	05:47
50	3- Adding the Prisma Adapter	05:29
51	4- Adding the Login and Logout Links	05:19
52	5- Change the Layout of the NavBar	04:31
53	6- Adding a Drop-down Menu	04:23
54	7- Troubleshooting- Avatar Not Loading	03:03
55	8- Refactoring the NavBar	08:08
56	9- Adding a Loading Skeleton	01:50
57	10- Securing the Application	07:46
58	1- Building the Assignee Select Component	02:58
59	2- Populating the Assignee Select Component	05:37
60	3- Setting Up React Query	04:21
61	4- Fetching Data with React Query	06:46
62	5- Add Assigned Issues to Prisma Schema	04:06
63	6- Implementing the API	10:59
64	7- Assigning an Issue to a User	04:39
65	8- Showing Toast Notifications	02:43
66	9- Refactoring the Assignee Select Component	05:17
67	1- Building the Filter Component	05:54
68	2- Filtering Issues	06:42
69	3- Making Columns Sortable	07:20
70	4- Sorting Issues	03:08
71	5- Fix Filtering Bugs	05:21
72	6- Generating Dummy Data	02:52
73	7- Building the Pagination Component	06:15
74	8- Implementing Pagination	04:04
75	9- PaginatingIssues	05:00
76	10- Refactoring- Extracting IssueTable Component	08:38
77	1- Building the LatestIssues Component	07:40
78	2- Building the IssueSummary Component	07:21
79	3- Building the BarChart Component	06:18
80	4- Laying Out the Dashboard	02:30
81	1- Adding Metadata	04:12
82	2- Optimizing Performance Using React Cache	04:22
83	3- Removing.env File	03:25
84	4- Setting Up Error Tracking	03:59
85	5- Setting Up the Production Database	02:34
86	6- Deploying to Vercel	10:31
87	1- Course Wrap Up	00:26