React First Code

index.html

<div id="app"></div>

react-first-code.markdown

React First Code

A Pen by Akinseye Olawale on CodePen.

License.

script.babel

function Person(props) {
  return (
    <div className="person">
        <h1> { props.name } </h1>
        <p> Your age is { props.age }</p>
    </div>
  )
}

var Persons = (
  <div>
     <Person name="Max" age="28" />
     <Person name="Maddy" age="32" />
  </div>
)
ReactDOM.render(Persons, app);

scripts

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.6.1/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.6.1/react-dom.min.js"></script>

style.css

.person {
  display: inline-block;
  margin: 10px;
  border: 1px solid #eee;
  box-shadow: 0 2px 2px #ccc;
  width: 200px;
  padding: 20px;
}