Here is what we are going to build: https://rosealexander.github.io/react-mui-workshop/
This workshop is for the ACM California State University Northridge Student Chapter.
- https://csunacm.org
- https://www.acm.org
- https://www.csun.edu/engineering-computer-science/computer-science
To get the most out of this workshop you should be comfortable programming with Javascript.
You must have Node.js installed and make sure to
clone this repo.
git clone https://github.com/rosealexander/react-mui-workshop
You also need to grab a free API key from OpenWeather. Create an account and navigate to Api Keys and just use the default one listed here later in this tutorial.
Each part of this workshop is seperated into branches. You can follow along by checking out each of them with
git checkout [branch-name]
- Part 1 - React + MUI template
- Part 2 - useState and useContext hooks
- part 3 - fetch API and useEffect hook
- part 4 - MUI component library
For everything you need to know about Git, take a look at this Git Guide.
React is a JavaScript library for building user interfaces. You can find the React documentation here and check out the Getting Started page for a quick overview.
"MUI is a simple and customizable component library to build faster, beautiful, and more accessible React applications". MUI components follow the Material Design system.
- You can learn more about React from the React documentation and MUI v5 documentation.
- To learn more about Material Design take a look at material.io.
Use
git checkout part1to continue onto Part 1 - React + MUI template