MEAN Cookbook

MEAN Cookbook

by Nicholas McClay
Released September 2017
Publisher(s): Packt Publishing
ISBN: 9781787286573

Read it now on the O’Reilly learning platform with a 10-day free trial.

O’Reilly members get unlimited access to books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.

Start your free trial

Book description

Over 50 recipes to create full-stack high-performance web applications using pure JavaScript and the MEAN stack.

About This Book
  • Architect a fully functional stand-alone web application, including the web server, database, and front-end web application
  • Improve the performance and maintainability of your MEAN stack application with tips for configuration and optimization
  • Highlights MEAN Stack best practices when working with your application
Who This Book Is For

If you are a JavaScript developer who wants to create high-performing, modern web applications with the MEAN stack, this is the book for you. Web developers familiar with some parts of the MEAN stack will find this a comprehensive guide to fleshing out the other technologies and skills they need to build all JavaScript web applications. Developers interested in transitioning from other web application stacks to an all-JavaScript environment will find a wealth of information about how to work in a MEAN stack environment.

To get the most from this book, you should have a general understanding of web servers and web applications. You are expected to have a basic understanding of running JavaScript, both in a web browser and outside it, using Node.js and the NPM package manager.

What You Will Learn
  • Bootstrap a new MEAN stack web application using Node.js and Express
  • Build a single-page application (SPA) with Angular and Angular-CLI
  • Improve browser performance by optimizing your web application resources using Webpack
  • Model complex JSON object relationships in MongoDB using Mongoose
  • Debug all the layers of a MEAN stack application, including working with source maps
  • Build Restful APIs using Express.js and JSON Web Token (JWT) for user authentication
  • Use automated testing to improve the reliability and quality of your MEAN stack application
In Detail

The MEAN Stack is a framework for web application development using JavaScript-based technologies; MongoDB, Express, Angular, and Node.js. If you want to expand your understanding of using JavaScript to produce a fully functional standalone web application, including the web server, user interface, and database, then this book can help guide you through that transition. This book begins by configuring the frontend of the MEAN stack web application using the Angular JavaScript framework. We then implement common user interface enhancements before moving on to configuring the server layer of our MEAN stack web application using Express for our backend APIs. You will learn to configure the database layer of your MEAN stack web application using MongoDB and the Mongoose framework, including modeling relationships between documents. You will explore advanced topics such as optimizing your web application using WebPack as well as the use of automated testing with the Mocha and Chai frameworks. By the end of the book, you should have acquired a level of proficiency that allows you to confidently build a full production-ready and scalable MEAN stack application.

Style and Approach

This book is a guide of MEAN Stack specific solutions to common web application problems and includes in-depth guides for each layer of the application stack. Readers looking to upgrade their MEAN Stack web application will find recipes within to help them transition.

Publisher resources

Download Example Code

