Join Eve Porcello for an in-depth discussion in this video Creating a React component, part of Learning React.js.
- [Instructor] In this video,…we're going to create a React component.…Let's open our index dot HTML file,…and make sure that we are using the React library,…React DOM, as well as the Babel in-browser transpiler.…Then, we're going to add our React code here,…to line 12, inside of our script tag.…Whenever I create a component,…I'm going to set it to a variable,…so I'm going to call it my component.…Notice that my component is capitalized,…that is a React best practice.…
We're going to say React dot create class,…and this function is going to take in an object.…Now, the first method that's part of this object…is going to be called render.…Render is always required when we create a component,…because it tells react what we want to render to the DOM.…We're going to return a div.…This div is going to contain an H1,…and it's going to contain a P.…
The H1 will say hello world,…and then I'll say this is my first React component.…Excellent.…The next step is we need to use that function…that we learned earlier, React DOM dot render.…
- What is React.js?
- Introducing JSX
- Creating a React component
- Handling events
- Using state
- Working with PropTypes
- Adding child elements
- Mounting and updating components
- Creating a React.js app
Skill Level Beginner
Building a Web Interface with React.jswith Ray Villalobos1h 21m Intermediate
1. What Is React.js?
2. Getting Started
3. React Components
4. Props and State
5. Enhancing Components
6. Creating an App
Using create-react-app4m 38s
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?
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.