What Is React?

Welcome to React! React is a JavaScript library for building web apps, pages that respond to what you do. (A library is ready-made code that you use in your own programs.) Facebook and Instagram are built with React, and so are many other apps you know. In this course, you'll build an app for a music festival called Summer Sounds, step by step.

The editor already has a small React app. Click Run: the preview shows the festival's lineup and a ♥ button. Click the button a few times.

Remember how you changed a page in the JavaScript course: you found an element with querySelector(), changed its textContent and made new elements with createElement(). You told the page what to change, step by step.

React works the other way round. You describe what the page should show for your data, and React makes the page. When the data changes, React updates the page itself. Look at App.jsx: the bands are in the array bands, and the list on the page is made from it. There's no querySelector() and no textContent. The ♥ button only increases a number, likes, and React shows the new number.

The page is made of components, parts with names that you write yourself, such as a band's card, the lineup or a ticket form. You'll write your first one in this lesson.

Don't worry if not every line of App.jsx makes sense yet: map() with key, onClick and useState each come in a later lesson. By the end of the course, you'll write all of it yourself, and much more.