Getting Started with React in 2024

React continues to be one of the most popular JavaScript libraries for building user interfaces. In this guide, we'll explore the modern way to get started with React.

What is React?

React is a declarative, efficient, and flexible JavaScript library for building user interfaces. It lets you compose complex UIs from small and isolated pieces of code called "components."

Key Features

• Component-Based: Build encapsulated components that manage their own state
• Declarative: React makes it painless to create interactive UIs
• Learn Once, Write Anywhere: Develop new features without rewriting existing code

Setting Up Your Environment

# Create a new React app
npx create-react-app my-app
cd my-app
npm start

Your First Component

function Welcome(props) {
  return <h1>Hello, {props.name}</h1>;
}

function App() {
  return (
    <div>
      <Welcome name="Sara" />
      <Welcome name="Cahal" />
      <Welcome name="Edite" />
    </div>
  );
}

Tip: Always start component names with a capital letter. React treats components starting with lowercase letters as DOM tags.

This is just the beginning of your React journey. There's so much more to explore!