React Hero: Setup React + TypeScript application with a design system — Material UI
Welcome back to my React Hero series. Today we will continue to add a system design — Material UI to our React + TypeScript application that we’ve done previously.
The React Hero series will be covering the following topics:
- Setup a new React application with Vite + TypeScript
- Setup React application with a design system — Material UI
- Setup Jest + React Testing Library
- Setup ESlint + Prettier in React
- React Router
- React Form Handling + Validation
- Setup Redux Tool Kits & RTK Query
- Build + Deploy your React application to your own server
- Setup CI/CD pipeline for React app using GitlabCI
- And more…
Okay, let’s tackle the 2nd one today!
Why do we need a design system?
I’ve been working with a design system for the last 3 web applications and I figured out that there’re a lot of benefits when using a design system.
The primary benefit of design systems is their ability to replicate designs quickly by utilizing premade UI components and…