The following is a thorough guide that will showcase how to take advantage of the MEAN (MongoDB, Express.js, AngularJS & Node.js) Stack.
If you’re looking for an easy to follow MEAN Stack installation guide? MEAN.IO has a pretty legit one! But if you’re a Homebrew fan like me and don’t mind spending a few hours installing, configuring and troubleshooting packages; this guide will help you get started:
Note: This guide assumes a clean install of macOS, Command Line Tools and Homebrew.
If you’re still reading this; ha. I assume you’re a front-end developer? And, chances are you’re using a LAMP Stack! Which comprises of the following components:
- Linux Server OS on which you’re running an
- Apache web server with
- MySQL as a database and
- PHP as the backend language
And you maybe asking yourself why use the MEAN Stack? The idea is quite simple actually:
- MongoDB as the database
- Express as the web framework
- AngularJS as the front-end framework, and
- Node.js as the server platform
Also, the following are some of the advantages of the MEAN Stack:
- Single language is used in the whole application
- Support for the MVC pattern
- JSON is used for tranferring data
- Node.js’s hude module library
- Open source so you can tweak it to your preferences if you’re an experienced user
Let’s begin, go ahead and open your terminal app of choice:
Install MongoDB
brew install mongodb
Let’s test our MongoDB installation:
mongod
mongod is the primary process for the MongoDB system. It handles data requests, manages data access, and performs background management operations.
If you get the following error: Failed to set up sockets during startup. Let’s troubleshoot before moving forward.
This error is caused by the mongodb service not yet started, you can fix this issue by starting the service with the following command:
brew services start mongodb
After starting mongodb services, let’s test it again:
mongod
If you still get the Failed to set up sockets during startup error, let’s continue troubleshooting:
brew services stop mongodb
And let’s type the following. Note: You will be asked to enter your system password:
sudo mkdir -p /data/db
Let’s continue with:
sudo chmod 0755 /data/db
And:
sudo chown $USER /data/db
Now, let’s restart mongodb services:
brew services restart mongodb
Finally, let’s test it one more time:
mongod
And there you have it; congratulations!
The reason of the issue is due to “System Integrity Protection” on macOS, I will not go into detail but you can go ahead and read about it on your own time.
Just for fun let’s go ahead on open the JavaScript shell interface to MongoDB:
mongo
Note: Remember that mongod is the primary daemon process for the MongoDB system, and mongo is the interactive JavaScript shell interface to MongoDB.
If you feel a bit more comfortable with using a GUI MongoDB management tool, I recommend using Robomongo.
Reading documentation is an essential part of being a developer, it might not sound sexy, it’s sometimes tedious, but it’s an essential job to understand what you do and how things work.
Install Node.js without NPM
Note: I prefer to install Node.js without NPM, if you would like to know why please read my NPM Housekeeping blog post.
Let’s install Node.js:
brew install node --without-npm
Now let’s add: ~/.node/bin to your PATH so commands you install globally are usable. I added this line to my ~/.path script, which gets run via ~/.bash_profile.
export PATH="$HOME/.node/bin:$PATH"
Install NVM (Node Version Manager)
Note: This is an optional step. Also, we’re not going to be using Homebrew since nvm does not like how it handles linking!
Using cURL:
curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.32.1/install.sh | bash
or
Using Wget:
wget -qO- https://raw.githubusercontent.com/creationix/nvm/v0.32.1/install.sh | bash
Add the following command to your PATH:
export NVM_DIR=“$HOME/.nvm”
[ -s “$NVM_DIR/nvm.sh” ] && \. “$NVM_DIR/nvm.sh”
Nice! You now have nvm installed.
Install NPM
Let’s tidy things up:
echo prefix=~/.node >> ~/.npmrc
Now, let’s install NPM:
curl -L https://www.npmjs.com/install.sh | sh
Let’s test our NPM installation:
npm outdated -g
If you get the following error:
npm ERR! addLocal Could not install /private/var/folders/bd/2n75y0xx7_54sprgwhmflszr0000gn/T/npm.50276/package
You can fix the issue by running the following command:
npm install -g npm@latest
Now, let’s clean things up:
npm cache clean
Great, you now have NPM installed.
Install Express Using NPM
Note: The following will install express application generator.
npm install express-generator -g
Install NSP (Node Security Platform)
Note: This is optional, Node Security helps you keep your node applications secure.
npm install -g nsp
NSP makes use of the CLI (Command Line Interface) tool to help identify known vulnerabilities in your own projects.
You can run the following command within your project folder:
nsp check
Install AngularJS
AngularJS is a front-end JavaScript framework designed to build single-page applications using the MVC architecture.
Note: Before installing AngularJS let’s install Bower. Bower is a package manager which makes it easier to download and maintain your front-end libraries.
npm install -g bower
Once Bower is installed you can use the following command to install AngularJS:
bower install angular
Bower places all of its files in the bower_components folder in the root folder of your project application, namely in the folder where you executed the bower install command. To install your front-end packages in a different location, go to the root folder of your application and create a file name .bowerrc that contains the following lines of code:
{
directory: mydir/jsscripts
}
Bower, like Node.js uses a config file named bower.json where you can define your dependencies. In order to install AngularJS via the bower.json file, first put the following content in that file:
{
name: MEAN
version: 0.0.0,
dependencies: {
angular: #version of your choice
}
}
And then execute:
bower install
This will fetch the AngularJS package files and place them under the mydir/jsscripts folder. If you get an ‘Unexpected token n’ error, try the suggestions from StackOverflow; ha.
Congratulations! You’ve learned how to install the MEAN Stack on macOS from scratch.