Development

Introduction to the MEAN Stack [video]

6 Comments

At Smashing Boxes, we encourage our developers to teach the rest of our team about trending technologies, innovative concepts, and new workflows that they are interested in or testing out. Twice a month, our developers all gather together at lunch to learn about a new topic, we called them Lunch and Learns (catchy right?). We wanted to show the world how awesome our developers and share their knowledge with you by making these Lunch and Learns G+ Hangouts on Air.

Yesterday we had one of our front-end developers, Biko Tushinde, discuss a new workflow that uses JavaScript to make web applications quickly. The MEAN stack (MongoDB, ExpressJS, AngularJS and Node.js)  has been gaining popularity with the hackathon crowd for some time now, owing to the flexibility and ease of development that an all-Javascript stack brings. In this talk Biko takes a look at one possible MEAN configuration that uses Grunt to compile static assets and manage the build process.

The embedded YouTube video contains Biko’s demonstration of the MEAN stack. Watch the video to learn more about the emerging workflow and if you have any questions for Biko, feel free to leave him a comment below.

MEAN Stack:

MongoDB is a database that uses JSON-style documents to represent data, making it well-suited for use with Javascript.

ExpressJS is a web application framework that gives a lot of helpful components and modules for the common task associated with building a website.

AngularJS is a frontend framework by Google for architecting complex Javascript client-side applications with modular code and data-binding UI.

Node.js is a concurrent Javascript environment (based off of V8) for building scalable Web applications.

Tools:

NPM – Node Package Manager, used to download and install Node modules per project or globally

Bower – front-end package manager made by Twitter. Installs and manages versions for front-end libraries like Angular, jQuery and Bootstrap.

Grunt – a Javascript task runner. Extensible via a large community of Grunt plugins.

Precompiled Assets

These are optional depending on your development process. Node has support for various compiled assets but in this demo they are being compiled by Grunt and served statically.

Coffeescript – compiles to Javascript

Stylus – compiles to CSS

Jade – compiles to HTML

To download the repo visit : https://github.com/btushinde/mean-stack-demo

Create your free online surveys with SurveyMonkey , the world’s leading questionnaire tool.

| | |

6 Responses

  1. […] Introduction to the MEAN stack [SmashingBoxes] […]

  2. Nice video! (All Hangouts glitches not-withstanding :) — totally non-technical question: what’s the theme you’re using for Sublime Text? I like it!

  3. Jinto Jose says:

    Hi,

    Nice video. Would you please share the source code also

    Thanks

Leave a Reply