Sign In Start Free Trial

Angular 6 for Enterprise-Ready Web Applications

By : Doguhan Uluca

3.8 (23)

Angular 6 for Enterprise-Ready Web Applications

3.8 (23)

By: Doguhan Uluca

Overview of this book

Angular 6 for Enterprise-Ready Web Applications follows a hands-on and minimalist approach demonstrating how to design and architect high quality apps. The first part of the book is about mastering the Angular platform using foundational technologies. You will use the Kanban method to focus on value delivery, communicate design ideas with mock-up tools and build great looking apps with Angular Material. You will become comfortable using CLI tools, understand reactive programming with RxJS, and deploy to the cloud using Docker. The second part of the book will introduce you to the router-first architecture, a seven-step approach to designing and developing mid-to-large line-of-business applications, along with popular recipes. You will learn how to design a solid authentication and authorization experience; explore unit testing, early integration with backend APIs using Swagger and continuous integration using CircleCI. In the concluding chapters, you will provision a highly available cloud infrastructure on AWS and then use Google Analytics to capture user behavior. By the end of this book, you will be familiar with the scope of web development using Angular, Swagger, and Docker, learning patterns and practices to be successful as an individual developer on the web or as a team in the Enterprise.

Preface

Preface

Who this book is for

What this book covers

To get the most out of this book

Get in touch

Free Chapter

Setting Up Your Development Environment

Setting Up Your Development Environment

CLI package managers

Git and GitHub Desktop

Node.js

Visual Studio Code

Automation for Windows and macOS

Summary

Further reading

Create a Local Weather Web Application

Create a Local Weather Web Application

Introduction to Angular

What's new in Angular 6?

Angular in Full-Stack Architecture

Generate your Angular application

Optimizing VS Code for Angular

Planning a feature road map using Waffle

Crafting UI elements using components and interfaces

Using Angular Services and HttpClient to retrieve data

Transform data using RxJS

Summary

Prepare Angular App for Production Release

Prepare Angular App for Production Release

Angular unit tests

Angular e2e tests

Troubleshooting common Angular errors

Null guarding in Angular

Containerizing the app using Docker

Deploying containerized app

Summary

Staying Up to Date with Angular Updates

Staying Up to Date with Angular Updates

A brief history of web frameworks

Updating Node

Updating npm and Global npm packages

Updating Angular

Testing performance

Addressing security vulnerabilities

Updating your web server

Updating Docker image

Summary

Enhance Angular App with Angular Material

Enhance Angular App with Angular Material

Angular Material

Angular Material setup and performance

Angular Flex Layout

Adding Material Components to your app

Updating unit tests

Custom themes

Updating Angular Material

Summary

Reactive Forms and Component Interaction

Reactive Forms and Component Interaction

Interactive prototype

Searching with user input

Enabling component interaction

Summary

Create a Router-First Line-of-Business App

Create a Router-First Line-of-Business App

Angular cheat sheet

Router-first architecture

Creating LemonMart

Designing LemonMart

Generating router-enabled modules

Designing the home route

Branding, Custom, and Material Icons

Angular Augury

Submodules with lazy loading

Completing the walking skeleton

Common Testing Module

Summary

Continuous Integration and API Design

Continuous Integration and API Design

Continuous Integration

API design

Summary

Design Authentication and Authorization

Design Authentication and Authorization

Wrapping up mock-ups

Design authentication and authorization workflow

UI service

Role-based routing after login

Auth Service Fake and Common Testing Providers

Summary

Angular App Design and Recipes

Angular App Design and Recipes

User class and object-oriented programming

Reusing components

User service with caching, GET and POST

User profile with multi-step auth-enabled responsive forms

Resolve guard

Reusable component with binding and route data

Master/detail view auxiliary routes

Data table with pagination

Updating Unit Tests

Summary

Highly-Available Cloud Infrastructure on AWS

Highly-Available Cloud Infrastructure on AWS

Creating a secure AWS account

Right-sizing infrastructure

Deploy to AWS ECS Fargate

AWS Billing

Summary

Google Analytics and Advanced Cloud Ops

Google Analytics and Advanced Cloud Ops

Collecting Analytics

Budgeting and scaling

Advanced load testing

Reliable Cloud Scaling

Measuring actual use

Summary

Other Books You May Enjoy

Other Books You May Enjoy

Leave a review - let other readers know what you think

Customer Reviews

3.8 (23)

5 star

56.5%

4 star

8.7%

3 star

8.7%

2 star

13%

1 star

13%

Crafting UI elements using components and interfaces

You will be leveraging Angular components, interfaces, and services to build the current weather feature in a decoupled, cohesive, and encapsulated manner.

The landing page of an Angular app, by default, resides in app.component.html. So, start by editing the template of AppComponent with rudimentary HTML, laying out the initial landing experience for the application.

We are now beginning the development of Feature 1: Display Current Location weather information for the current day, so, you can move the card in Waffle to the In Progress column.

We will add a header as an h1 tag, followed by the tagline of our app as a div and placeholders for where we may want to display the current weather, as demonstrated as shown in the following code block:

src/app/app.component.html
<div style="text-align:center">
  &lt...

Search

Your notes and bookmarks