React Basics: React concepts: declarative

Join the AI Workshop to learn more about AI and how it can be applied to web development. Next cohort February 1st, 2026

The AI-first Web Development BOOTCAMP cohort starts February 24th, 2026. 10 weeks of intensive training and hands-on projects.


You’ll run across articles describing React as a declarative approach to building UIs.

React made its “declarative approach” quite popular and upfront so it permeated the frontend world along with React.

It’s really not a new concept, but React took building UIs a lot more declaratively than with HTML templates:

  • you can build Web interfaces without even touching the DOM directly
  • you can have an event system without having to interact with the actual DOM Events.

The opposite of declarative is imperative. A common example of an imperative approach is looking up elements in the DOM using jQuery or DOM events. You tell the browser exactly what to do, instead of telling it what you need.

The React declarative approach abstracts that for us. We just tell React we want a component to be rendered in a specific way, and we never have to interact with the DOM to reference it later.

Lessons in this unit:

0: Introduction
1: Setting up a React project with Vite
2: React Components
3: Introduction to JSX
4: Using JSX to compose UI
5: The difference between JSX and HTML
6: Embedding JavaScript in JSX
7: Handling user events
8: Install the React Developer Tools
9: Getting started with JSX
10: How to return multiple elements in JSX
11: How to learn React
12: Should you use jQuery or React?
13: ▶︎ React concepts: declarative
14: The Virtual DOM
15: The roadmap to learn React
16: What’s new in React 19
17: How to install React
18: The React Fragment
19: React, how to transfer props to child components
20: React PropTypes
21: React DOM events on components
22: How to pass a parameter to event handlers in React