Shadcn Component Library Course for Beginners // TRAIN BRAIN

Shadcn Component Library Course for Beginners

Shadcn is a unique collection of reusable React components designed for modern web development. In this course, you'll learn how to integrate beautifully designed, accessible, and customizable UI elements into your Next.js projects.
Course created by @codeddesign
⭐️ Contents ⭐️
⌨️ (0:00:00) Installation & Project Setup
⌨️ (0:03:35) Accordion
⌨️ (0:11:16) Alert
⌨️ (0:25:51) Alert Dialog
⌨️ (0:39:15) Image Ratio
⌨️ (0:57:27) Avatar
⌨️ (1:01:21) Badge
⌨️ (1:12:05) Breadcrumb
⌨️ (1:28:18) Button
⌨️ (1:31:50) Calendar
⌨️ (1:56:32) Card
⌨️ (2:07:05) Carousel / Image Slider
⌨️ (2:37:36) Check Box
⌨️ (2:46:25) Collapsible
? Thanks to our Champion and Sponsor supporters:
? davthecoder
? jedi-or-sith
? 南宮千影
? Agustín Kussrow
? Nattira Maneerat
? Heather Wcislo
? Serhiy Kalinets
? Justin Hual
? Otis Morgan
? Oscar Rahnama
--
Learn to code for free and get a developer job: https://www.freecodecamp.org
Read hundreds of articles on programming: https://freecodecamp.org/news

freeCodeCamp.org

Learn to code for free....

Generative AI for Developers – Comprehensive Course

freeCodeCamp Turns 10 & Major Certification Updates

Email SaaS Course – Build and Deploy with Next JS 14, Prisma, OpenAI, Stripe, TypeScript, Tailwind

Google Cloud Digital Leader Certification Course 2024 - Pass the Exam!

Learn Claude AI – Build Text Summarizers, Image Describers, and More with the Anthropic API

From Failing Programming Class to Senior Software Engineer with Tadas Petra [Podcast #147]

JavaScript GameDev – Code a Sonic Runner Using Kaplay Library

Build a Full Stack Book Store App Using React, Node, MongoDB

Open Source Superstar and Roadmap.sh Founder Kamran Ahmed [Podcast #145]

Is AI coming for developer jobs? – YK Sugi

Databases In-Depth – Complete Course

Electron Course - Code Desktop Applications (inc. React and Typescript)

How to Become a Street Smart Developer – From Dropout to Selling his Company w/ Dennis Ivy [#144]

Front End Portfolio Website Tutorial – Next.js, Three.js, Tailwind CSS

ASP.NET Core MVC Course for Beginners (.NET 9)

Kaggle Data Science Competition Course – Solve Three Challenges Step-by-Step

The reality of the developer job market with ex-Googler YK Sugi [Podcast #143]

Microsoft 365 Certified Fundamentals (MS-900) Certification Course – Prepare For and Pass the Exam

End-to-End Machine Learning Project – AI, MLOps

From PhD drop-out to Google Data Scientist with Meg Risdal [Podcast #142]

FARM Stack Course – Full Stack Development with FastAPI, React MongoDB

Securing API Servers Course

What Eddie Jaoude learned from doing DevRel for dozens of startups [Podcast #141]

Productivity as a Developer – Full Course

Music Production for Beginners – FL Studio Course [2024]

Surviving 40 years in the software industry [Interview with Jack Herrington Podcast #140]

MERN Stack Tutorial with Deployment – Beginner's Course

Multimodal Data Analysis with LLMs and Python – Tutorial

Spotify Developer Emma Bostian Talks Coding, Hiring Devs, and European Work Culture [Podcast #139]

Excel Data Visualization Course – Guide to Charts & Dashboards

Java Testing with Selenium Course

Special Ed Teacher turned Sysadmin and AWS Hero Hiroko Nishimura [Podcast #140]

React Native MacOS App Tutorial – Book Management System

Gemini AI MultiModal Model Course

Rahul Pandey quit his $800,000/year FAANG developer job to build a startup [Podcast #139]

Machine Learning in JavaScript with ml5.js

Operating Systems Course for Beginners

Data Science and Sports Analytics Expert Ken Jee [Podcast #135]

RAG Fundamentals and Advanced Techniques – Full Course

MongoDB Provider for EF Core – C# Tutorial

How John Washam crammed for 8 months, got a job at Amazon, then taught 1,000s of other devs [#134]

System Design Concepts Course and Interview Prep

Fullstack Drag & Drop Notes App with JavaScript

How to get Machine Learning Skills without doing a PhD in Math [Podcast #133 with Daniel Bourke]

Blazor Fundamentals Tutorial – Learn Blazor Step-by-Step

GitHub Advanced Security Certification – Pass the Exam!

24 CSS Projects: Loading Animations, Progress Bars, Flashcards & More!

Multithreading for Beginners

From Data Entry Drudgery to Software Engineer with Jessica Chan AKA Coder Coder [Podcast #132]

Asynchronous JavaScript Course – Async/Await , Promises, Callbacks, Fetch API

How to Deploy a Web App – Step-by-Step Tutorial

Learn TypeScript - Full Course for Beginners

Cafe Menu in HTML & CSS

Waving Penguin in HTML and CSS

What Scott Hanselman learned from doing 900 podcast interviews with devs [Podcast #131]

Spread Operator in JavaScript

Convert Strings to Numbers in JavaScript

API integration Course – Modern Python with FastAPI

Type Checking in Python

React Native & Expo Router Course – Build a Meditation App

Opacity in CSS

Go for Absolute Beginners – Tutorial

Use picture Element for Responsive Images in HTML

Is that him?

JavaScript Tutorial: Convert to Uppercase and Lowercase

From Fashion to Software Engineer with Alison Yoon [Podcast #130]

Python List Comprehensions in Seconds

GameDev with JavaScript and Kaboom.js – Metroidvania Game Tutorial

CSS Tutorial – Margin vs Padding

Shadcn Component Library Course for Beginners

Lambda Functions in Python

What’s New in React 19: Exploring Actions, use(), Compiler, and more

Secrets of freeCodeCamp

VIM Essentials Course for Beginners

Remove Whitespace in JavaScript

Easy Python String Formatting with f-strings

Why are senior developers learning low-code and AI tools? [Adrian Twarog Interview #129]

Godot GameDev Tutorial – 3D RPG Game

Learn Mistral AI – JavaScript Tutorial

Non-Technical Intro to Generative AI