This repository contains my learnings steps, as I venture into React.
Branches are named after the chapter they are for, and will contain the code for that chapter.
The main
branch will contain the full code, added linearly from all the branches.
While I do want to learn ReactQuery, ReactRouter, NextJS and TypeScript, I'm not going to be using them in this repository. I'll be solely using React, in correlation with Vite.
As the project's name suggests, the steps taken here will be the first towards learning several technologies, that work brilliantly together. I have varying experience, but I want to learn them properly.
My goal is to learn React, and to learn how to use it with Vite.
However, the following represents my full learning goal, that I'll pursue after completing this project:
The following represents the sections / steps, that I've taken through this project:
- How React Works
- How Components Work
- What Is JSX
- Reusability of Components
- What Are Props
- Destructuring Props
- Immutability Of Props
- Passing Arrays And Objects With Props
- Displaying Arrays Or Lists
- Array Of Objects
- Components In Loops
- Conditionally Rendering
- Conditionals Using Element Variables
- Event Handling
- Introduction To States
- State In React Code
- Multiple States
- Input Fields In React
- Multiple Inputs
- Form Submission
- Use Effect Hook
Hooks In React
Now hold on for a second before you judge me for doing a todo project.
I'm aware that that's a classic trope, but I think for learning important concepts for the first time, it's a good idea to do
a todo
project. (Pun intended)
If I decide to do another project (in this repository), seeing that main
is the latest version of the repository, you can find the code for the todo project in the projects branch.
Note
As I'm going to continue with NextJS, I won't be reworking the todo project in this repository, so that I can focus on learning the NextThing (Pun 2.0).
But yeah, I now know of prop drilling vs useContext and avoiding useEffect 😃😆