- Clone the repo
- Install Ruby dependencies:
$ bundle install
- Install JS dependencies:
$ npm install
or$ yarn
- Run the javascript watcher/server:
$ npm run dev
or$ yarn dev
- Run the Sinatra app:
$ bundle exec shotgun
- Load the Sinatra apps url, probably: http://localhost:9393/
When you run npm run dev
, webpack is transpiling all your JS and CSS and serving them up as http://localhost:8080/bundle.js
.
The Sinatra app references that bundle so that the latest React app is loaded when you refresh the page.
To run the linter once:
$ npm run lint
// or
$ yarn lint
To run the watch task:
$ npm run lint:watch
// or
$ yarn lint:watch
To run the tests:
$ npm test
// or
$ yarn test
- run
$ npm run build
or$ yarn build
- run
APP_ENV=production bundle exec shotgun
This creates a transpiled asset file (bundle.js
) of your JS and CSS in the lib/app/public/
directory. This is great for production, but not so hot for development workflow as you would need to transpile every time you made a change to the JS.
This app is set up for deployment to Heroku!
This assumes you have already have a Heroku account and have the Heroku CLI installed
🚨 Be sure to run the build script before deploying. 🚨
$ heroku login
$ heroku create -a name-of-your-app
$ git push heroku master
$ heroku open
If you're unfamiliar with Heroku deployment (or just need a refresher), they have a really great walkthrough here.
Initial release. Basic setup for a React + Sinatra integration