Cover image for Angular Projects

Angular Projects

Author Zama Khan Mohammed
Release Date: 2019/09/01
ISBN: 9781838559359
Topic:
0%
202
Chapters
0-1
Hours read
0k
Total Words
    Start Reading Now    
       Add to Wishlist       
View table of contents

Book Description

Understand Angular web development by building real-world captivating applications exploring various web technologies and best practices

Key Features

  • Explore Angular's capabilities in building Web apps, mobile apps, and browser games
  • Get to know Angular's latest features like Ivy renderer, Lazy loading and differential loading
  • Build test-driven Angular applications using Jasmine and Jest frameworks

Book Description

Angular is one of the best frameworks, not only for building web applications, but also for building applications on other platforms such as desktop and mobile. It is packed with amazing web tools that allow developers to become more productive and make the development experience a happier one

This book will be your practical guide when it comes to building optimized web apps using Angular. The book explores a number of popular features, including the experimental Ivy rendered, lazy loading, and differential loading, among others, in the projects. It starts with the basics of Angular and its tools, which will help you to develop and debug Angular applications. You will learn how to create an SPA using Angular Router, and optimize it by code splitting and Preloading Routes. We will then build a form-heavy application and make forms reactive by using Reactive Forms. After that, we will learn how to build a Progressive Web App, and a server-side rendering app, as well as a MonoRepo app. Furthermore, we will also dive into building mobile apps using Ionic and NativeScript. Finally, we end the book by creating a component library for our application using Angular CDK and then testing it.

By the end of this book, you will know everything you need in order to get started with Angular and build a variety of applications.

What you will learn

  • Set up Angular applications using Angular CLI and Angular Console
  • Understand lazy loading using dynamic imports for routing
  • Perform server-side rendering by building an SEO application
  • Build a Multi-Language NativeScript Application with Angular
  • Explore the components library for frontend web using Angular CDK
  • Scale your Angular applications using Nx, NgRx, and Redux

Who this book is for

The book is aimed at any JavaScript developers who want to start with Angular and become an expert in all the tools and the various use cases that they might deal with as an Angular expert. Whatever the case, a basic understanding of Angular is a plus but is not required. You should know the basics of developing web applications and have experience working with ES6 or TypeScript.

Downloading the example code for this ebook: You can download the example code files for this ebook on GitHub at the following link: https://github.com/PacktPublishing/Angular-Projects. If you require support please email: [email protected]

Table of Contents

  1. Title Page
  2. Copyright and Credits
    1. Angular Projects
  3. Dedication
  4. About Packt
    1. Why subscribe?
  5. Foreword
  6. Contributors
    1. About the author
    2. About the reviewers
    3. Packt is searching for authors like you
  7. Preface
    1. Who this book is for
    2. What this book covers
    3. To get the most out of this book
      1. Download the example code files
      2. Download the color images
      3. Conventions used
    4. Get in touch
      1. Reviews
  8. Setting Up the Development Environment
    1. Installing Node.js
    2. Introducing TypeScript
      1. Interface
      2. Class and property decorators
      3. Access modifiers
    3. Introducing Angular CLI
      1. Installing Angular CLI
      2. Scaffolding a new Angular app
      3. Updating your Angular application
      4. Generating files
      5. Serving an Angular app
      6. Building the application
      7. Adding CLI extensions
    4. Introducing Angular Console
    5. VS Code
      1. Installing VS Code
        1. Installing extensions
        2. VS Code settings
    6. Debugging Angular applications using Augury
    7. Summary
  9. Building a Flashcard Game Using Angular
    1. Technical requirements
    2. Creating a new project and a component
    3. Introducing template-driven forms
    4. Introducing services
    5. Introducing observables
    6. Summary
    7. Questions
    8. Further reading
  10. Building a Personal Blog Using Angular Router and WordPress
    1. Technical requirements
    2. Understanding SPAs
    3. Project overview
    4. Setting up a WordPress server
    5. Setting up an Angular project with the Angular CLI
    6. Adding multiple routes to our application
    7. Calling the WordPress API 
    8. Implementing lazy loading route
    9. Introducing pre-loading strategy
      1. Adding ngx-quicklink
    10. Adding animations
    11. Summary
    12. Questions
    13. Further reading
  11. Building an Inventory Application Using Reactive Forms
    1. Technical requirements
    2. Understanding reactive forms
    3. Project overview
    4. Getting started
    5. Using reactive forms
    6. Adding built-in and custom validations
    7. Optimizing the bundle
    8. Summary
    9. Questions
    10. Further reading
  12. Building a PWA E-Commerce Application Using Angular Service Worker
    1. Technical requirements
    2. Exploring Progressive Web Apps
    3. Project overview
    4. Setting up our Nest.js application
    5. Setting up our Angular application
    6. Auditing our application
    7. Adding PWA capability
      1. Offline support
      2. Showing network changes
      3. Prompting for new updates
    8. Deploying to Firebase
    9. Summary
    10. Questions
    11. Further reading
  13. Building an Auditing Application Using Angular and Ionic
    1. Technical requirements
    2. Exploring the Ionic framework
    3. Project overview
    4. Getting started with the Ionic CLI
    5. Theming the Ionic application
    6. Setting up Firebase
    7. Getting data from the Firebase Realtime Database
    8. Creating dynamic forms using ngx-formly
    9. Using Ionic Native so that we can use a camera 
    10. Summary
    11. Questions
    12. Further reading
  14. Building a Server-Side Rendering Application Using Angular
    1. Technical requirements
    2. Understanding Angular Universal
    3. Deployment and performance analysis
    4. Adding Universal support
    5. Transferring state from the server to the client
    6. Deployment and performance analysis of SSR
    7. Understanding SEO optimizations
      1. Content is king
      2. Accessibility
      3. Using anchor tags for links
      4. Using sitemap.xml
      5. Using robots.txt 
      6. The title and description
    8. Social media scraping
    9. Summary
    10. Questions
    11. Further reading
  15. Building an Enterprise Portal Using Nx, NgRx, and Redux
    1. Technical requirements
    2. Exploring the monorepo application
    3. Redux using NgRx
    4. Understanding token-based authentication
    5. Project overview
    6. Getting started
      1. Creating a Node.js application using Nx
      2. Creating a client application using Nx
      3. Creating a library using Nx
      4. Adding Momentum Design to an Angular CLI application
      5. Setting up NgRx in our application using Nx
    7. Adding an authentication library
      1. Adding a library using Nx
      2. Generating an NgRx state for the library
      3. Updating NgRx auth actions
      4. Updating the NgRx Auth reducer
      5. Updating NgRx Auth effects
      6. Adding a callback route
      7. Routes in our application
      8. Registering for Auth0 and signing in
      9. Securing routes using route guards
      10. Using an interceptor to add an authorization token to headers
    8. Using ngx-charts for D3 visualizations
    9. Summary
    10. Questions
    11. Further reading
  16. Building a Multi-Language NativeScript Application with Angular
    1. Technical requirements
    2. Introducing NativeScript Playground
    3. Creating your first NativeScript with an Angular application
    4. Exploring UI layout containers
      1. Absolute layout
      2. Dock layout
      3. Grid layout
      4. Stack layout
      5. Wrap layout
      6. Flex layout
    5. Creating the application
      1. Creating the news page 
      2. Creating the details page 
    6. Implementing internationalization using ngx-translate
    7. Adding a NativeScript plugin to our application
    8. Summary
    9. Questions
    10. Further reading
  17. Building a Component Library Using Angular CDK and Elements
    1. Technical requirements
    2. Understanding the Angular CDK
    3. Project overview
    4. Getting started
    5. Creating dropdown functionality
    6. Adding accessibility support
    7. Publishing a library on npm
    8. Introducing Angular elements
      1. Angular elements project
    9. Summary
    10. Questions
    11. Further reading
  18. Testing an Angular Application Using Jasmine, Jest, and Protractor
    1. Technical requirements
    2. Why test our web applications?
    3. Project overview
    4. Getting started
    5. Isolated unit testing
    6. Deep integration tests
      1. Deep integration tests for the component
      2. Deep integration tests for the service
    7. Understanding code coverage
    8. Using Jest with the Angular CLI
      1. Snapshot testing
    9. End-to-end testing
    10. Custom error handling
    11. Summary
    12. Questions
    13. Further reading
  19. Other Books You May Enjoy
    1. Leave a review - let other readers know what you think
3.133.141.6