Book description
Discover actionable solutions to everyday problems in building applications with Angular and TypeScript, from app design to production deployment
Key Features
- Explore recipes across core Angular topics to fill gaps in your knowledge of using Angular in production
- Discover industry best practices and tooling to enhance your development experience with Angular
- Understand advanced topics in Angular to help you become a proficient enterprise web developer
Book Description
The Angular framework, powered by Google, is the framework of choice for many web development projects built across varying scales. It’s known to provide much-needed stability and a rich tooling ecosystem for building production-ready web and mobile apps. This recipe-based guide enables you to learn Angular concepts in depth using a step-by-step approach. You’ll explore a wide range of recipes across key tasks in web development that will help you build high-performance apps.
The book starts by taking you through core Angular concepts such as Angular components, directives, and services to get you ready for building frontend web apps. You’ll develop web components with Angular and go on to cover advanced concepts such as dynamic components loading and state management with NgRx for achieving real-time performance. Later chapters will focus on recipes for effectively testing your Angular apps to make them fail-safe, before progressing to techniques for optimizing your app’s performance. Finally, you’ll create Progressive Web Apps (PWA) with Angular to provide an intuitive experience for users.
By the end of this Angular book, you’ll be able to create full-fledged, professional-looking Angular apps and have the skills you need for frontend development, which are crucial for an enterprise Angular developer.
What you will learn
- Gain a better understanding of how components, services, and directives work in Angular
- Understand how to create Progressive Web Apps using Angular from scratch
- Build rich animations and add them to your Angular apps
- Manage your app’s data reactivity using RxJS
- Implement state management for your Angular apps with NgRx
- Optimize the performance of your new and existing web apps
- Write fail-safe unit tests and end-to-end tests for your web apps using Jest and Cypress
- Get familiar with Angular CDK components for designing effective Angular components
Who this book is for
The book is for intermediate-level Angular web developers looking for actionable solutions to common problems in Angular enterprise development. Mobile developers using Angular technologies will also find this book useful. Working experience with JavaScript and TypeScript is necessary to understand the topics covered in this book more effectively.
Table of contents
- Angular Cookbook
- Foreword
- Contributors
- About the author
- About the reviewer
- Preface
-
Chapter 1: Winning Components Communication
- Technical requirements
- Components communication using component @Input(s) and @Output(s)
- Components communication using services
- Using setters for intercepting input property changes
- Using ngOnChanges to intercept input property changes
- Accessing a child component in the parent template via template variables
- Accessing a child component in a parent component class using ViewChild
- Creating your first dynamic component in Angular
-
Chapter 2: Understanding and Using Angular Directives
- Technical requirements
- Using attribute directives to handle the appearance of elements
- Creating a directive to calculate the read time for articles
- Creating a basic directive that allows you to vertically scroll to an element
- Writing your first custom structural directive
- How to use *ngIf and *ngSwitch together
- Enhancing template type checking for your custom directives
- Chapter 3: The Magic of Dependency Injection in Angular
-
Chapter 4: Understanding Angular Animations
- Technical requirements
- Creating your first two-state Angular animation
- Working with multi-state animations
- Creating complex Angular animations using keyframes
- Animating lists in Angular using stagger animations
- Using animation callbacks
- Basic route animations in Angular
- Complex route animations in Angular using keyframes
-
Chapter 5: Angular and RxJS – Awesomeness Combined
- Technical requirements
- Working with RxJS operators using instance methods
- Working with RxJS operators using static methods
- Unsubscribing streams to avoid memory leaks
- Using an Observable with the async pipe to synchronously bind data to your Angular templates
- Using combineLatest to subscribe to multiple streams together
- Using the flatMap operator to create sequential HTTP calls
- Using the switchMap operator to switch the last subscription with a new one
- Debouncing HTTP requests using RxJS
-
Chapter 6: Reactive State Management with NgRx
- Technical requirements
- Creating your first NgRx store with actions and reducer
- Using @ngrx/store-devtools to debug the state changes
- Creating an effect to fetch third-party API data
- Using selectors to fetch data from stores in multiple components
- Using @ngrx/component-store for local state management within a component
- Using @ngrx/router-store to work with route changes reactively
- Chapter 7: Understanding Angular Navigation and Routing
-
Chapter 8: Mastering Angular Forms
- Technical requirements
- Creating your first template-driven Angular form
- Form validation with template-driven forms
- Testing template-driven forms
- Creating your first Reactive form
- Form validation with Reactive forms
- Creating an asynchronous validator function
- Testing Reactive forms
- Using debounce with Reactive form control
- Writing your own custom form control using ControlValueAccessor
-
Chapter 9: Angular and the Angular CDK
- Technical requirements
- Using Virtual Scroll for huge lists
- Keyboard navigation for lists
- Pointy little popovers with the Overlay API
- Using CDK Clipboard to work with the system clipboard
- Using CDK Drag and Drop to move items from one list to another
- Creating a multi-step game with the CDK Stepper API
- Resizing text inputs with the CDK TextField API
-
Chapter 10: Writing Unit Tests in Angular with Jest
- Technical requirements
- Setting up unit tests in Angular with Jest
- Providing global mocks for Jest
- Mocking services using stubs
- Using spies on an injected service in a unit test
- Mocking child components and directives using the ng-mocks package
- Creating even easier component tests with Angular CDK component harnesses
- Unit testing components with Observables
- Chapter 11: E2E Tests in Angular with Cypress
-
Chapter 12: Performance Optimization in Angular
- Technical requirements
- Using OnPush change detection to prune component subtrees
- Detaching the change detector from components
- Running async events outside Angular with runOutsideAngular
- Using trackBy for lists with *ngFor
- Moving heavy computation to pure pipes
- Using web workers for heavy computation
- Using performance budgets for auditing
- Analyzing bundles with webpack-bundle-analyzer
-
Chapter 13: Building PWAs with Angular
- Technical requirements
- Converting an existing Angular app into a PWA with the Angular CLI
- Modifying the theme color for your PWA
- Using Dark Mode in your PWA
- Providing a custom installable experience in your PWA
- Precaching requests using an Angular service worker
- Creating an App Shell for your PWA
- Why subscribe?
- Other Books You May Enjoy
Product information
- Title: Angular Cookbook
- Author(s):
- Release date: August 2021
- Publisher(s): Packt Publishing
- ISBN: 9781838989439
You might also like
book
Angular: Up and Running
If you’re familiar with JavaScript, this hands-on guide will quickly get you up to speed on …
video
Angular (Full App) with Angular Material, Angularfire and NgRx
This course will take you on a journey where you'll you will learn to build a …
book
Angular in Action
Angular in Action teaches you everything you need to build production-ready Angular applications.Thoroughly practical and packed …
book
Learning Angular - Third Edition
Uncover Angular's potential for creating enterprise web applications—from setting up the environment to deployment—with the help …
