Untitled

# Setup new React.js project
react_new() {
  echo ">> Setting up NPM...";
  npm init -y;

  echo ">> Running NPM install...";
  npm install --save react react-dom;
  npm install --save-dev browserify babelify babel-preset-es2015 babel-preset-react fsmonitor;

  echo ">> Setting up initial files...";

  # index.html
  echo '<html>
  <head>
    <title>React.js Starter Project</title>
  </head>
  <body>
    <p>Example React.js starter project</p>
    <div id="content"></div>
    <script src="dist/bundle.js"></script>
  </body>
</html>
' >> index.html;

  # Setup directories
  mkdir dist src src/components;

  # src/components/App.js
  echo "'use strict';

const React = require('react');

const App = React.createClass({
  render() {
    return (
      <p>Hello React.js!</p>
    );
  }
});

module.exports = App;" >> src/components/App.js;

  touch src/index.js;
  echo "'use strict';\nconst React = require('react');\nconst ReactDOM = require('react-dom');\nconst App = require('components/App');\n\nReactDOM.render(<App />, document.getElementById('content'));" >> src/index.js;

  echo "Add these NPM 'script' tasks:\n";
  echo '    "build": "NODE_PATH=./src ./node_modules/browserify/bin/cmd.js src/index.js -o dist/bundle.js -t [ babelify --presets [ es2015 react ] ]"';
  echo '    "watch": "./node_modules/fsmonitor/bin/fsmonitor.js -s -d src npm run build"';
  echo "\n\n";
}