Tags: template

10

sparkline

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

Jekyll Includes are Cool - daverupert.com

Dave explains how Jekyll Includes are starting to convert him to web components. The encapsulation is nice and neat. And he answers the inevitable “but why not use React?” question:

Writing HTML that contains JavaScript, not JavaScript that contains HTML, feels good to me.

The key feature for me is that this approach doesn’t have to depend on JavaScript in the browser:

I like that Web Components are an entirely client-side technology but can be rendered server-side in existing tech stacks whether it’s Jekyll, Rails, or even some Enterprise Java system.

An intro to web components with otters – Monica Dinculescu

A really great introduction to web components by Monica. But I couldn’t help but be disheartened by this:

Web components tend to have dependencies on other web components, so you need a package manager to herd all them cats.

For me, this kind of interdependence lessens the standalone nature of web components—it just doesn’t feel quite so encapsulated to me. I know that this can be solved with build tools, but now you’ve got two problems (and one more dependency).

CodePen - CSS Grid Template Builder

Here’s a handy interface if you want to get your head around named areas in CSS Grid, also known as doing layout with ASCII art.

jordanmoore/Modern-Default-HTML

This is so weird—Jordan Moore’s boilerplate responsive HTML template is exactly the same as mine! What are the odds‽

(I was once asked to contribute a boilerplate starter for

Council Toolkit

A reusable set of responsive patterns and templates for UK councils.

Mark Perkins  ★  All Marked Up

I agree 100% with Mark’s thoughts on what a Content Management System should and shouldn’t attempt to do.

I think that markup is too important to be left in the hands of the people who make content management systems. They all too often don’t care enough about it, and they can never know the context that you will be using it in, and so in my opinion they shouldn’t be trying to guess.

HTML5 Boilerplate - A rock-solid default for HTML5 awesome.

Another set of default HTML/CSS/JS templates with some very clever ideas built in (courtesy of the always-brilliant Paul Irish).

HTML5 Reset

Barebones templates for HTML5 documents. It needs a bit of work but it's a nifty idea.

ANN: Blogger adds hAtom microformat - Blogger Data API | Google Groups

"All new blogs, and all blogs that use Layouts and have unmodified blog page element templates now have hAtom classes in them."