Shadcn UI & Next JS - Build beautiful dashboards with shadcn

Name: Shadcn UI & Next JS - Build beautiful dashboards with shadcn
Price: 9 USD
Availability: InStock

8h 12m 38s

English

Paid

July 23, 2024

Dive into the world of frontend development with this comprehensive Shadcn UI course, tailored for developers eager to craft state-of-the-art dashboards using Shadcn UI in Next.js. This course is your gateway to mastering the integration of form functionality, client-side validation, component customization, and dynamic chart creation - all key skills for any aspiring web developer. Note that this course focuses only on the front-end. We do not write any backend logic, database, or implement authentication in this course. All data in this course is hardcoded / dummy data. The sole focus of this course is building out beautiful front ends with Shadcn UI.

Watch Online Shadcn UI & Next JS - Build beautiful dashboards with shadcn

Join premium to watch

Go to premium

#	Title	Duration
1	Project overview	05:35
2	Udemy ratings and reviews	00:39
3	Set up new Next JS project and install shadcn ui	09:07
4	Add the landing page text and buttons	10:38
5	Tidying up the landing page styles and link to login and signup pages	17:32
6	Customise shadcn ui theme	11:01
7	Build the light and dark mode toggle	18:24
8	Add the login page and card	10:23
9	Create the login form	23:18
10	Add the sign up page and card	03:44
11	Add the account type select field	09:41
12	Add the company name and employees fields and validation	09:02
13	Add the date of birth validation	06:59
14	Add the date of birth field with Popover	11:17
15	Customize the Calendar	19:49
16	Render selected date + custom dropdowns for month / year selection	16:14
17	Add the dropdown captions and years values	13:54
18	Hook up month and year navigation anytime the custom dropdown values change	04:58
19	Add the password and confirm password fields	16:35
20	Create a custom PasswordInput component	12:04
21	Add the terms and conditions checkbox	14:16
22	BUG FIX: terms and conditions checkbox	02:42
23	Create the dashboard layout	07:18
24	Create the MenuTitle	07:07
25	Build out the side panel menu items	09:53
26	Add the sidebar footer with Avatar	12:10
27	Add the missing pages and refactor HTML tags	04:56
28	Add the employees stats and teams stats tabs	04:54
29	Add the data Cards	04:22
30	Start adding the Card content	09:34
31	Extend the shadcn ui Button component	03:37
32	Add the employees present card content	12:08
33	Add the employee of the month card content	08:42
34	Create the stacked bar chart with recharts	19:00
35	Finish the bar chart	18:15
36	Create the teams stats component	07:19
37	Add the team leaders card content	09:39
38	Add the team distribution pie chart	11:41
39	Add the support tickets resolved line graph	14:29
40	Mobile menu (part 1)	06:54
41	Mobile menu (part 2)	11:23
42	Mobile menu (part 3)	12:44
43	Mobile menu (part 4)	07:08
44	Create the loading skeleton for the employees table	09:51
45	Create the employees data table	13:48
46	Add pagination for the employees data table	08:42
47	Clean up the styling of the data table	09:12