Join Eve Porcello for an in-depth discussion in this video Adding lifecycle functions to our bulletin board, part of Learn React.js: The Basics (2015).
- Now that we understand the component life cycle is,…we're going to take some of these new methods…and add them to our bulletin board app.…First we want to add the ability…to drag our notes around the board…using some jQuery UI.…I'm going to add this here to line 12,…with componentDidMount.…So immediately after our component renders,…we're going to be able to drag these notes around our board.…I first will use the $ for jQuery,…and then we'll use this.GetDOMNode…which will select the DOM Node…in whatever state it's currently in.…
And then we're going to chain on draggable,…which is that method of jQuery UI…that will allow us to drag.…So let's switch over to Firefox here,…and we're going to reload this.…And now when I add a note,…I can drag it around our board. Cool.…So the next thing that we can do here,…is we're going to add…a componentWillMount to our board.…Instead of loading from getInitialState,…the contents of our notes,…or editing our own notes,…we're going to load these via JSON.…
We're gonna add this here right above our add function,…
- What is React.js?
- Introducing JSX
- Creating a React component
- Handling events
- Using state
- Defining parent/child relationships
- Adding child elements
- Mounting and updating components
- Creating a React.js app
Skill Level Beginner
Up and Running with AngularJS 1with Ray Villalobos1h 20m Intermediate
1. What is React.js?
2. Getting Started
3. React Components
4. Parent/Child Relationships
5. Component Life Cycle
6. Creating an App
Next steps1m 5s
- 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.