Learning Web Development with the MEAN Stack

Discover the MEAN stack for web development to create powerful, enterprise-scale applications
2.4 (10 ratings)
Instead of using a simple lifetime average, Udemy calculates a
course's star rating by considering a number of different factors
such as the number of ratings, the age of ratings, and the
likelihood of fraudulent ratings.
124 students enrolled
80% off
Take This Course
  • Lectures 39
  • Length 3 hours
  • Skill Level Beginner Level
  • Languages English
  • Includes Lifetime access
    30 day money back guarantee!
    Available on iOS and Android
    Certificate of Completion
Wishlisted Wishlist

How taking a course works


Find online courses made by experts from around the world.


Take your courses with you and learn anywhere, anytime.


Learn and practice real-world skills and achieve your goals.

About This Course

Published 10/2015 English

Course Description

MEAN is the now famously known combination of MongoDB, ExpressJS, AngularJS, and NodeJS, which has emerged as one of the leading technology stacks for developing dynamic web applications. The MEAN stack simplifies development and promotes team cohesion by allowing applications to be written and maintained entirely in JavaScript, on the frontend, and backend.

This course focuses on the full-stack MEAN development process and goes in-depth by incorporating a supporting architecture with Grunt and integrating automated testing. It will walk you through building a real, enterprise-grade application.

Starting out with the fundamentals of the MEAN stack technologies, you will learn how to build a strong solution architecture for automated builds and distributed development. You’ll then dive deep into Grunt, Bower, and npm to become a full-stack MEAN engineer. You will discover how to build one-to-many relationships using arrays of objects in Mongoose. Diving even deeper, you’ll meet new technologies such as D3, which will help you to build graphs for an enterprise dashboard. Then, we will test our Node and Angular applications with Karma, Jasmine, Mocha, and Chai.

By the end, you’ll be able to build a powerful, MEAN-backed application for working in a distributed team.

About The Author

Michael Perrenoud is a veteran enterprise application engineer with more than 15 years of experience architecting and building full-stack solutions for small businesses and Fortune 500 companies. He’s mentored literally hundreds of engineers across the world on the MEAN stack and more. He is the CEO and Founder of Consult with Mike, LLC and provides thousands of dollars in free resources in the form of blog posts on his site today.

He also has an e-book coming out soon, MEAN with Mike, which is a composition of hundreds of hours of mentorship. It’s a true, long-term, learning course that is meant to build problem solvers.

What are the requirements?

  • You just need to brush up on JavaScript and NoSQL and you’re good to go!

What am I going to get from this course?

  • Leverage existing third-party libraries using npm and bower.
  • Develop an Angular application without a Node backend
  • Build graphs for the dashboard of our enterprise application with d3.
  • Create your own Node modules using npm
  • Utilize Mongoose to manage your data in Mongo and build complex pipelined queries.
  • Test your Node and Angular applications with Grunt, Mocha and Jasmine
  • Use Grunt for automation and streamlined development.

Who is the target audience?

  • If you’re just starting out on the MEAN stack or you’ve gotten started with a template generator, this video course will broaden your horizons.

What you get with this course?

Not for you? No problem.
30 day money back guarantee.

Forever yours.
Lifetime access.

Learn on the go.
Desktop, iOS and Android.

Get rewarded.
Certificate of completion.


Section 1: Peering Down on Meanville

There is a lot of information out there about the MEAN stack. Let’s bring it all together, giftwrap it, and deliver a real-world application.


The acronym is catchy but undescriptive. Let’s break each letter down and demystify the stack.


We need an editor, one that is going to provide us with great assistance. WebStorm is going to be that editor.


We need to download the libraries we depend on. We also need to be able to distribute them to production. The tools npm, Bower, and Grunt are going to make that possible.


We need to build an automated testing scenario, for both Angular and Node. Karma, Jasmin, Mocha, and Chai are going to make that happen.


Having the tools in the toolbox is great; using them is another story. Let’s use them in some practical examples.


