Join Shaun Wassell for an in-depth discussion in this video Displaying comments, part of React: Creating and Hosting a Full-Stack Site.
- [Narrator] Our article page is now correctly loading … information about the articles it displays, … and it's correctly showing the number of up votes … a given article has. … The next step is for us to build a new component … to display the comments for our article. … So let's go into our components directory, … and create a new file, … and we'll call it CommentsList.js … and then we're going to create a new component. … So we'll import React, import react from react, … and we'll define a component called comments list, … const comments list equals, parentheses, … and our comments list is only going to take one prop, … which will be the comments we want it to display. … So now inside our component, … we're going to map our comments, comments.map … and for each comment we're going to have a div … and if you want to use my CSS … add a class name property here, called comment. … And inside this div we're just going to display … the user name and text properties of our comment. … So for the user name property, we'll use an H4 tag, …
- Creating the app component
- Using React-Router links
- Setting up an Express server
- Route parameters in Express
- Adding the comments functionality
- Installing and adding MongoDB to your project
- Rewriting the endpoints
- Adding React hooks
- Adding buttons and forms
- Pushing code to GitHub
- Running a full-stack app on AWS
Skill Level Intermediate
1. Creating a React Front End
2. Creating a Node Back End
3. Setting Up MongoDB
4. Connecting the Front and Back Ends
5. Hosting the Site
Next steps1m 17s
- Mark as unwatched
- Mark all as unwatched
Are you sure you want to mark all the videos in this course as unwatched?
This will not affect your course history, your reports, or your certificates of completion for this course.Cancel
Take notes with your new membership!
Type in the entry box, then click Enter to save your note.
1:30Press on any video thumbnail to jump immediately to the timecode shown.
Notes are saved with you account but can also be exported as plain text, MS Word, PDF, Google Doc, or Evernote.