product iamge

Learning Angular: A no-nonsense beginner's guide to building web applications with Angular 10 and TypeScript

This document was uploaded by one of our users. The uploader already confirmed that they had the permission to publish it. If you are author/publisher or own the copyright of this documents, please report to us by using this DMCA report form.

Download
Search on Amazon

Simply click on the Download Book button.

Yes, Book downloads on Ebookily are 100% Free.

Sometimes the book is free on Amazon As well, so go ahead and hit "Search on Amazon"

Uncover Angular's potential for creating enterprise web applications―from setting up the environment to deployment―with the help of expert guidance, step-by-step explanations, and hands-on exercises

Key Features

  • Learn the fundamentals of Angular to build web applications using TypeScript
  • Explore the basics of Angular development, from components and templates to forms and services
  • Discover best practices for building, packaging, and testing Angular applications

Book Description

Angular, loved by millions of web developers around the world, continues to be one of the top JavaScript frameworks thanks to its regular updates and new features that enable fast, cross-platform, and secure frontend web development. With Angular, you can achieve high performance using the latest web techniques and extensive integration with web tools and integrated development environments (IDEs).

Updated to Angular 10, this third edition of the Learning Angular book covers new features and modern web development practices to address the current frontend web development landscape. If you are new to Angular, this book will give you a comprehensive introduction to help you get you up and running in no time. You'll learn how to develop apps by harnessing the power of the Angular command-line interface (CLI), write unit tests, style your apps by following the Material Design guidelines, and finally deploy them to a hosting provider. The book is especially useful for beginners to get to grips with the bare bones of the framework needed to start developing Angular apps.

By the end of this book, you'll not only be able to create Angular applications with TypeScript from scratch but also enhance your coding skills with best practices.

What you will learn

  • Use the Angular CLI to scaffold, build, and deploy a new Angular application
  • Build components, the basic building blocks of an Angular application
  • Discover techniques to make Angular components interact with each other
  • Understand the different types of templates supported by Angular
  • Create HTTP data services to access APIs and provide data to components
  • Enhance your application's UX with Angular Material
  • Apply best practices and coding conventions to your large-scale web development projects

Who this book is for

The Angular TypeScript book is for JavaScript and full-stack developers who want to enter the world of frontend development with Angular or migrate to the Angular framework to build professional web applications. Familiarity with web and programming concepts will assist with understanding the content covered in the book.

Table of Contents

  1. Building Your First Angular App
  2. Introduction to TypeScript
  3. Component Interaction and Inter-Communication
  4. Enhance components with Pipes and Directives
  5. Structure an Angular App
  6. Enrich Components with Asynchronous Data Services
  7. Navigate through Components with Routing
  8. Orchestrating Validation Experiences in Forms
  9. Introduction to Angular Material
  10. Give motion to components with animations
  11. Unit test an Angular App
  12. Bringing an Angular App to Production
  13. Develop a Real-World Angular App

Author(s): Aristeidis Bampakos, Pablo Deeleman
Edition: 3rd Revised
Publisher: Packt Publishing
Year: 2020

Language: English
Commentary: True PDF
Pages: 430

