Web components in action / Ben Farrell ; foreword by Gray Norton.

Format:

Book

Author/Creator:

Farrell, Ben, author.

Contributor:

Norton, Gray, writer of foreword.

Language:

English

Subjects (All):

Internet programming.

Web applications.

Physical Description:

1 online resource (432 pages)

Edition:

1st edition

Place of Publication:

Shelter Island, New York : Manning Publications, [2019]

System Details:

text file

Summary:

Web Components in Action teaches you to build and use Web Components from the ground up. You’ll start with simple components and component-based applications, using JavaScript, HTML, and CSS. Then, you’ll customize them and apply best design practices to maximize reusability. Through hands-on projects, you’ll learn to build production-ready Web Components for any project, including color pickers, advanced applications using 3D models, mixed reality, and machine learning.

Contents:

Intro

Copyright

Brief Table of Contents

Table of Contents

Foreword

Preface

Acknowledgments

About this book

About the cover illustration

Part 1. First steps

Chapter 1. The framework without a framework

1.1. What are Web Components?

1.2. The future of Web Components

1.3. Beyond the single component

1.4. Your project, your choice

Summary

Chapter 2. Your first Web Component

2.1. Intro to HTMLElement

2.2. Rules for naming your element

2.3. Defining your custom element (and handling collisions)

2.4. Extending HTMLElement to create custom component logic

2.5. Using your custom element in practice

2.6. Making a (useful) first component

2.7. Notes on browser support

Chapter 3. Making your component reusable

3.1. A real-world component

3.2. Making our component configurable

3.3. Using attributes for configuration

3.4. Listening for attribute changes

3.5. Making more things even more customizable

3.6. Updating the slider component

Chapter 4. The component lifecycle

4.1. The Web Components API

4.2. The connectedCallback handler

4.3. The remaining Web Component lifecycle methods

4.4. Comparing to React's lifecycle

4.5. Comparing to a game engine lifecycle

4.6. Component lifecycle v0

Chapter 5. Instrumenting a better web app through modules

5.1. Using the &lt

script&gt

tag to load your Web Components

5.2. Using modules to solve dependency problems

5.3. Adding interactivity to our component

5.4. Wrapping third-party libraries as modules

Part 2. Ways to improve your component workflow

Chapter 6. Markup managed

6.1. String theory

6.2. Using template literals

6.3. Importing templates

6.4. Template logic

6.5. Element caching

6.6. Smart templating.

6.7. Updating the slider component

Chapter 7. Templating your content with HTML

7.1. R.I.P. HTML Imports

7.2. The &lt

template&gt

tag

7.3. Choose your own template adventure

7.4. Dynamically loading templates

7.5. Entering the Shadow DOM with slots

Chapter 8. The Shadow DOM

8.1. Encapsulation

8.2. Enter the Shadow DOM

8.3. The Shadow DOM today

Chapter 9. Shadow CSS

9.1. Style creep

9.2. Style creep solved with the Shadow DOM

9.3. Shadow DOM workout plan

9.4. Adaptable components

9.5. Updating the slider component

Chapter 10. Shadow CSS rough edges

10.1. Contextual CSS

10.2. Component themes

10.3. Using the Shadow DOM in practice (today)

Part 3. Putting your components together

Chapter 11. A real-world UI component

11.1. Crafting a color picker

11.2. Coordinate picker component

11.3. The color picker

11.4. Adding a common design language

Chapter 12. Building and supporting older browsers

12.1. Backward compatibility

12.2. Building for the least common denominator

12.3. Build processes

12.4. Building components

12.5. Transpiling for IE

Chapter 13. Component testing

13.1. Unit testing and TDD

13.2. Web Component tester

13.3. Comparing to a standard test setup with Karma

Chapter 14. Events and application data flow

14.1. Framework offerings

14.2. Events

14.3. Passing events through Web Components

14.4. Separate your data

14.5. Exercise playback view

14.6. Passing events with an event bus

Chapter 15. Hiding your complexities

15.1. Looking to the Web Component future

15.2. 3D and mixed reality

15.3. Video effects

15.4. Hand tracking and machine learning

Appendix. ES2015 for Web Components.

A.1. What is ES2015?

A.2. Rethinking variables with ES2015

A.3. Classes

A.4. Modules

A.5. Template literals

A.6. The fat arrow

Index

List of Figures

List of Tables

List of Listings.

Notes:

Description based on print version record.

Includes index.

Includes bibliographical references and index.

ISBN:

9781638350705

1638350701

OCLC:

1122791565