Revisit the Bulletin Board app and enhance it with component lifecycle methods. This video demonstrates how to load data from a JSON API and then load data into components using componentWillMount.
- [Instructor] Let's revisit our bulletin board component.…I'm here in the start folder of 06_03…but I've copied my bulletin-board…over from the completed folder of 05_03…into the start here.…We're going to make some adjustments here to our state,…so our notes are this array that's empty at this point…and what we're going to do is we're going to load notes…into that state variable using fetch.…So let's go ahead and use componentWillMount,…and again, this is going to fire right before render,…and we're going to use this to load some data.…
So let's first create a variable called self…and self is going to refer to this.…And we're going to say if(this.props.count),…we'll get to that in a second,…if(this.props.count), we're going to fetch…from the following API.…All right, so we're going to use the fetch API here…to load some data.…So, https://baconipsum.com/api/?type=all-meat&sentences=.…
So, the sentences variable here…that we're passing to the URL is going to contain a count.…So we're going to say this.props.count.…
- What is React?
- Introducing JSX
- Creating components
- Using state
- Handling events
- Adding child elements
- Updating components
- Loading data from APIs
- Creating a React.js app
Skill Level Beginner
1. What Is React?
2. Getting Started
3. Creating a React Project
4. Props and State
5. Enhancing Components
6. Component Lifecycle
Next steps1m 4s
- 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.