- ThemeProvider will change the default Material UI looks. CSSBaseline
  in ThemeProvider will reset and normalize the browser's styling,
  making sure our app looks the same in any browser.
- ThemeProvider will be used as the parent of any styled components.

2023-07-21 18:11:24 -04:00

953 B

Raw Blame History

Neo Todo App Frontend

Dev Log

Styling the frontend

Used the MUI React component library using Material Design by Google.
Font used is Roboto. Font is imported to src/App.tsx.

Use ThemeProvider

To override the default MUI looks, we create a ThemeProvider at src/ThemeProvider.tsx.

React Hook useMemo

useMemo is a React Hook that lets you cache the result of a calculation between re-renders. Made for running expensive synchronous operations less often.

MUI (Material UI)

Palette Mode

Change default component colors to suit one's needs.

CSSBaseline

Reset the CSS injected into <head>. A collection of HTML element and attribute style-normalizations, you can expect all of the elements to look the same across all browsers.

useMediaQuery

This React hook listens for matches to a CSS media query. It allows the rendering of components based on whether the query matches or not.

953 B Raw Blame History