React Components

function Welcome(props) { # functional component
    return <h1>Hello, {props.name}</h1>;
}

const Welcome = (props) => { # arrow function
    return <h1>Hello, {props.name}</h1>;
};

class Welcome extends React.Component { # class component
    render() {
        return <h1>Hello, {this.props.name}</h1>;
    }
}

<Welcome name="John" /> # render component
<Welcome name="John">Content</Welcome> # with children

export default Welcome; # default export
export { Welcome }; # named export
import Welcome from "./Welcome"; # import default
import { Welcome } from "./Welcome"; # import named