Create a Component Instance

MyComponentClass is now a working component class! It’s ready to follow its instructions and make some React components.

So, let’s make a React component! It only takes one more line:

To make a React component, you write a JSX element. Instead of naming your JSX element something like h1 or div like you’ve done before, give it the same name as a component class. Voilà, there’s your component instance!

JSX elements can be either HTML-like, or component instances. JSX uses capitalization to distinguish between the two! That is the React-specific reason why component class names must begin with capital letters. In a JSX element, that capitalized first letter says, “I will be a component instance and not an HTML tag.”

Instructions

1.On line 11, create an instance of MyComponentClass.

app.js

import React from 'react';

import ReactDOM from 'react-dom';

class MyComponentClass extends React.Component {

render() {

return <h1>Hello world</h1>;

}

// component goes here:

Page updated

Report abuse