DEV Community

Sajin Joe J
Sajin Joe J

Posted on

React JS – Complete Beginner Guide

React is a JavaScript library used to build interactive user interfaces, especially for websites and web applications.

React helps you build websites using reusable pieces called components.

1. Install React
The easiest way to start a new React project is with Vite.
Open your terminal and run:

npm create vite@latest my-react-app
cd my-react-app
npm install
npm run dev
Enter fullscreen mode Exit fullscreen mode

Choose React → JavaScript when prompted. Then open the local URL displayed in your terminal, usually http://localhost:5173/.

2.Your first React component
Create or replace the code in src/App.jsx:

function App() {
    return (
        <div>
            <h1>Hello, Sajin Joe!</h1>
            <p>Welcome to React.</p>
        </div>
    );
}

export default App;
Enter fullscreen mode Exit fullscreen mode

Explanation:

  • function App() creates a component.
  • return describes what appears on the screen.
  • JSX lets you write HTML-like markup inside JavaScript.
  • export default App allows another file to import the component.

React component names normally start with a capital letter.

Top comments (0)