Skip to main content

Quick Start

Get started with React components, JSX, and rendering.

Official docs

This page mirrors Quick Start — react.dev.

What You'll Learn​

  • How to create and export a React component
  • JSX syntax and rendering to the DOM
  • The difference between root rendering and nested components

Your First Component​

export default function Welcome() {
  return <h1>Hello, DevFlow!</h1>;
}

Components are JavaScript functions that return markup. React treats them as building blocks — compose small components into larger UI trees.

Adding JSX​

JSX lets you write HTML-like syntax inside JavaScript:

function Profile({ name, role }) {
  return (
    <div>
      <h2>{name}</h2>
      <p>{role}</p>
    </div>
  );
}

Next Steps​