1
00:00:00,790 --> 00:00:05,170
Out of all the different tasks that you're going to work on as a react engineer building, this is by

2
00:00:05,170 --> 00:00:07,090
far the most common thing you're going to do.

3
00:00:07,430 --> 00:00:12,070
So inside this course, you're going to get a lot of practice of building out lists and well, let's

4
00:00:12,070 --> 00:00:13,730
get some practice doing this right away.

5
00:00:14,320 --> 00:00:18,760
So our goal inside this exercise is to take this array of users right here.

6
00:00:18,790 --> 00:00:19,930
So it's an array of objects.

7
00:00:20,530 --> 00:00:27,850
We're going to build up a list of elements so each user's name will be placed into an ally, will then

8
00:00:27,850 --> 00:00:32,050
display that list inside this UL element that is being returned from the render method.

9
00:00:32,910 --> 00:00:37,170
So eventually you want to have some HTML being displayed that looks like this right here, we're going

10
00:00:37,170 --> 00:00:43,390
to have the wrapping up and then for Ellyse inside of it and inside of Eagly is a user's name.

11
00:00:44,070 --> 00:00:49,140
And when you build up this list, don't forget that each element needs to be provided a key.

12
00:00:49,560 --> 00:00:50,760
That key must be unique.

13
00:00:51,060 --> 00:00:54,960
And very frequently we use a key of an ID if one is available.

14
00:00:55,560 --> 00:01:00,540
So in this case, you'll probably want to assign a key property to each elai and that will probably

15
00:01:00,540 --> 00:01:03,120
be the idea of the user as usual.

16
00:01:03,120 --> 00:01:06,500
Go ahead and give this a shot and we'll go over a solution in just a moment.