Cover
Copyright
About PACKT
Contributors
Table of Contents
Preface
Section 1 – Getting Started with Angular
Chapter 1: Building Your First Angular App
Technical requirements
It's just Angular – introducing semantic versioning
Patch change
Minor change
Major change
What about Angular?
Introducing Angular
Setting up our workspace with Angular CLI 10
Prerequisites
Installing Angular CLI
CLI commands
Creating a new project
Hello Angular 10
Components
Modules
Selector
Template
Bootstrapping
IDEs and plugins
Atom
Sublime Text
WebStorm
Visual Studio Code
Summary
Chapter 2: Introduction to TypeScript
The history of TypeScript
The benefits of TypeScript
Introducing TypeScript resources
Types in TypeScript 3.9
String
Declaring variables
Number
Boolean
Array
Dynamic typing with any type
Custom types
Enum
Void
Type inference
Functions, lambdas, and execution flow
Annotating types in our functions
Function parameters in TypeScript
Arrow functions
Common TypeScript features
Spread parameter
Template strings
Generics
Classes, interfaces, and inheritance
Anatomy of a class
Constructor parameters with accessors
Interfaces
Class inheritance
Decorators in TypeScript 3.9
Class decorators
Property decorators
Method decorators
Parameter decorator
Advanced types
Partial
Record
Union
Nullable
Modules
Summary
Section 2 – Components – the Basic Building Blocks of an Angular App
Chapter 3: Component Interaction and Inter-Communication
Technical requirements
Creating our first component
Component file creation
Module registration
Configuring a component
Interacting with the template
Displaying data from the component
Applying styles to the template
Getting data from the template
Communicating with other components
Passing data using input binding
Listening for events using output binding
Local references in templates
Encapsulating CSS styling
Change detection strategies
Introducing the component lifecycle
Performing component initialization
Cleaning up resources
Detecting input changes
Summary
Chapter 4: Enhance Components with Pipes and Directives
Technical requirements
Introducing directives
Transforming elements using directives
Displaying data conditionally
Iterating through data
Switching through templates
Manipulating data with pipes
Building custom pipes
Sorting data using pipes
Change detection with pipes
Building custom directives
Displaying dynamic data
Property binding and responding to events
Toggling templates dynamically
Summary
Chapter 5: Structure an Angular App
Technical requirements
Organizing components into modules
Introducing Angular modules
Creating your first module
Registering components with a module
Exposing module features
Extending functionality with modules
Configuring the application
Configuring the workspace
Developing the application
Configuring the environment
How dependency injection works in Angular
Delegating complex tasks to services
Providing dependencies across the application
Injecting dependencies into the component tree
Overriding providers in the injector hierarchy
Summary
Chapter 6: Enrich Components with Asynchronous Data Services
Technical requirements
Strategies for handling asynchronous information
Shifting from callback hell to promises
Observables in a nutshell
Reactive functional programming in Angular
The RxJS library
Creating a backend API-the Angular way
Communicating data over HTTP
Introducing the Angular HTTP client
Handling data with CRUD in Angular
Authenticating with HTTP
Handling HTTP errors
Unsubscribing from observables
Destroying a component
Using the async pipe
Summary
Section 3 – User Experience and Testability
Chapter 7: Navigate through Components with Routing
Technical requirements
Introducing the Angular router
Specifying a base path
Importing the router module
Configuring the router
Rendering components
Creating an Angular app with routing
Scaffolding an Angular 10 app with routing
Adding route configuration to our Angular app
Navigating to application routes
Separating our app into feature routing modules
Handling unknown route paths
Setting a default path
Navigating imperatively to a route
Decorating router links with styling
Passing parameters to routes
Building a detail page using route parameters
Reusing components using child routes
Taking a snapshot of route parameters
Filtering data using query parameters
Enhancing navigation with advanced features
Controlling route access
Preventing navigation away from a route
Preloading route data
Lazy loading routes
Debugging route configuration
Summary
Chapter 8: Orchestrating Validation Experiences in Forms
Technical requirements
Introducing forms to web apps
Data binding with template-driven forms
Using reactive patterns in Angular forms
Turning a template-driven form into a reactive one
Providing status feedback
Creating nesting form hierarchies
Validating controls in a reactive way
Modifying forms dynamically
Creating elegant reactive forms
Building a custom validator
Manipulating form data
Watching state changes and being reactive 
Summary
Chapter 9: Introduction to Angular Material 10
Technical requirements
Introducing Material Design
Known implementations
Introducing Angular Material
Creating your first Angular Material 10 app
Adding Angular Material controls
Theming Angular Material components
Adding core UI controls
Buttons
Form controls
Navigation
Layout
Popups and modals
Data table
Introducing the Angular CDK
Clipboard
Drag and drop
Designing layouts using flexbox
Summary
Chapter 10: Giving Motion to Components with Animations
Technical requirements
Creating animations with plain vanilla CSS
Introducing Angular animations
Creating our first animation
Animation callbacks
Animating components programmatically
Creating a reusable animation directive
Summary
Chapter 11: Unit test an Angular App
Technical requirements
Why do we need tests?
The anatomy of a unit test
Introducing unit tests in Angular
Configuring Karma as the test runner
Angular testing utilities
Testing components
Testing with dependencies
Testing with inputs and outputs
Testing services
Testing a synchronous method
Testing an asynchronous method
Testing services with dependencies
Testing pipes
Testing routing
Testing the navigation URL
Testing route parameters 
Testing routes
Testing directives
Testing reactive forms
Summary
Section 4 – Deployment and Practice
Chapter 12: Bringing an Angular App to Production
Technical requirements
Building an Angular 10 app
Limiting the application bundle size
Optimizing the application bundle
Deploying an Angular 10 app
Summary
Chapter 13: Develop a Real-World Angular App
Technical requirements
Scaffolding the application structure
Implementing core features
Persisting data using local storage
Creating a header component
Adding heroes functionality
Adding a new hero
Displaying a list of heroes
Taking actions on a specific hero
Integrating the missions module
Assigning a new mission
Marking a mission as completed
Summary
Other Books You May Enjoy
Index