ManningBooks
Web Component Development with Modern Libraries and Tooling (Manning)
In Web Component Development with Modern Libraries and Tooling, you’ll learn how to build reusable web components that last well beyond the next library update. In this practical and easy-to-follow guide, author Mark Volkmann shows you how Web components deliver something no JavaScript framework can match: true portability.
Mark Volkmann
If your team has ever rebuilt the same UI component for React, then again for Vue, then again for whatever comes next, this book will feel very relevant. Web components offer a standards-based way to build UI pieces that work across frameworks, in plain HTML, and even in places like Markdown documents. They’re supported by modern browsers and aren’t tied to a single frontend ecosystem.
Mark Volkmann takes a practical route through the subject. The book starts with why web components are worth learning, then moves quickly into building and using them.
You’ll work with examples such as:
-
hello-world -
google-button -
radio-group -
sortable-table -
traffic-light
The early chapters introduce Web Awesome, the successor to Shoelace, and show how to use prebuilt components for inputs, dialogs, drawers, progress indicators, ratings, and more. From there, the book digs into vanilla web components: custom elements, attributes and properties, lifecycle callbacks, Shadow DOM, styling, form participation, and shared state.
There’s also a full chapter on best practices, based on the web.dev custom elements checklist. It covers details that matter once components move beyond demos: reflecting primitive properties, avoiding rich data in attributes, using slots well, respecting the hidden attribute, dispatching events correctly, and more.
Later chapters cover the libraries and tools many teams use in production:
-
Lit
-
Stencil
-
FAST
-
wrec
-
JavaScript decorators
-
Custom Elements Manifest
-
Storybook
-
Playwright
-
server-side rendering
-
AI-assisted component generation
The book also shows how to use web components inside Angular, React, Solid, Svelte, and Vue, which is especially useful if you’re trying to share a design system across multiple apps.
Mark brings a lot of practical experience to this topic. He’s a Partner and Distinguished Engineer at Object Computing, Inc., and has worked with JavaScript, Node.js, Svelte, React, Vue, Angular, Swift/SwiftUI, and more. He’s also the author of Svelte and Sapper in Action and Server-Driven Web Apps with htmx.
This book is aimed at working web developers who know the basics of HTML, CSS, and JavaScript and want a structured path into web components instead of piecing everything together from scattered posts and examples.
Don’t forget you can get 45% off with your Devtalk discount! Just use the coupon code “devtalk.com” at checkout ![]()
Popular Frontend topics
Other popular topics
Categories:
Sub Categories:
Popular Portals
- /elixir
- /rust
- /wasm
- /ruby
- /erlang
- /phoenix
- /keyboards
- /python
- /js
- /rails
- /security
- /go
- /swift
- /vim
- /clojure
- /java
- /emacs
- /haskell
- /svelte
- /typescript
- /onivim
- /kotlin
- /c-plus-plus
- /crystal
- /tailwind
- /react
- /gleam
- /ocaml
- /vscode
- /flutter
- /elm
- /ash
- /html
- /deepseek
- /opensuse
- /zig
- /centos
- /php
- /scala
- /react-native
- /lisp
- /textmate
- /sublime-text
- /nixos
- /debian
- /agda
- /django
- /deno
- /kubuntu
- /arch-linux
- /nodejs
- /ubuntu
- /spring
- /revery
- /manjaro
- /diversity
- /lua
- /julia
- /quarkus
- /markdown










