Code along as I take a Dribbble dashboard design and code it using Chakra UI and Next.js! Along with Chakra UI, we use the react hook useState to make the content a bit more dynamic. This dashboard is fully responsive and follows best practices! This design uses the default Chakra UI theme but if you have a custom theme, you can modify it accordingly.

Helpful Links:
Code: https://github.com/bjcarlson42/chakra-nextjs-dashboard
Demo: https://chakra-nextjs-dashboard.vercel.app/dashboard
Chakra Docs: https://chakra-ui.com/
Chart.js Docs: https://www.chartjs.org/docs/latest/
React chart 2 docs: http://reactchartjs.github.io/react-chartjs-2/#/
Feather React Icons: https://react-icons.github.io/react-icons/icons?name=fi
Dribbble Design: https://dribbble.com/shots/15640240/attachments/7432009?mode=media

 

#Chakra #next 

Simple Building Dribbble Dashboard using Chakra UI and Next.js
1.85 GEEK