YoVDO

Building an Admin Dashboard with Next.js, TypeScript, and Shadcn/ui

Offered By: Traversy Media via YouTube

Tags

Next.js Courses Web Development Courses React Courses Typescript Courses Zod Courses

Course Description

Overview

Save Big on Coursera Plus. 7,000+ courses at $160 off. Limited Time Only!
Build a comprehensive admin dashboard from scratch using Next.js, TypeScript, and Shadcn/ui in this extensive tutorial video. Learn to create dynamic components, implement data visualization with Recharts, handle form submissions using React Hook Form and Zod, and integrate essential features like pagination, dark mode, and authentication. Follow along to construct a fully functional interface incorporating React, Tailwind CSS, and Lucide React, while gaining hands-on experience with modern web development practices and tools.

Syllabus

- Intro
- Project Setup
- Initialize Shadcn/ui
- Using Shadcn Components
- Navbar, Avatar, Dropdown Components
- Sidebar & Command Component
- Dashboard Cards
- Make The Cards Dynamic
- Posts Data Array & Types
- Posts Table
- Limit & Sort Posts
- Analytics Data & Types
- Analytics Chart & Recharts
- Posts Page
- Back Button Component
- Pagination Component
- Edit Post Page & Form
- Zod Form Schema
- Get Post Data
- useForm Hook
- Create Form
- Toast Component
- Dark Mode Toggler
- Auth Page & Layout
- Tabs Component
- Login Form
- Register Form
- Auth Page Theme Toggler


Taught by

Traversy Media

Related Courses

Learn Zod in 30 Minutes
Web Dev Simplified via YouTube
Full Stack Tutorial - NextJS, TRPC, T3, TypeScript, Prisma, Tailwind, Zod
Coding Tech via YouTube
Nuxt 3 & Nitro
Learn With Jason via YouTube
Keep Alive Your TypeScript Definitions Using Zod
JSWORLD Conference via YouTube
Build a Sanity CMS Powered SvelteKit Blog
egghead.io