Skip welcome & menu and move to editor
Welcome to JS Bin
File
Add library
Share
Login or Register
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
<!DOCTYPE html>
<html>
<head>
<script src="//fb.me/react-0.12.0.js"></script>
  <meta charset="utf-8">
  <title>JS Bin</title>
</head>
<body>
​
</body>
</html>
 
body {
  margin: 2em;
  background: #E8E8E8;
}
​
.photo {
  font-family: sans-serif;
  font-size: 14px;
  color: #232323;
  margin: 1em auto;
  padding: 1em 1em 0 1em;
  background: white;
  max-width: 200px;
}
​
img {
  width: 100%;
  max-width: 200px;
  margin: 0 auto;
  display: block;
}
​
.bar {
  background: white;
  display: flex;
  align-items: center;
}
​
span {
  line-height: 2.4;
}
​
button {
  background: none;
  border: 0;
  color: #BDBDBD;
  font-size: 2em;
  margin-left: -4px;
}
​
button.active {
  color: #46749A;
}
​
button:hover {
  cursor: pointer;
}
​
button:focus {
  outline: none;
}
 
var Photo = React.createClass({
​
  render: function() {
    return <img src='http://tinyurl.com/lkevsb9' />
  }
});
​
React.render(<Photo />, document.body);
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
jarsbepro
0viewers