AngularJS Web Application Development Blueprints

Book Image

AngularJS Web Application Development Blueprints

By : Vinci J Rufus

Book Image

AngularJS Web Application Development Blueprints

By: Vinci J Rufus

Overview of this book

AngularJS Web Application Development Blueprints

AngularJS Web Application Development Blueprints

Credits

About the Author

About the Author

About the Reviewers

About the Reviewers

www.PacktPub.com

www.PacktPub.com

Preface

Free Chapter

Introduction to AngularJS and the Single Page Application

Introduction to AngularJS and the Single Page Application

Delving into Single Page Apps

Anatomy of a simple AngularJS app

Models and views

Building an Address Book App

Styling the app

Adding contacts to the Address Book

Setting Up Your Rig

Setting Up Your Rig

Setting up Node.js

Setting up Grunt

Yeoman – the workflow tool

Unit testing with Karma

Using Protractor for End-to-End tests

Rapid Prototyping with AngularJS

Rapid Prototyping with AngularJS

Understanding the application that we will Prototype

Introducing Grid Layouts and Bootstrap

Understanding the grid system

Introducing Angular UI

Prototyping the Healthy Living website

Using REST Web Services in Your AngularJS App

Using REST Web Services in Your AngularJS App

Understanding the response from a REST API

Jump starting your app development with Angular Seed

Mark-up our Layout

Creating the routes

Understanding AngularJS services

Writing your first factory service

Using promise for asynchronous calls

Displaying data from the JSON response

Unit testing our application

Mocking $http during Unit testing

Creating a Pinterest style layout

Adding actions to the buttons

Facebook Friends' Birthday Reminder App

Facebook Friends' Birthday Reminder App

Understanding the Facebook SDK

Setting up our project

Delving into AngularJS directives

Adding a Facebook login

Getting the user's friend list

Getting your friends' profile pictures and birthdays

Adding some CSS styles

Adding in the logout link

Writing automated tests

Building an Expense Manager Mobile App

Building an Expense Manager Mobile App

Understanding HTML5 Web Storage

Building the Expense Manager App

Building the Add Expense form

Building a bar chart directive based on D3

Summarizing the expenses by categories

Making the app responsive

Adding touch events

Adding page transitions using ngAnimate

Making the app feel like a native app

Adding additional features

Building a CMS on the MEAN Stack

Building a CMS on the MEAN Stack

Why the MEAN stack?

Getting started with the MEAN stack

Building the server-side app

Securing your admin section

Integrating AngularJS with an ExpressJS project

Generating SEO-friendly URLs using HTML5 mode

Building the admin section for CRUD operations

Building a custom module for global notification

Setting up an Interceptor to detect responses

Building the frontend of our CMS

Displaying the content of a page

Scalable Architecture for Deployments on AWS

Scalable Architecture for Deployments on AWS

Understanding the various services in Amazon AWS

Delving into AWS deployment architectures

Deploying our app in a Server-less Architecture on AWS

Getting your app ready for production deployment

Building an E-Commerce Store

Building an E-Commerce Store

Backend as a Service

Building a BaaS platform on AWS

Creating our e-commerce app

Prototyping our application

Creating our application-level controller

Integrating AWS JS SDK with our application

Building our Add Products page

Creating our product details page

AngularJS Resources

AngularJS Resources

Official resources

Recommended AngularJS modules

Learning resources

Good friends with AngularJS (third-party tools and services)

Core team members and knowledgeable people to follow

Index

Customer Reviews

5 star

0

4 star

0

3 star

0

2 star

0

1 star

0

Introducing Angular UI

Angular UI is a bunch of mini projects that helps you be more productive with your Angular app development. At the time of writing this book, Angular UI consisted of projects discussed in the following sections.

UI-Utils

UI-Utils is a utility package that allows you to add a wide variety of utilities into your application. The utilities are explained as follows:

IE Shiv: This is used to allow support for custom tags in IE8 and below.
jQuery Passthrough: The uiJq directive allows us to use jQuery plugins directly instead of having to create new directives to use them.
Event Binder: This allows you to bind callbacks to events that are not natively supported in AngularJS.
Keypress: This allows you to bind events to a keypress.
Mask: This allows you to mask data based on certain conditions set.
Validate: This allows you to create custom validators and expressions
Reset: This allows you to display an icon or link; if you click on it, the model will become empty.
Scrollfix...