Generate a MeanJS App using Yeoman Generator

First let's see what is MEANJS, then we gonna walk you through a simple tutorial on how to develop a meanjs app using yo generator. 
What is MEAN.JS?
MEAN.JS is a full-stack JavaScript solution that helps you build fast, robust, and maintainable production web applications using MongoDB, Express, AngularJS, and Node.js.
Why MEAN.JS?
MEAN.JS will help you getting started and avoid useless grunt work and common pitfalls, while keeping your application organized. Our goal is to create and maintain a simple and readable open-source solution that you can use and trust in your projects.
One of the most frequently asked features from MEAN users is a way to scaffold their applications.So using yeoman generator, which includes a set of simple tools, can make your life easy as a developer.
  • As the first step you have to install yo scaffolding tool,
    • npm install -g yo
  • This is only the tool, now we need to install a sub-generator which is the one we need in this tutorial.
    • npm install -g generator-meanjs
  • Now, we can start the creation of our application. First navigate to the folder in which you need to create the application and type,
    • yo meanjs
  •  Now they gonna ask you a few questions about how the application should be configured.
    • Here are few screenshots that will be useful in configuring your app




  • It will take couple of minutes to download and install dependencies.
  • Since this application use MongoDB as the database,we need to have a database instance running before starting the application.
    • You can start the mongodb server by command (MongoDB should be installed and the path should have been set before using this command),
      • mongod


  • Now the application is finalized, you need grunt to start this application, but first,
  • You're going to use the Bower Package Manager to manage your front-end packages. Make sure you've installed Node.js and npm first, then install bower globally using npm: 
    • npm install -g bower
  • Grunt - You're going to use the Grunt Task Runner to automate your development process. Make sure you've installed Node.js and npm first, then install grunt globally using npm:
    • npm install -g grunt-cli
  • Sass - You're going to use Sass to compile CSS during your grunt task. Make sure you have ruby installed, and then install Sass using gem install:
    • gem install sass   npm install -g grunt-cli
  • Gulp - (Optional) You may use Gulp for Live Reload, Linting, and SASS or LESS,
    •  npm install gulp -g    
  •  Finally use grunt to run the application,
    • grunt
 Here you can see few screenshots of the application that we have generated, Next in this MeanJS blog series we will be covering How to add a CRUD module to our created app. Click Here to get the source code. 
  •  Screnshots
     

Comments

Post a Comment

Popular posts from this blog

Introduction to using ExpressJS with MongooseJS and NodeJS - Part 2

Image
This is a continuation of my previous blog on using express on NodeJS and MongooseJS. Please refer to that tutorial before continuing further in this tutorial. Here we gonna continue our previous applications CRUD functionalities, but first we gonna streamline our project by using nodemon package. Intializing Nodemon using following command, npm install nodemon --save-dev Here, Nodemon restarts the server automatically each time you save a file that the server uses. The reason for using it as only as a developing dependency is we only need it in development time. There are many ways to run the application using nodemon, but i will use a much simpler way, Here we gonna define nodemon in run script in package.json Now we need to enter the following command in terminal inorder to run the application, npm run dev So we are back to our main topic CRUD functionalities. We have already created GET-READ capability in previous tutorial. Let's start on POST-CREATE capabi...
Read more

Using OAuth 2.0 Framework to Manipulate Files in Google Drive

Image
Let's see why OAuth is important? OAuth is a specification that allows users to delegate access to their data without sharing their username and password with that service. That's cool. But why do you care, as a developer? There's a lot of information and a lot of uses that OAuth provides, that you wouldn't normally get without it, which include things like social graphs of your users, sharing information via your users, things like tweeting and posting to Facebook. You can aggregate user data in order to find interests, etc. about your users. In our day to day interactions on internet, we come across with lots of websites where we have to create accounts to use the website for our work.  If you use different credentials for different accounts, it becomes worse where you have to remember all your usernames and passwords for each website. In order to address this issue, modern websites make use of the OAuth protocol with the concepts of “Identity Federation” and “Del...
Read more

Preventing Cross-Site Request Forgery (CSRF) with Double Submit Token Pattern

Image
This post is a continuation of the previous post  which refers what is Cross Site Request Forgery (CSRF) and how we can prevent this attack using Synchronizer Token Pattern. As I've mentioned in the previous post there are mainly two ways of preventing a CSRF attack. In this post we will discuss how to prevent a CSRF attack using Double Submit Cookie Pattern. To get a basic understanding of how CSRF work please refer the previous post . Double Submit Cookie Pattern If storing the CSRF token in session is problematic, an alternative defense is use of a double submit cookie. A double submit cookie is defined as sending a random value in both a cookie and as a request parameter, with the server verifying if the cookie value and request value match. When a user authenticates to a site, the site should generate a (cryptographically strong) pseudo-random value and set it as a cookie on the user’s machine separate from the session ID. The server does not have to save this va...
Read more