Beginning Server-Side Application Development with Angular

Table of contents

1. Beginning Server-Side Application Development with Angular
   1. Table of Contents
   2. Beginning Server-Side Application Development with Angular
   3. Credits
   4. Contributors
      1. About the author
      2. About the reviewer
      3. Packt is searching for authors like you
   5. 1. Why subscribe?
      2. PacktPub.com
   6. Preface
      1. Checking the Version
      2. Development API
      3. Installation of the API
      4. Who This Book is for
      5. Conventions
      6. Reader Feedback
      7. Customer Support
      8. Downloading the Example Code
      9. Errata
      10. Piracy
      11. Questions
   7. 1. Creating the Base Application
      1. Lesson Objectives
      2. Server-Side and Client-Side Rendering
      3. Installing Angular CLI
      4. Generating a New Application
         1. Creating a New Application
         2. Serving the Application
         3. Viewing Your Application
      5. Setting Defaults for Angular CLI
         1. Configuring Global Defaults
      6. Configuring Global Styles
         1. Linking to the Style Sheets in global styles.css
         2. Adding Bootstrap and Font Awesome
         3. Showing an Icon on the Page
      7. Creating UI Modules and Components
         1. Creating the UiModule
            1. Importing Our UiModule
            2. Displaying the Current Route
         2. Creating the LayoutComponent
            1. Adding a New Route
            2. Building Our Layout
         3. Creating the HeaderComponent
            1. Updating the LayoutComponent to Reference Our New HeaderComponent
            2. Creating the Actual Header
         4. Creating the FooterComponent
            1. Updating the LayoutComponent to Reference Our New FooterComponent
            2. Creating the Actual Footer
      8. Summary
   8. 2. Creating the Application Module and Components
      1. Lesson Objectives
      2. Types of Components
         1. Presentational Components
         2. Container Components
         3. Folder Structure
      3. Generate and Lazy Load the PostsModule
      4. Creating the Container Components
         1. Creating PostsComponent and ProfileComponent
         2. Adding Dummy Post and Profile Data
      5. Creating a Service to Retrieve Data
         1. Generating the Service
         2. Storing Our API URL
         3. Referencing Our New PostsService in Our Container Components
         4. Defining the Public Methods
         5. Importing HttpClientModule in Our AppModule
      6. Creating the Presentational Components
         1. Creating the PostListComponent
         2. Creating the PostItemComponent
         3. Creating the ProfileItemComponent
      7. Creating Resolvers to Retrieve Data Using the Router
         1. Creating Resolvers
         2. Importing Our Resolvers
         3. Using the Data Resolved by the Router
      8. Summary
   9. 3. Server-Side Rendering
      1. Lesson Objectives
      2. Generating the Server App
         1. Generating the Angular Universal Application
         2. Making Our Apps Consistent
      3. Adding Dependencies for the Server App
         1. Adding the Server App to Our Angular CLI Configuration
      4. Adding Run Scripts to package.json
         1. Adding npm Scripts
         2. Testing the Builds of Both Apps
      5. Implementing a Web Server
         1. Installing Server Dependencies
         2. Creating the server.ts File
         3. Adding the npm Script to package.json
         4. Starting the Server
      6. Adding Dynamic Metadata
         1. Creating the UiService
         2. Adding Metadata to PostsComponent and ProfileComponent
      7. Summary
   10. 4. Service Workers
       1. Lesson Objectives
       2. What Is a Service Worker?
       3. What Is a Progressive Web App?
       4. Installing Dependencies
       5. Enabling the Service Worker
          1. Importing the ServiceWorkerModule
          2. Creating the Service Worker Configuration
       6. Configuring the Service Worker
          1. Asset and Data Groups
          2. Configuring the Asset and Data Groups
       7. Testing the Service Worker
          1. Checking Where the Data Comes from
          2. Enabling Offline Mode
             1. Running a Local Build of the Browser App
             2. Inspecting the Behavior
             3. Setting Our Application to Offline Mode
       8. Debugging the Service Worker
          1. Chrome Developer Tools to the Rescue
             1. Locating the Running Service Worker
             2. Unregistering the Registered Service Worker
       9. Summary
   11. Index