React From Scratch

Intro

There is no "This is the way" to learn React, just like there is no single way to learn anything. Given the popularity of React, there are MANY resources available to get you started. Simply entering 'React for beginners' will return a plethora or articles that will point you in the direction of learning React. So instead of laying out some kind of structured course to go from zero-to-hero, this article will instead give you an introduction to react as well as some starting resources.

If you're looking for a reason to use React over other libraries, look no further that this article: Why You Should Use React.js For Web Development

Prerequisites

1. You need a basic understanding of HTML/CSS/JavaScript
2. Knowledge of ES6 features (let/const, arrow-functions, import/export, classes, etc)
3. A familiarity with a JavaScript runtime environment like Node (npm) or Yarn

Start with JUST React

The React community is huge, so there are MANY bells and whistles and it can be tough to know where to begin. My advice is to start with just React. Learn about its core concepts and how it works, even at a high level before moving on to other aspects.

Here are some resources that got me going initially:

• React in 100 Seconds will give you the quickest intro
• A couple of short online projects will give you some exposure, like building a simple TODO list or a Tic-Tac-Toe game
• Then there is always the official documentation which is comprehensive and has plenty of examples.

Community

As I mentioned, the React community is huge and can be found on almost every platform
_{Feel free to leave a comment with your favorite resources.}

The Bells and Whistles

Once you have a clear understanding of React's concepts, you can start playing with all its toys.

• Vite is a build tool that can bootstrap a React development environment
• Routing with React Router or TanStack Router
• State Management with Redux
• Request Caching with, React Query or Apollo Client for GQL
• Storybook is great for testing components in an isolated environment

These are just an arbitrary list of functional libraries that I've used previously, but there are so many that span every aspect of web development and more.

Conclusion

I thoroughly enjoy learning and working with React and hope that this article helps you in your educational journey.