Generating elements from a list

Now that you know how to manage dynamic states, and display content based on a condition, we're going to learn how to automatically repeat a block of JSX for each item in a list.

This is an essential technique in React, because most interfaces display lists of data: articles, products, messages, users, etc.

A concrete case

Let's imagine you have a list of first names, and you want to display a paragraph for each one: