Leanpub Header

Skip to main content

Developing with Angular

Practical journey with Angular framework, ES6, TypeScript, Webpack and Angular CLI.

Amazon Kindle: https://www.amazon.com/dp/B07KD9KHQW

Amazon Paperback: https://www.amazon.com/dp/1731123426

Minimum price

$10.00

$30.00

You pay

$30.00

Author earns

$24.00
$

...Or Buy With Credits!

You can get credits monthly with a Reader Membership
PDF
EPUB
WEB
1,752
Readers
476
Pages
About

About

About the Book

This book gives you a broad practical overview of the Angular framework and related modern web technologies. It provides the guidance for the process of web component development that includes Angular and Angular CLI, TypeScript and ES6, applications bundling with Webpack, and other essentials.

Share this book

Author

About the Author

Denys Vuika

More that 16 years of software programming experience. I love coding both during hours and at spare time. Living in London with a beautiful wife and two kids. Working as an applications platform developer at Alfresco, and enjoying Angular, TypeScript, JavaScript and Node.js on a daily basis.

Contents

Table of Contents

Introduction

  1. Book Revision
  2. Book progress
  3. Code examples
  4. Feedback, Bug Reports and Suggestions
  5. Other publications
  6. Testimonials

Prerequisites

  1. Node
  2. Visual Studio Code
  3. Recommended extensions
  4. Hiding files

ES6

  1. Classes
  2. Inheritance
  3. Arrow Functions
  4. Expression Bodies
  5. Statement Bodies
  6. Lexical this
  7. Template Literals
  8. Extended Parameter Handling
  9. Default Parameter Values
  10. Rest Parameter
  11. Spread Operator
  12. Destructuring assignment
  13. Basic example
  14. Array destructuring
  15. Value assignment
  16. Default values
  17. Swapping values
  18. Skipping values
  19. Grouping tail values into a single variable
  20. Object destructuring
  21. Unpacking properties
  22. Renaming properties
  23. Default values
  24. Unpacking methods
  25. Renaming methods
  26. Using with function parameters
  27. IDE support
  28. Modules
  29. Exporting and Importing Values
  30. Default Values
  31. Wildcard Export
  32. See also

TypeScript

  1. Getting Started with TypeScript
  2. Installing TypeScript
  3. Using tsc
  4. Typings
  5. Linting
  6. tslint
  7. TypeScript Features
  8. Types
  9. Basic Types
  10. Arrays
  11. Enum
  12. Any
  13. Void
  14. Classes
  15. Properties
  16. Setters and Getters
  17. Methods
  18. Return values
  19. Method parameters
  20. Optional parameters
  21. Default parameters
  22. Rest Parameters and Spread Operator
  23. Constructors
  24. Inheritance
  25. Access Modifiers
  26. Public
  27. Private
  28. Protected
  29. Interfaces
  30. Abstract Classes
  31. Modules
  32. Module Loaders
  33. Running at server side
  34. Running in browser
  35. Source code
  36. Decorators
  37. Class Decorators
  38. Decorators with parameters
  39. Multiple decorators
  40. Method Decorators
  41. Accessor Decorators
  42. Property Decorators
  43. Parameter Decorators

Angular CLI

  1. Installing
  2. Your first application
  3. Running application
  4. Code Linting
  5. Unit tests
  6. Code coverage
  7. Development and Production builds
  8. Using blueprints
  9. Creating modules
  10. Assigning components to modules
  11. Routing support
  12. Generating standalone scripts

Components

  1. Creating a simple component
  2. Angular CLI
  3. Application module
  4. Source code
  5. Generating components with Angular CLI
  6. Angular CLI
  7. Component metadata
  8. Templates
  9. Inline templates
  10. Template literals
  11. External templates
  12. External files
  13. Styles
  14. Inline styles
  15. External styles
  16. External files
  17. Input properties
  18. Binding to expressions
  19. Avoid aliasing inputs and outputs
  20. Output events
  21. Raising events
  22. Handling events
  23. Typed events
  24. Accessing event parameters
  25. DOM events
  26. Aliased outputs
  27. Avoid aliasing inputs and outputs
  28. Providers
  29. Registering service
  30. Advanced feature
  31. Source code
  32. Host
  33. CSS class
  34. Host events
  35. Host attributes
  36. Host properties
  37. Source code
  38. Queries
  39. Source code
  40. Preparing the project
  41. @ViewChild
  42. @ViewChildren
  43. @ContentChild
  44. @ContentChildren
  45. Listening for View and Content changes
  46. Component Lifecycle
  47. Source code
  48. ngOnChanges
  49. ngOnInit
  50. ngModel
  51. ngDoCheck
  52. Performance Penalty
  53. ngAfterContentInit
  54. Content Projection
  55. ngAfterContentChecked
  56. Content Projection
  57. ngAfterViewInit
  58. ngAfterViewChecked
  59. ngOnDestroy
  60. Cleaning up subscriptions
  61. Subscription
  62. Content Projection
  63. ng-container directive
  64. Source Code and Demo
  65. Projecting single entity
  66. Supporting external content
  67. Projecting multiple entities
  68. Projecting with CSS selectors
  69. Projecting with Component selectors
  70. Fallback content
  71. Source Code and Demo

Dependency Injection

  1. Source code
  2. Preparing a project
  3. Services
  4. Creating LogService
  5. Injecting and using LogService
  6. Providers
  7. Using a class
  8. Using a class factory
  9. Class factories with dependencies
  10. Using @Inject decorator
  11. Using a value
  12. Using an alias
  13. Difference with the “useClass”
  14. Injection Tokens
  15. Type tokens
  16. String tokens
  17. Generic InjectionToken
  18. Injecting multiple instances
  19. Optional dependencies
  20. Manual injection with ReflectiveInjector
  21. Summary

Events

  1. Source code
  2. Component events
  3. Output Events
  4. Bubbling up child events
  5. DOM events
  6. Creating and triggering events
  7. Service events
  8. Source code

Directives

  1. Introduction
  2. Attribute Directives
  3. Handling host events
  4. Host members binding
  5. Binding element attributes
  6. Binding element properties
  7. Binding style attributes
  8. Binding class names
  9. Source code
  10. Built-in attribute directives
  11. NgStyle
  12. Source code
  13. NgClass
  14. Binding to String Expression (single):
  15. Binding to String Expression (space delimited)
  16. Binding to Object Literal
  17. Binding to Array
  18. Source code
  19. NgNonBindable
  20. Source code
  21. Structural Directives
  22. Built-in structural directives
  23. NgIf
  24. Source code
  25. NgFor
  26. Binding to arrays
  27. Binding to class properties or functions
  28. Using exported variables
  29. Improving performance with trackBy
  30. NgSwitch
  31. Creating a Structural Directive
  32. Modifying host element layout
  33. Source code

Walkthrough: Upload Directive

  1. DataTransfer
  2. CustomEvent
  3. Source code

Pipes

  1. Source code
  2. Introduction
  3. Pipes with Parameters
  4. Chaining Pipes
  5. Built-in Pipes
  6. UpperCase
  7. LowerCase
  8. TitleCase
  9. Date
  10. Custom formatting rules
  11. Internationalisation API
  12. Predefined formatting rules
  13. Decimal
  14. Minimum numbers
  15. Internationalisation API
  16. Currency
  17. Minimum numbers
  18. Internationalisation API
  19. Percent
  20. Minimum numbers
  21. Internationalisation API
  22. Json
  23. Slice
  24. Slice behaviour
  25. Using with Arrays
  26. Using with Strings
  27. I18nSelect
  28. Experimental
  29. I18nPlural
  30. Experimental
  31. Async
  32. Unsubscribing
  33. Using with NgFor directive
  34. Using with Date object
  35. Source code
  36. Custom Pipes
  37. Implementing Custom Pipe
  38. Converting Bytes
  39. Pure And Impure Pipes
  40. Preparing Project
  41. Pure Pipes
  42. Object reference checks
  43. Pipe name
  44. Impure Pipes
  45. Performance

Global Application Configuration

  1. Preparing the configuration file
  2. Configuration content
  3. Updating file content
  4. Creating the configuration service
  5. Loading server-side configuration file
  6. Registering configuration service
  7. Using configuration settings
  8. Source code

Internationalisation (i18n)

  1. Creating Translate Service
  2. Loading server-side files
  3. Creating Translate Pipe
  4. Using Translate Pipe
  5. Switching languages
  6. Summary
  7. Source code

Advanced Angular

  1. Dynamic Content in Angular
  2. List item templates
  3. List component
  4. Row templates
  5. Typical use cases
  6. Source code
  7. Dynamic Components
  8. Runtime context
  9. Typical use cases
  10. Source code
  11. Runtime Compilation
  12. Binding events
  13. Typical use cases
  14. Source code
  15. Plugins
  16. Preparing new project
  17. Source code
  18. Building components based on string names
  19. Loading configuration from external sources
  20. Optimisation
  21. Source code
  22. Dynamically changing application routes
  23. Source code
  24. External plugins
  25. Extension decorator
  26. Creating a Plugins Core library
  27. Rollup.js
  28. Source code
  29. Creating an example Plugin library
  30. TypeScript Configuration
  31. Source code
  32. Extra libraries and dependencies
  33. Providing dependencies for your plugins
  34. Loading plugins into the Application
  35. SystemJS
  36. Dynamic modules and NgModule decorator
  37. Setting plugin properties at runtime
  38. Dynamic Routes with plugin content
  39. Summary
  40. Source code

