Home Page Icon
Home Page
Table of Contents for
Contributors
Close
Contributors
by Prateek Jadhwani
Getting Started with Web Components
Title Page
Copyright and Credits
Getting Started with Web Components
About Packt
Why subscribe?
Contributors
About the author
About the reviewer
Packt is searching for authors like you
Preface
Who this book is for
What this book covers
To get the most out of this book
Download the example code files
Download the color images
Conventions used
Get in touch
Reviews
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
Web Components Life Cycle Callback Methods
Overview of life cycle callback methods
Types of life cycle callback methods
connectedCallback()
disconnectedCallback()
adoptedCallback()
attributeChangedCallback()
Summary
Universal Web Components
Styling Web Components
Accessibility for Web Components
Gold Standard Checklist
Summary
Building Reusable Web Components
The concept of reusability
Responsive Web Components
Building <profile-info> Web Component
Publishing Web Components
Extending Web Components – slots
Creating <my-article> Web Component
Summary
Managing States and Props
Introduction to state management
Attributes and properties
Event handling
Summary
Building a Single Page App using Web Components
Understanding project requirements
Figuring 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 <gif-cover> Web Component
The <search-bar> Web Component
The <search-container> Web Component
The <show-trending> Web Component
The <show-random> Web Component
The <my-app> component
Implementing routing
Enabling analytics
Summary
Implementing Web Components using Polymer and Stencil
Polymer
Hello World in Polymer
Nested elements in Polymer
Attributes and properties in Polymer
Stencil
The Hello World Stencil component
Nested Stencil components
Pre-rendering for Stencil components
Summary
Integrating Web Components with a Web Framework
The <header-image> 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
Leave a review - let other readers know what you think
Search in book...
Toggle Font Controls
Playlists
Add To
Create new playlist
Name your new playlist
Playlist description (optional)
Cancel
Create playlist
Sign In
Email address
Password
Forgot Password?
Create account
Login
or
Continue with Facebook
Continue with Google
Sign Up
Full Name
Email address
Confirm Email Address
Password
Login
Create account
or
Continue with Facebook
Continue with Google
Prev
Previous Chapter
Why subscribe?
Next
Next Chapter
About the author
Contributors
Add Highlight
No Comment
..................Content has been hidden....................
You can't read the all page of ebook, please click
here
login for view all page.
Day Mode
Cloud Mode
Night Mode
Reset