React, from the ground up

React From Zero to Hero or From the Ground Up

Contents

1. Introduction
   1. React
2. Lessons
3. Assessments
4. Examples

Introduction

⬆ Back to the contents

JavaScript is an EDD (Event-Driven Development) language with a functional paradigm and prototype chaining.

TypeScript is the typed, and thus safer, version of JavaScript. Is it recomended? Yes, maybe as a beginner it may be hard, but it sure will be worth it on the long run.

React

⬆ Back to the contents

React nurtures from the events, this is something to have in mind while trying to understand React, and probably other JS frameworks. Created by Meta (previously Facebook), https://github.com/facebook/react.

Contrary to many other (JS) frameworks out there, React doesn't provide the solutions, rather, it gives you the tools to find the solution that better fits your needs/requirements. But it is true that React is just a library, a really powerful library, but not a framework.

Slides

I've also decided to include slides for those visual learners. And because they may be easier to maintain, or more visually appealing at least.

All the slidewse are at it's respective folder at /slides.

Lessons

⬆ Back to the contents

You can also check the lessons content at the /lesssons folder.

It's categorized to my own like, perspectives, opinions and experience. And it's not necessarily, intermediate do this and that, or this is harder or easier, it's just, maybe, how I would have liked to actually learn react if I were to start all over again.

0. Fundamentals
   1. Pure functions
   2. Memoization
   3. Promises
   4. TypeScript
   5. Closures
   6. HOCs
1. Beginner
   1. JSX
   2. Components
   3. Life Cycle
   4. React Hooks
   5. Classes
   6. Error Boundary
2. Intemediate
   1. Context API
   2. React Hooks
   3. HOCs
   4. Suspense
3. Advanced
   1. React Hooks
   2. Structure
   3. Concurrent
4. Extensions
   1. React Dev Tools
   2. Redux Dev Tools
5. Libraries
   1. Enzyme
   2. Prettier
   3. React Error Boundary
   4. React Intl
   5. React Query
   6. React Redux
   7. React Router
   8. React Saga
   9. Styled Components
6. Frameworks
   1. Astro
   2. Docusaurus
   3. Gatsby
   4. NextJS
   5. React Native
   6. Redwood
   7. Remix

Assessments

⬆ Back to the contents

You can find some assessments at /assessments.

1. Todo List

Examples

⬆ Back to the contents

You can find some examples at /examples.

1. Hello World
2. Good Input