ngRails (JavaScript)

An easy starter project for a Rails 5 / Angular 2 build. This is the JavaScript version. There is also a TypeScript version. Features:

• webpack serves assets.
• Babel enables ES6/7 JavaScript language features using the Latest preset.
• Sass makes styling smart, and smart styling easy.
• Foreman runs webpack and Rails server concurrently with just one command.
• Heroku deployment is a cinch.

Prerequisites

• Node.js and npm
• Ruby 2.3.3. Consider RVM, if not already installed.
• Rails 5
• Bundler
• (Optional) Heroku CLI

Installation

Fork or clone this repository

If you choose to clone, you can run this command to clone this repo into a new project folder (e.g. my-proj):

git clone https://github.com/R-V-S/ngRails-JS.git my-proj
cd my-proj

Install the node modules for webpack and Babel

npm install

Install gems

bundle

Run

foreman start

Development

Angular

Angular's files are contained in app/client. No testing platform is installed. Consider Karma.

Decorators are supported through the Babel Legacy Decorator plugin.

Templates and stylesheets should be required inline rather than using Angular's templateUrl or styleUrls.

Stylesheets for components must end in .component.css or .component.scss. This is because component stylesheets, which are included inline, must be run through Babel's raw loader.

Webpack

Webpack's configuration is in config/webpack.config.js

Rails

Rails is installed without Sprockets (-S) and without Minitest (-T). Rspec is installed as a testing platform.

Databases

By default, sqlite3 is configured to run locally and postgresql is configured for production.

Deployment

Deploying to Heroku is easy.

Install the Heroku CLI

Heroku CLI

Create a new Heroku app

heroku create

Configure buildpacks

heroku buildpacks:add --index 1 heroku/nodejs
heroku buildpacks:add --index 2 heroku/ruby
heroku buildpacks:add --index 3 https://github.com/febeling/webpack-rails-buildpack.git

Push your code / Deploy

git push heroku master

Open

heroku open