A necessary foundation has been laid, but an entire example hasn't. Let’s build the quintessential Hello, World! application and put it all together.

Section 2: You’re a MEAN One!

Before building an application we need to understand what we are building. Generally, this is where you’d get an introduction from the customer, but we have a complete application to look at.


While it’s nice to have an API to work against, this is not always possible. With AngularJS, however, this isn’t a problem; we can fake that data to make sure that we are ready for the API.


One of the things that have to be considered is what’s displayed when no data is available. Building the dashboard skeleton before faking all of the data will allow us to do that.


Let’s get started adding data. The components we build here are really going to be the meat and potatoes of any enterprise application.


Adding a customer is awesome. However, we need to know how to list customers so that newly added ones can be seen and edited.

Section 3: Building the Sled

Listing data is great, but a database is no good if you can’t edit it. Let’s walk through how we might edit a customer record.


Having a list of customers is great, but we need to be able to sell them products and keep track of those sales.


Often, we will need to be able to list all the sales for a customer. There are a lot of ways to do this, but I’m going to leverage a child state and a one-to-many view.


Sometimes, there is something missed on a sale, so we need to edit it, such as the shipping address.


Most of the times, a standard control is good enough for input, but there are times when we need something more complex. Angular Bootstrap provides some of this.

Section 4: Unwrapping the Presents

There are times when you need a specific set of data to test something that will grow over time. A dashboard is perfect here.


There are also times when you’ll need to build visual aids for the management or analysts. Graphs are the quintessential visual aid


Let’s list all unfulfilled orders in the system on the dashboard.


Let’s list all recent orders on the dashboard.

Section 5: Loading the Presents onto the Sled

Let’s get to the other side of the stack and start building the server-side pieces. The first part is building our Mongoose models.


We know every endpoint that we need. Let’s build those endpoints in ExpressJS.


We have the endpoints set up on the server side. Now let’s talk about getting out of the mock data and going end-to-end.


We have a full stack. Let’s now add a customer to the database for real.


Let’s add a sale to customer

Section 6: Up to the Mountain — Testing the Stack

We want to make sure that all the routes exist that are published. Let’s test them.


We want to make sure that the API works as expected, so we will build tests for all endpoints.


We now want to make sure that we are handling every part of the API, so let’s test it.


We need to make sure that the controllers are behaving as expected, so let’s test them.


Services need to provide exactly what they publish, so let’s test them as well.

Section 7: A Change of Heart – Deploying Your Application

We need to build a distribution package. However, we need concatenation and uglification. Let’s count on Grunt to do this for us.


We need a place to deploy our code. Let’s look up to Heroku for that.


We need a database, off-premise, that is used for production. Let’s use a Heroku add-on for that.


We have different settings in production, for some things, as against development. Let’s add some environment variables to Heroku for this.


We need to see what our application looks like in production. Let’s launch our newly deployed Heroku application.

Section 8: A Change in Tools

There are some helpful plugins for Sublime that will make it easier; let’s review those.


This is a different tool set, so we need to review how we might use it differently compared to WebStorm.


There are some caveats to using Sublime over WebStorm, and so we’ll review those.

Students Who Viewed This Course Also Viewed

  • Loading
  • Loading
  • Loading

Instructor Biography

Packt Publishing, Tech Knowledge in Motion

Packt has been committed to developer learning since 2004. A lot has changed in software since then - but Packt has remained responsive to these changes, continuing to look forward at the trends and tools defining the way we work and live. And how to put them to work.

With an extensive library of content - more than 4000 books and video courses -Packt's mission is to help developers stay relevant in a rapidly changing world. From new web frameworks and programming languages, to cutting edge data analytics, and DevOps, Packt takes software professionals in every field to what's important to them now.

From skills that will help you to develop and future proof your career to immediate solutions to every day tech challenges, Packt is a go-to resource to make you a better, smarter developer.

Packt Udemy courses continue this tradition, bringing you comprehensive yet concise video courses straight from the experts.

Ready to start learning?
Take This Course