Table of contents

  1. Preface
    1. What this book covers
    2. What you need for this book
    3. Who this book is for
    4. Sections
      1. Getting ready
      2. How to do it…
      3. How it works…
      4. There's more…
    5. Conventions
    6. Reader feedback
    7. Customer support
      1. Downloading the example code
      2. Downloading the color images of this book
      3. Errata
      4. Piracy
      5. Questions
  2. Working with Angular 4
    1. Introduction
    2. Upgrading to Angular 4 using NPM
      1. Getting ready
      2. How to do it...
      3. How it works...
      4. There’s more…
        1. Taking advantage of optional dependencies
        2. Peer dependency warnings after upgrade
    3. Generating a new Angular project using Angular-CLI
      1. Getting ready
      2. How to do it...
      3. How it works...
      4. There's more...
        1. Tips for resolving port collision
    4. Configuring Angular-CLI project settings
      1. How to do it...
    5. Working with generators in Angular-CLI
      1. How to do it...
      2. How it works...
      3. There's more...
    6. Ejecting Angular-CLI from your project
      1. Getting ready
      2. How to do it...
      3. How it works...
    7. Generating new routes in Angular-CLI
      1. Getting ready
      2. How to do it...
      3. How its works...
    8. Defining a home page in your Angular routes
      1. How to do it...
      2. How it works...
      3. There's more...
    9. Handling 404 errors in an Angular project
      1. How to do it...
      2. How it works...
    10. Creating nesting routes in Angular
      1. Getting ready
      2. How to do it...
      3. How it works...
    11. Creating sibling routes in Angular
      1. How to do it...
      2. How it works...
      3. There's more...
    12. Programmatic page redirection in Angular
      1. How to do it...
      2. How it works...
    13. Route preloading with Angular modules
      1. Getting ready
      2. How to do it...
      3. How it works...
    14. Running tests in Angular-CLI
      1. How to do it...
      2. How it works...
  3. Enhancing Your User Interface
    1. Introduction
    2. Configuring Sass in Angular
      1. Getting ready
      2. How to do it...
      3. How it works...
      4. There's more...
    3. Working with Angular component styles
      1. How to do it...
      2. How it works...
    4. Using Sass variables for style reusability
      1. How to do it...
      2. How it works...
      3. There's more...
    5. Using Sass nesting for better style specificity
      1. Getting ready
      2. How to do it...
      3. How it works...
      4. There's more...
    6. Using Sass partials for style organization
      1. Getting ready
      2. How to do it...
      3. How it works...
      4. There's more...
    7. Working with Bootstrap in Sass
      1. How to do it...
      2. How it works...
      3. There's more...
    8. Customizing Bootstrap for Angular
      1. Getting ready
      2. How to do it...
      3. How it works...
      4. There's more...
    9. Using Bootstrap Responsive layouts
      1. Getting ready
      2. How to do it...
      3. How it works...
      4. There's more...
    10. Working with Bootstrap components in Angular
      1. Getting ready
      2. How to do it...
      3. How it works...
      4. There's more...
    11. Working with Font-Awesome icons in Angular
      1. Getting ready
      2. How to do it...
      3. How it works...
      4. There's more...
    12. Internationalization with Angular i18n
      1. Getting ready
      2. How to do it...
      3. How it works...
      4. There's more...
    13. Setting your language with Angular i18n
      1. Getting ready
      2. How to do it...
      3. How it works...
      4. There's more...
    14. How to Localize dates in Angular
      1. How to do it...
      2. How it works...
      3. There's more...
  4. Working with Data
    1. Introduction
    2. Working with actions and events in Angular
      1. Getting ready
      2. How to do it...
      3. How it works...
      4. There's more...
    3. Working with form input and models in Angular
      1. Getting Ready
      2. How to do it...
      3. How it works...
      4. There's more...
    4. Validating data with Angular form properties
      1. Getting Ready
      2. How to do it...
      3. How it works...
      4. There's more...
    5. Creating services for data in Angular
      1. Getting ready
      2. How to do it...
      3. How it works...
      4. There's more...
    6. Using promises to create asynchronous services in Angular
      1. Getting ready
      2. How to do it...
      3. How it works...
      4. There's more...
    7. Retrieving API data using HTTP services in Angular
      1. Getting ready
      2. How to do it...
      3. How it works...
      4. There's more...
    8. Querying API sources using HTTP services in Angular
      1. Getting ready
      2. How to do it...
      3. How it works...
      4. There's more...
    9. Creating Concurrent API requests in Angular
      1. Getting ready
      2. How to do it...
      3. How it works...
    10. Handling API errors and invalid responses in Angular
      1. Getting ready
      2. How to do it...
    11. HTTP service optimization through client-side caching
      1. Getting Ready
      2. How to do it...
      3. How it works...
  5. Using Express Web Server
    1. Introduction
    2. Creating a new Express project with express-generator
      1. Getting ready
      2. How to do it...
      3. How it works...
      4. There's more...
    3. Working with routes in Express
      1. Getting ready
      2. How to do it...
      3. How it works...
      4. There's more...
    4. Serving an Angular web application with Express
      1. Getting ready
      2. How to do it...
      3. How it works...
      4. There's more...
    5. Working with headers in Express
      1. Getting ready
      2. How to do it...
      3. How it works...
      4. There's more...
    6. Working with cookies in Express
      1. Getting ready
      2. How to do it...
      3. How it works...
      4. There's more...
    7. Creating Express middleware for routes
      1. Getting ready
      2. How to do it...
      3. How it works...
      4. There's more...
    8. Logging traffic and activity with Morgan
      1. Getting Ready
      2. How to do it...
      3. How it works...
      4. There's more...
    9. Running your Express web server with Forever
      1. Getting ready
      2. How to do it...
      3. How it works...
      4. There's more...
    10. Securing your Express web server
      1. Getting ready
      2. How to do it...
      3. How it works...
  6. REST APIs and Authentication
    1. Introduction
    2. Building REST APIs with Express
      1. Getting ready
      2. How to do it...
      3. How it works...
      4. There's more...
    3. Configuring JSON API in Express
      1. Getting ready
      2. How to do it...
      3. How it works...
      4. There's more...
    4. Creating a user authentication API in Express
      1. Getting ready
      2. How to do it...
      3. How it works...
      4. There's more...
    5. Building a login page with Angular
      1. Getting ready
      2. How to do it...
      3. How it works...
      4. There's more...
    6. Using JWT authentication with Express and Angular
      1. Getting ready
      2. How to do it...
      3. How it works...
  7. Cloud Service Integrations
    1. Introduction
    2. Uploading large multi-part files with Express
      1. Getting ready
      2. How to do it...
      3. How it works...
      4. There's more...
    3. Uploading images to Cloudinary from Express
      1. Getting ready
      2. How to do it...
      3. How it works...
      4. There's more...
    4. Securing image downloads from Cloudinary
      1. Getting ready
      2. How to do it...
      3. How it works...
      4. There's more...
    5. Resizing images and transformations with Cloudinary
      1. Getting ready
      2. How to do it...
      3. How it works...
      4. There's more...
    6. Working with Stripe payment processor in Express
      1. Getting ready
      2. How to do it...
      3. How it works...
    7. Accepting credit card payments in Angular with Stripe
      1. Getting ready
      2. How to do it...
      3. How it works...
  8. MongoDB and Mongoose
    1. Introduction
    2. How to set up and create a MongoDB database
      1. Getting ready
      2. How to do it...
      3. How it works...
        1. Mongo shell commands
      4. There's more...
    3. Connecting to MongoDB through Mongoose
      1. Getting ready
      2. How to do it...
      3. How it works...
      4. There's more...
    4. Working with data model in MongoDB and Mongoose
      1. How to do it...
      2. How it works...
        1. Mongoose Model API
        2. Mongoose Document API
      3. There's more...
    5. Querying for data using Mongoose query selectors
      1. How to do it...
      2. How it works...
        1. Mongoose Query API
      3. There's more...
  9. Relationships
    1. Introduction
    2. Working with data validations and virtuals in Mongoose
      1. Getting ready
      2. How to do it...
      3. How it works...
        1. SchemaTypes API
      4. There's more...
    3. Creating sub-documents in Mongoose models
      1. Getting ready
      2. How to do it...
      3. How it works...
    4. Using pre-save hooks and custom methods in Mongoose Models
      1. Getting ready
      2. How to do it...
      3. How it works...
    5. Creating embedded documents in MongoDB with objectId
      1. Getting ready
      2. How to do it...
      3. How it works...
    6. Creating relational documents in MongoDB with population
      1. Getting ready
      2. How to do it...
      3. How it works...
      4. There's more...
        1. Document API
  10. Build Systems and Optimizations
    1. Introduction
    2. Using ES6 and Typescript with Express.js and Node.js
      1. Getting ready
      2. How to do it...
      3. How it works...
      4. There's more...
    3. Configuring WebPack for use in Node.js applications
      1. Getting ready
      2. How to do it...
      3. How it works...
      4. There's more...
    4. Optimizing asset delivery with gzip compression in Express
      1. Getting ready
      2. How to do it...
      3. How it works...
      4. There's more...
    5. Optimizing images for delivery with WebPack
      1. Getting ready
      2. How to do it...
      3. How it works...
      4. There's more...
    6. Optimizing Font-Awesome with custom font generation
      1. Getting ready
      2. How to do it...
      3. How it works...
      4. There's more...
  11. Debugging
    1. Introduction
    2. Debugging Node.js using the debug module
      1. Getting ready
      2. How to do it...
      3. How it works...
      4. There's more...
    3. Debugging Node.js using node-inspector in Google Chrome
      1. Getting ready
      2. How to do it...
      3. How it works...
      4. There's more...
    4. Debugging Node.js using JetBrain's WebStorm IDE
      1. Getting ready
      2. How to do it...
      3. How it works...
    5. Production error tracking and debugging with Sentry.io
      1. Getting ready
      2. How to do it...
      3. How it works...
      4. There's more...
  12. Automated Testing
    1. Introduction
    2. Creating unit tests for Node.js using the Mocha testing library
      1. Getting ready
      2. How to do it...
      3. How it works...
      4. There's more...
    3. Creating integration tests for Express REST APIs
      1. Getting ready
      2. How to do it...
      3. How it works...
      4. There's more...
    4. Integrating an ESLint test suite into your Mocha tests
      1. Getting ready
      2. How to do it...
      3. How it works...
      4. There's more...
    5. Cross-browser and device testing with BrowserSync
      1. Getting ready
      2. How to do it...
      3. How it works...
      4. There's more...
  13. Whats new in Angular 4
    1. Angular 4 Improvements and New Features
      1. Packaging and Modules
      2. A newly optimized view engine
      3. Added TypeScript 2.2 support
      4. ngIf directive added support for else statements
      5. Support for assigning local variables
      6. New email form input validator directive
      7. Source maps for generated templates
    2. Angular 4 Deprecations and API Changes
      1. Template tags and attributes have been deprecated
      2. Animations are now an optional library
      3. ngFor class is deprecated
      4. Renderer class is deprecated
      5. Component lifecycle hooks are now interfaces

Product information

  • Title: MEAN Cookbook
  • Author(s): Nicholas McClay
  • Release date: September 2017
  • Publisher(s): Packt Publishing
  • ISBN: 9781787286573