Cover; Title Page; Copyright and Credits; About Packt; Contributors; Table of Contents; Preface; Chapter 1: Web Components Essentials and Specifications; Technical requirements; Web Components; Web Component specifications; Custom elements; Types of custom elements; Shadow DOM; Templates; Module loader API; Named export versus default export; Custom elements using imports; Summary; Chapter 2: Web Components Life Cycle Callback Methods; Overview of life cycle callback methods; Types of life cycle callback methods; connectedCallback(); disconnectedCallback(); adoptedCallback()
AttributeChangedCallback()Summary; Chapter 3: Universal Web Components; Styling Web Components; Accessibility for Web Components; Gold Standard Checklist; Summary; Chapter 4: Building Reusable Web Components; The concept of reusability; Responsive Web Components; Building Web Component; Publishing Web Components; Extending Web Components -- slots; Creating Web Component; Summary; Chapter 5: Managing States and Props; Introduction to state management; Attributes and properties; Event handling; Summary; Chapter 6: Building a Single Page App using Web Components
Understanding project requirementsFiguring out reusable Web Components; Configuring the Starter Project and APIs; Pre-requisites; Setting up the project; Running the Starter Project; Pre-requisite for API calls; App components; Functional components; The Web Component; The Web Component; The Web Component; The Web Component; The Web Component; The component; Implementing routing; Enabling analytics; Summary; Chapter 7: Implementing Web Components using Polymer and Stencil; Polymer; Hello World in Polymer
Nested elements in PolymerAttributes and properties in Polymer; Stencil; The Hello World Stencil component; Nested Stencil components; Pre-rendering for Stencil components; Summary; Chapter 8: Integrating Web Components with a Web Framework; The web component; Integrating Web Components in React; Setting up a React project; Adding a React component; Integration of Vanilla Web Component in a React component; Integrating Web Components in Angular; Setting up an Angular project; Integrating with Angular; Integrating Web Components in Vue; Summary; Other Books You May Enjoy; Index
Summary
Web Components are the set of APIs that helps you build standard UI functions that work across any browser, with any JavaScript framework. This practical guide will help you fulfill this promise through examples and best practices. It will help you implement the web components in your existing frontend application to let you fully realize the ..
