react_fundamentals.js

// Hello World!
ReactDOM.render(
  <h1>Hello, world!</h1>,
  document.getElementById('root');
);

//Sample Component
import React from 'react';
import logo from './logo.svg';
import './App.css';

function App(){
  return (
    <div className="App">
      <header className="App-header">
        <img src={logo} className="App-logo" alt="logo" />
        <p>
          Edit <code>src/App.js</code> !
        </p>
      </header>
    </div>
  );
}

export default App;

// Function  Component
function MyButton(props){
  return <input
          type='button'
          style={{padding: '8px', backgroundColor: '#000', color: '#fff'}}
          value={props.title} />;
}

// Class Component
class MyButton extends React.Component{
  render(){
    return <input
          type='button'
          style={{padding: '8px', backgroundColor: '#000', color: '#fff'}}
          value={this.props.title} />;
  }
}

// Codepen sample link: https://codepen.io/bradleyboy/pen/OPBpGw