MEAN Part 2 - Create a MEAN web application using the open-source MEANJS.org solution

8 years ago

What is MEANJS.org?

MEANJS.org is an open source boilerplate for the MEAN stack developed and maintained by Amos Haviv and Roie Cohen. This solution was a fork from the original MEAN.io repository where Amos was one of the the primary authors. However, it has far exceeded the original repo in terms of organization, feature set, scalability, and documentation.

With that said, the installation step should work with MEAN.io repository instead as the steps should be very similar.

Note: The following steps assume your web app will be called “meanjs”, you will want to replace this with your own name.

Create Project

  • Open WebStorm and create an Empty project.
  • MEANJS.org now provides a Yeoman generator that makes it very easy to make subsequent apps. If you installed Yeoman above, you can add the generator by running the first command. The second command will actually create the web app.
npm install -g generator-meanjs
yo meanjs

Alternatively, clone the MEAN.JS repository.

  • If you clone, it will create a directory and you will want to move all of the content up one level.
git clone https://github.com/meanjs/mean.git meanjs

Note: To avoid any port conflicts, you can change the default port of 3000 to something different by navigating to config → env → all.js and editing the line with the port property.

Install packages and run grunt to build**

npm install
grunt

In the browser, navigate to http://localhost:, using the port specified in step #4. I recommend logging in and creating a few articles. You might use the string “dev” in the items you create so it can be easily distinguished between those in the QA environment we’ll set up later on.

Discuss on Twitter