book

Learning Angular - Third Edition

by Aristeidis Bampakos, Pablo Deeleman

September 2020

Beginner

430 pages

8h 16m

English

Packt Publishing

Read now

Unlock full access

Why subscribe?ContributorsAbout the authorsAbout the reviewerPackt is searching for authors like you
Who this book is forWhat this book coversTo get the most out of this bookDownload the example code filesConventions usedGet in touchReviews
Technical requirementsIt's just Angular – introducing semantic versioningPatch changeMinor changeMajor changeWhat about Angular?Introducing AngularSetting up our workspace with Angular CLIPrerequisitesInstalling Angular CLICLI commandsCreating a new projectHello AngularComponentsModulesSelectorTemplateBootstrappingIDEs and pluginsAtomSublime TextWebStormVisual Studio CodeSummary
The history of TypeScriptThe benefits of TypeScriptIntroducing TypeScript resourcesTypes in TypeScriptStringDeclaring variablesNumberBooleanArrayDynamic typing with any typeCustom typesEnumVoidType inferenceFunctions, lambdas, and execution flowAnnotating types in our functionsFunction parameters in TypeScriptArrow functionsCommon TypeScript featuresSpread parameterTemplate stringsGenericsClasses, interfaces, and inheritanceAnatomy of a classConstructor parameters with accessorsInterfacesClass inheritanceDecorators in TypeScriptClass decoratorsProperty decoratorsMethod decoratorsParameter decoratorAdvanced typesPartialRecordUnionNullableModulesSummary
Technical requirementsCreating our first componentComponent file creationModule registrationConfiguring a componentInteracting with the templateDisplaying data from the componentApplying styles to the templateGetting data from the templateCommunicating with other componentsPassing data using input bindingListening for events using output bindingLocal references in templatesEncapsulating CSS stylingChange detection strategiesIntroducing the component lifecyclePerforming component initializationCleaning up resourcesDetecting input changesSummary
Technical requirementsIntroducing directivesTransforming elements using directivesDisplaying data conditionallyIterating through dataSwitching through templatesManipulating data with pipesBuilding custom pipesSorting data using pipesChange detection with pipesBuilding custom directivesDisplaying dynamic dataProperty binding and responding to eventsToggling templates dynamicallySummary
Technical requirementsOrganizing components into modulesIntroducing Angular modulesCreating your first moduleRegistering components with a moduleExposing module featuresExtending functionality with modulesConfiguring the applicationConfiguring the workspaceDeveloping the applicationConfiguring the environmentHow dependency injection works in AngularDelegating complex tasks to servicesProviding dependencies across the applicationInjecting dependencies into the component treeOverriding providers in the injector hierarchySummary
Technical requirementsStrategies for handling asynchronous informationShifting from callback hell to promisesObservables in a nutshellReactive functional programming in AngularThe RxJS libraryCreating a backend API-the Angular wayCommunicating data over HTTPIntroducing the Angular HTTP clientHandling data with CRUD in AngularAuthenticating with HTTPHandling HTTP errorsUnsubscribing from observablesDestroying a componentUsing the async pipeSummary

Technical requirementsIntroducing the Angular routerSpecifying a base pathImporting the router moduleConfiguring the routerRendering componentsCreating an Angular app with routingScaffolding an Angular app with routingAdding route configuration to our Angular appNavigating to application routesSeparating our app into feature routing modulesHandling unknown route pathsSetting a default pathNavigating imperatively to a routeDecorating router links with stylingPassing parameters to routesBuilding a detail page using route parametersReusing components using child routesTaking a snapshot of route parametersFiltering data using query parametersEnhancing navigation with advanced featuresControlling route accessPreventing navigation away from a routePreloading route dataLazy loading routesDebugging route configurationSummary
Technical requirementsIntroducing forms to web appsData binding with template-driven formsUsing reactive patterns in Angular formsTurning a template-driven form into a reactive oneProviding status feedbackCreating nesting form hierarchiesValidating controls in a reactive wayModifying forms dynamicallyCreating elegant reactive formsBuilding a custom validatorManipulating form dataWatching state changes and being reactiveSummary
Technical requirementsIntroducing Material DesignKnown implementationsIntroducing Angular MaterialCreating your first Angular Material appAdding Angular Material controlsTheming Angular Material componentsAdding core UI controlsButtonsForm controlsNavigationLayoutPopups and modalsData tableIntroducing the Angular CDKClipboardDrag and dropDesigning layouts using flexboxSummary
Technical requirementsCreating animations with plain vanilla CSSIntroducing Angular animationsCreating our first animationAnimation callbacksAnimating components programmaticallyCreating a reusable animation directiveSummary
Technical requirementsWhy do we need tests?The anatomy of a unit testIntroducing unit tests in AngularConfiguring Karma as the test runnerAngular testing utilitiesTesting componentsTesting with dependenciesTesting with inputs and outputsTesting servicesTesting a synchronous methodTesting an asynchronous methodTesting services with dependenciesTesting pipesTesting routingTesting the navigation URLTesting route parametersTesting routesTesting directivesTesting reactive formsSummary
Technical requirementsBuilding an Angular appLimiting the application bundle sizeOptimizing the application bundleDeploying an Angular appSummary
Technical requirementsScaffolding the application structureImplementing core featuresPersisting data using local storageCreating a header componentAdding heroes functionalityAdding a new heroDisplaying a list of heroesTaking actions on a specific heroIntegrating the missions moduleAssigning a new missionMarking a mission as completedSummary
Leave a review - let other readers know what you think

Overview

Learning Angular is a comprehensive beginner's guide to building professional web applications with Angular 10 and TypeScript. By taking you through real-world examples and exercises, this book teaches you the fundamentals of Angular step-by-step.

What this Book will help me do

Gain hands-on experience in Angular by developing a complete web application.
Understand core Angular concepts such as components, templates, and services.
Create modern, user-friendly interfaces with Angular Material and animations.
Learn to implement and manage efficient data flows between your app's components.
Master end-to-end app deployment with robust testing and performance optimization.

Author(s)

Aristeidis Bampakos and Pablo Deeleman are highly experienced experts in frontend development, with a focus on Angular and TypeScript. They bring years of practical knowledge and hands-on experience to this book, ensuring a clear and thorough learning process.

Who is it for?

This book is perfect for software developers, especially those with some JavaScript experience, looking to dive into frontend development using Angular. Beginners seeking structured guidance in Angular and TypeScript will also find it invaluable. It's ideal for professionals aspiring to build scalable, modern web applications with best practices.