3/25/2017 - 2:31 PM

Simple React Hello World

Simple React Hello World

import React from "react";
import ReactDOM from "react-dom";

const Hello = function(name) {
  return (
    <div>Hello, {name}</div>

const view = Hello("Will");

const element = document.getElementById("app");
ReactDOM.render(view, element);
<!DOCTYPE html>
    <title>Simple React Hello World</title>
    <h1>Simple React Hello World</h1>
    <div id="app"></div>
    <script src="/generated-app.js"></script>
  "name": "hello-react",
  "version": "1.0.0",
  "description": "Simple React Hello World",
  "main": "index.js",
  "scripts": {
    "start": "browserify -t babelify --outfile public/generated-app.js src/hello.jsx && echo 'Open http://localhost:8000/ in your browser' && (cd public ; python -m SimpleHTTPServer)",
    "watch": "watchify -v -t babelify --outfile public/generated-app.js src/hello.jsx"
  "author": "",
  "license": "ISC",
  "repository": "none",
  "devDependencies": {
    "babelify": "^6.3.0",
    "browserify": "^11.2.0",
    "watchify": "^3.4.0"
  "dependencies": {
    "react": "^0.14.3",
    "react-dom": "^0.14.3"

Simple React Hello World

Run these commands:

npm i
npm start

You only have to run npm i the first time.

In a separate window, run npm run watch to hot-reload your changes.