Get Ready to Deploy
Mean.js deploy with Heroku
Mean.js deploy with Nodejitso
Mean.js deploy with Digital Ocean
MEAN development stack on Google Compute Engine
MEAN.JS: Dev/Stage/Prod with Heroku
If you’re building websites, your probably familiar with the standard dev->stage->prod environment configuration:
- dev on your local machine
- stage for collaboration with other developers and/or QA testing
- production the live data for users.
Using the hosting service Heroku we can quickly setup a dev/stage/prod environment and deploy with
This is a great Lean Startup way to get your project up and in front of users with very little effort and cost.
Here’s a gist of what we’re going to do.
Hey! There’s alot of different ways to do something like this. Know a better way? Please leave a comment below!
About MEAN.JS and Heroku
Heroku is a great application hosting service.
- Their free tier is generous
- Configuration can be done from the command line.
- Deployment is done with
MEAN.JS is a full-stack application framework for Node.js.
gitand using the
Part 1: Setting up a Dev Server
This is about setting up a server on your laptop or desktop. For MEAN.JS:
- Setup our dev environment.
- Get some code:
git clone https://github.com/meanjs/mean.git.
npm installto download our projects dependencies
gruntto start our local dev server
- Visit http://localhost:3000
It’s not necessary to have or run the MEAN.JS project, but it offers an excellent case study.
We setup our local
git repository to:
- Get official updates and bug fixes from remote upstream.
- Push code to remote fork so we could make GitHub pull requests.
- Use a private repo origin for our project’s code.
These commands will quickly setup our repo. Or simply
git clone the main repo and ignore the upstream, origin, andfork remotes and repositories in the diagrams.
We’re going to use
heroku to create our production and staging servers.
Part 2: Setting up a Production Server
1. Create a Heroku account.
Remember your email and password for the next step.
2. Install the Heroku Toolbelt and login
cd PROJECT heroku login
3. Create our app.
We could use the website, but the command line interface is interesting and easier to document
# From our repo's directory, create a heroku app heroku create YOURAPPNAME --buildpack https://github.com/mbuchetics/heroku-buildpack-nodejs-grunt.git heroku labs:enable user-env-compile
Come up with a unique app name or leave it blank to get a random one:
$ heroku create YOURAPPNAME Creating YOURAPPNAME... done, stack is cedar http://YOURAPPNAME.herokuapp.com/ | [email protected]:YOURAPPNAME.git Git remote heroku added
This did several things:
- Created our app on the Heroku service. Check your apps.
- Added a DNS entry where our app will be hosted.
- Created a git repository at Heroku.
- Created a remote heroku pointing to this Heroku app.
Now, every time we push to this remote, Heroku rebuilds and deploys our app.
This is our production server. Let’s rename the heroku remote to production.
git remote rename heroku production
Add a MongoHQ db server
Our MEAN app needs a database. Heroku integrates with many add-ons which you can browse online. We can add a MongoDB database right from the CL:
heroku addons:add mongohq --app YOURAPPNAME
Configure MEAN.JS to use the MongoDB server
By default, MEAN uses the database server at localhost. To configure our server to use MongoHQ’s server, we need to set the server to production mode
heroku config:set NODE_ENV=production --app YOURAPPNAME
TASK: Deploy our app to production
Because we’re using git flow, our production code is kept in the master branch.
NOTE: Before deploying your app in production mode, compile and commit the minified js and css files.
grunt build git commit -am 'Compile distribution js and css'
To deploy our app, we use
git push production master
We should get the usual git output, followed by a git post-commit hook deploying the app on Heroku’s server. Here’s some example output.
To see our app in action, open a browser:
heroku open --app YOURAPPNAME
Hurray, you’re live!
Part 3: Setting up a Stage Server
Here we rinse and repeat. We can use Heroku’s fork feature to copy our application and it’s add-ons.
# Create a new Heroku app: heroku fork -a YOURAPPNAME YOURAPPNAME-stage # Add a remote called 'stage' git remote add stage [email protected]:YOURAPPNAME-stage.git # Set app to use forked MongoDB database heroku config:set NODE_ENV=production --app YOURAPPNAME-stage
TASK: Deploy your app’s dev branch to stage
Our ‘stage’ code is kept in the ‘dev’ branch. Again, we can use
git to deploy:
# Syntax [remote] [local branch]:[remote branch] git push stage dev:master heroku open --app YOURAPPNAME-stage