Reusable Component Libraries

  1. Creating new application
  2. Creating component libraries
  3. Building the packages
  4. Publishing to NPM
  5. Package scope
  6. Integrating with the application
  7. See also
  8. Source code

Using with Docker

  1. Additional Resources
  2. Preparing new project
  3. Creating Dockerfile
  4. Deployment
  5. Testing in a container
  6. Creating docker-compose.yml
  7. Publishing to Docker Hub
  8. Consuming from Docker Hub
  9. Automating with Travis
  10. See also
  11. Source code

Webpack

  1. Initial project structure
  2. Source code
  3. Typescript configuration
  4. Basic webpack setup
  5. Enabling source maps
  6. Simple Angular application
  7. Generating index page
  8. Development server
  9. Start command with NPM
  10. Fixing Angular warnings
  11. Testing source maps
  12. Advanced webpack setup
  13. External Html templates
  14. External CSS styles
  15. Loading images
  16. TSLint
  17. Unit testing
  18. Code coverage
  19. Source code
  20. Code splitting
  21. Multiple configurations
  22. Development mode
  23. Production mode
  24. CSS splitting
  25. Vendor code splitting

Building a Mobile App with Cordova and Angular

  1. Installing command-line tools
  2. Angular CLI
  3. Generating a new Cordova App
  4. Adding the Browser platform
  5. Adding the iOS platform
  6. Generating a new Angular App
  7. Build scripts
  8. Running Angular in the Browser
  9. Running Angular in the iOS emulator
  10. Routing support
  11. Routing in the iOS emulator
  12. Summary

Changelog

  1. Revision 16 (2018-10-23)
  2. Revision 15 (2018-06-03)
  3. Revision 14 (2018-04-08)
  4. Revision 13 (2018-02-12)
  5. Revision 12 (2017-12-17)
  6. Revision 11 (2017-12-03)
  7. Revision 10 (2017-11-12)
  8. Revision 9 (2017-10-15)
  9. Revision 8 (2017-09-17)
  10. Revision 7 (2017-09-14)
  11. Revision 6 (2017-08-24)
  12. Revision 5 (2017-08-13)
  13. Revision 4 (2017-07-22)
  14. Revision 3 (2017-07-09)
  15. Revision 2 (2017-07-02)
  16. Revision 1 (2017-06-09)

The Leanpub 60 Day 100% Happiness Guarantee

Within 60 days of purchase you can get a 100% refund on any Leanpub purchase, in two clicks.

Now, this is technically risky for us, since you'll have the book or course files either way. But we're so confident in our products and services, and in our authors and readers, that we're happy to offer a full money back guarantee for everything we sell.

You can only find out how good something is by trying it, and because of our 100% money back guarantee there's literally no risk to do so!

So, there's no reason not to click the Add to Cart button, is there?

See full terms...

Earn $8 on a $10 Purchase, and $16 on a $20 Purchase

We pay 80% royalties on purchases of $7.99 or more, and 80% royalties minus a 50 cent flat fee on purchases between $0.99 and $7.98. You earn $8 on a $10 sale, and $16 on a $20 sale. So, if we sell 5000 non-refunded copies of your book for $20, you'll earn $80,000.

(Yes, some authors have already earned much more than that on Leanpub.)

In fact, authors have earned over $14 million writing, publishing and selling on Leanpub.

Learn more about writing on Leanpub

Free Updates. DRM Free.

If you buy a Leanpub book, you get free updates for as long as the author updates the book! Many authors use Leanpub to publish their books in-progress, while they are writing them. All readers get free updates, regardless of when they bought the book or how much they paid (including free).

Most Leanpub books are available in PDF (for computers) and EPUB (for phones, tablets and Kindle). The formats that a book includes are shown at the top right corner of this page.

Finally, Leanpub books don't have any DRM copy-protection nonsense, so you can easily read them on any supported device.

Learn more about Leanpub's ebook formats and where to read them

Write and Publish on Leanpub

You can use Leanpub to easily write, publish and sell in-progress and completed ebooks and online courses!

Leanpub is a powerful platform for serious authors, combining a simple, elegant writing and publishing workflow with a store focused on selling in-progress ebooks.

Leanpub is a magical typewriter for authors: just write in plain text, and to publish your ebook, just click a button. (Or, if you are producing your ebook your own way, you can even upload your own PDF and/or EPUB files and then publish with one click!) It really is that easy.

Learn more about writing on Leanpub