0:00 All right, so we're finally ready to finish up 0:02 building up the core of our UI by 0:04 adding the rest of our sidebar component. 0:06 We wanna add the ability to suggest some recommended users that the 0:10 main user here can follow. Now, as we've been doing before, we're gonna 0:14 use stub data, just like in our 0:18 stories component here to suggest some dummy users for now, and then later 0:22 on we'll fill this in with real data from our server side. 0:25 So to do this, let's head back into our sidebar 0:28 component, 0:29 and just as we've done before, I'm gonna go ahead and create an 0:33 interface for a given suggested user. 0:38 So we're gonna see what this looks like, the shape of the data. 0:41 We'll have an ID of type string, a username to 0:44 represent the suggested user's username, 0:47 and the avatar URL for that user. Now finally, we can also have 0:51 a followedBy field, and so this is gonna represent the 0:54 relationship of the suggested user that we're gonna introduce, which 0:58 is gonna be 0:59 suggested users will be recommended based off of the users we're 1:03 currently following, and so we'll have this almost relationship 1:06 between to actually display the correct ones. 1:10 And then I'm gonna go ahead and introduce a new mock data array 1:14 called mockSuggestions and set it equal to... 1:18 Well, the type is of type SuggestedUser array. 1:22 And I'll go ahead and fill this in with stub data. 1:24 All right, so I've gone ahead and pasted in the mockSuggestions stub 1:28 data here, 1:28 and so feel free to copy this directly from the GitHub repository so you 1:32 have some starting data here that we can use to output our suggested 1:36 users. 1:37 Now with this in place, let's head back down into our sidebar 1:40 component, 1:41 and underneath our card here we're gonna introduce another card
The rest of the transcript is for members.
Sign in 