React

Introduction

This guide is a step-by-step introduction to React.js, one of the most powerful libraries for building modern, interactive web applications. With its component-based architecture, virtual DOM, and declarative approach, React has changed how developers build for the web.

Throughout this guide, you’ll learn core concepts through hands-on examples and progressively build your understanding of React’s capabilities. Here’s what we’ll cover:

Part 1

• State and JSX interaction

• Component structure and file organization

• Props and dynamic rendering

• Events, spread operator, and preventing defaults

• Conditional rendering

• Callbacks, destructuring, and immutability

• Lifting state up

Part 2

• API calls with fetch and async handling

• Side effects with useEffect

• Third-party libraries and custom components

• Reading docs and using external tools

• Persisting data with a backend

• Deploying your app

Prerequisites

To get the most out of this guide, you should have a basic understanding of:

• JavaScript and TypeScript
• HTML and CSS

If you’re not comfortable with these yet, we recommend brushing up on the syntax before diving in.

Setup

Please refer to this setup guide.