Printing music with CSS grid
Laying out sheet music with CSS grid—sounds extreme until you see it abstracted into a web component.
We need fluid and responsive music rendering for the web!
Web Components in 2018 - Blog | SitePen
A good explanation of web components, complete with some code examples.
Web Components are not a single technology. Instead, they are series of browser standards defined by the W3C allowing developers to build components in a way the browser can natively understand. These standards include:
- HTML Templates and Slots – Reusable HTML markup with entry points for user-specific markup
- Shadow DOM – DOM encapsulation for markup and styles
- Custom Elements – Defining named custom HTML elements with specific behaviour
Related links
Custom Element Naming | BitWorking
More thoughts on naming web components.
Design Systems Aren’t Cheap
Just like jQuery dominated the front end yesterday, React dominates it today. There will be something new that dominates it tomorrow. Your design system team will continue doing the same work and incurring more and more costs to keep up with framework churn. And let’s not forget the cost of updating tomorrow’s legacy apps, who are consumers of your soon to be legacy design system.
Faster Integration with Web Components - Cloud Four
It’s good to hear stories like this—makes me feel like the slow-burn of the theoretical benefits of web components is starting to spark and flame up.
davatron5000/awesome-standalones
A curated list of awesome framework-agnostic standalone web components.
Related posts
Extensibility
A difference of opinion regarding what the core features of custom elements should be.
Web Components
Hopes and fears.
Manual ’till it hurts
Try writing your HTML in HTML, your CSS in CSS, and your JavaScript in JavaScript.
Making the Patterns Day website
The joy of getting hands-on with HTML and CSS.
Multi-page web apps
A question via email…