Skip to content

emgeee/mean-stack-SFHTML5

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

63 Commits
 
 
 
 
 
 
 
 

Repository files navigation

MEAN Stack Demo

This is the code that accompanied a presentation on the MEAN stack to the SFHTML users group on Oct 30 2014.

MEAN (MongoDb + Express + Angular + Node) is an end-to-end technology stack for HTML/JavaScript applications.

Prerequisites

You must have node/npm installed. The application can run with its in-memory database ... but then you'd only be looking at the EAN stack :-)

Install MongoDb first in order to run with the MongoDb database.

Run it

This app requires both a backend server (for data) and a frontend server (for the client-side application and its assets).

Start them separately.

Start the backend data server

  • start your MongoDb server
  • open a terminal or command window
  • go to the backend directory
  • run npm install
  • choose to run either with the in-memory db or with mongo
    • in-mem:

        npm start
        node bin/www
        node-debug bin/www        (under node-inspector)
      
    • mongo:

        env MONGO=1 npm start
        node bin/www mongo
        node-debug bin/www mongo  (under node-inspector)
      

The terminal window tells you that the server is running and in which mode (in-mem or mongo).

You can try the GET apis in a browser. Here are some sample URLs:

http://localhost:4567/api/questions
http://localhost:4567/api/questions?limit=3
http://localhost:4567/api/questions/summaries
http://localhost:4567/api/questions/summaries?sort=votes&limit=5
http://localhost:4567/api/questions/5448b56b57675cbc246e6dbd

You'll have to use a tool like curl to try the POST methods.

We think the Postman chrome plugin is a great API exploration tool. We've made it easy for you by preparing some requests in a Postman json file.

Import those requests as follows:

  • Open Postman
  • Click the Collections button
  • Click the inbox icon
  • Drag backend/Postman_MEAN_Demo.json onto the dialog box

You should see a new collection called "MEAN Demo". Have fun.

Start the frontend server

This section of the code is a separate static site that consumes the data API created in backend.

You can run it by serving up the assets in frontend/app in a simple HTTP server, such as http-server.

npm install http-server -g # one-time only
cd frontend/app
http-server -p 3000 # default port is 8080

Now you can access the demo at http://localhost:3000

Directory Structure

The following is a quick orientation to the salient structural features of this application

/backend                  - the node-express-mongo data server
   /bin/www               - the launch point for the server
   /dataservice           - the in-memory and MongoDb data services
   /public                - static client assets ... there are none as this is a data server
   /routes                - the router for the data api
   API Requirements.md    - the "original" requirements for the data api
   app.js                 - the express server
   Postman_MEAN_Demo.json - Postman request collection, helpful in api exploration
   Tutorial.md            - How to build the backend from scratch

/frontend                 - the client application written with angular 

About

No description, website, or topics provided.

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Contributors 4

  •  
  •  
  •  
  •