Click for Table of Contents
Solutions to exercises from 30 Days of React by Asabeneh that require CRA (create-react-app)
| Day | Scope |
|---|---|
| Day 3 | Setting Up |
| Day 4 | Components |
| Day 5 | Props |
| Day 6 | Map List Keys |
| Day 7 | Class Components |
| Day 8 | States |
| Day 9 | Conditional Rendering |
| Day 10 | React Folder Structure |
| Day 11 | Events |
| Day 12 | Forms |
| Day 13 | Uncontrolled Components |
| Day 14 | Component Life Cycle |
| Day 15 | Third Party Packages |
| Day 16 | Higher Order Component |
| Day 17 | React Router |
| Day 18 | Fetch and Axios |
| Day 19-20 | Projects |
| Day 21 | React Hooks |
Located in 30 Days of React Solutions Branch
| Day | Scope |
|---|---|
| Day 01 | Javascript Refresher |
| Day 02 | Introduction to React |
| Day 03 | Setting Up > Level1 (Q&A) |
| Day 04 | Components > Level1 (Q&A) |
- dayDDlevLL... - With missing Level Exercises
- DD - day of 30 Days of React
- LL - exercise level (if shown more than once, then sub directory contains answers to more than one level)
- dayDD - Complete Exercises included
Each sub directory contains a single page application (SPA). To view desired exercise solution:
npm run sub-directory-name| Package | Installation | Website | Github |
|---|---|---|---|
| axios | npm i axios |
axios-http.com | axios |
| react-icons | npm i react-icons |
react-icons.github.io | react-icons |
| react-query | npm i @tanstack/react-query |
tanstack.com | tanstack/query |
| react-query-devtools | npm i @tanstack/react-query-devtools |
tanstack.com | tanstack/query |
| react-router-dom | npm i react-router-dom |
reactrouter.com | remix-run/react-router |
| Package | Installation | Website | Github |
|---|---|---|---|
| classnames | npm i classnames |
none | JedWatson/classnames |
| styled-components | npm i styled-components |
styled-components.com | styled-components |
| validator | npm i validator |
none | validatorjs |
Data based on VSCode Extension: Import Cost | Github | VSCode Marketplace
Anything not listed have library dependent import cost
- NOTE: Import cost may change over time due to updates or patches
| Package | Import Cost (k) |
|---|---|
| axios | 49.0 |
| classNames | 1.2 |
| styled-components | 33.0 |