Design vs Dev Challenge #2 - Afrosonic Dashboard Concept

Welcome to the second Design vs Dev Challenge video! Since a lot of you loved the previous challenge, I decided to make this one a bit more complex and fun!

For the second challenge we're going to rebuild Jide Pinheiro's Afrosonic Dashboard Concept using React, Chakra UI, Next JS and React Table! You can check out the original Dribbble shot below 👇

Resources:
Dribbble shot: Afrosonic Concept Dashboard by Jide Pinheiro dribbble.com/shots/15491838-Afrosonic-Concept-Dash…
GitHub Repo Link: github.com/chakra-ui/design-vs-dev/tree/main/chall…

Check out Chakra UI's docsite at chakra-ui.com/
Feel free to join our community at Discord discord.gg/chakra-ui

Thanks for watching! 🙏

Chapters:
0:00 - Intro
0:19 - Dribbble Shot
0:39 - Design Breakdown
0:31 - Project Initialization & Cleanup
2:02 - Chakra UI Installation
2:37 - TypeScript Path Aliases
2:57 - Initial Layout
3:44 - Theme Customization
4:20 - Sidebar Component
7:21 - Search Bar Component
8:44 - Genres Carousel Component
10:27 - Top Picks Component
14:00 - Top Producers Component
15:45 - Player Component
19:48 - The E