Build a React Data Dashboard App | NextJS, TypeScript, MUI - 3.Data Dashboard Styling and Theming
In this video, we will explore various ways to style our components, including using MUI inline styles and Module CSS + SCSS. Build a light/dark mode toggle and finally use Storybook to develop our dashboard components in an isolated development environment.
By the end of this video, you will have a deeper understanding of how to style and theme your MUI React applications using different approaches and tools, and how to use Storybook to improve your development workflow. Join us on this journey to create a visually stunning and functional data dashboard app!
0:00 - Intro
3:21 - Styling reset
6:52 - MUI Theming
8:05 - Module CSS + SCSS
13:13 - Light/Dark Mode
30:22 - Responsiveness
32:17 - Dashboard Layout
36:30 - Storybook setup
41:58 - Outro
LINKS 🔗
► https://github.com/thehashton/cb-data...
► https://mui.com/material-ui/customiza...
💬 Join us on our discord here:
► / discord
Visit our website:
► https://www.curiousbyte.dev
FOLLOW ✅
► / thehashton
► / curious_byte
SUPPORT THE CHANNEL ❤️
► https://www.buymeacoffee.com/curiousbyte
#mui #modulecss #scss #dashboard #nextjs #frontend #webdev #developer #javascript #typescript #webdevelopment
