User interfaces: hiding stuff should be a last resort by Adam Silver, designer based in London, UK.Many of the components we design for the web are made to save space. It’s interesting that we work so hard to save space on a medium where we have infinite space to work with.tagged: simpleheadlessdom05-03-2019
Building Web Components with lit-htmlIn our previous post A introduction to Web Components we learned the basics of the APIs that when used together can create a compelling and reusable way to make UI components. We learned Web Components communicate primarily via properties and events. Web Components can also use the Shadow DOM API to create template and CSS encapsulation. In this post we are going to look into a project ran by Polymer called lit-html.tagged: componentshtmlframeworks04-03-2019
Are People Chucking London's Dockless Bikes Into The Water? | LondonistScrolling around London on Citymapper the other day, we noticed something amiss. The app directed us towards a form of transport located on a blue part of the map. As everyone knows, maps + blue = water, so what is this new form of floating transportation and why has it gone unnoticed?tagged: londoncityairportbikesrubbish04-03-2019
How Are Function Components Different from Classes? — OverreactedHow do React function components differ from React classes?For a while, the canonical answer has been that classes provide access to more features (like state). With Hooks, that’s not true anymore.tagged: reactcomponentspseudo-classesfunctional04-03-2019
The CSS mental model - QuirksBlogToday we will attempt to describe the different mental models for CSS and JavaScript. Everybody agrees there is a difference, but nobody’s able to define exactly what that difference is. So let’s try.tagged: cssstate26-02-2019
CSS Houdini: JS-in-CSS - @iamvdoGeneric worklet to be authored right from CSStagged: cssjs2d22-02-2019
Pattern Lab | Build Atomic Design SystemsCreate atomic design systems with Pattern Lab.tagged: atomicdesignpatternlabscss22-02-2019
kss-node/kss-node: The Node.js implementation of KSS: a methodology for documenting CSS and generating style guidesThe Node.js implementation of KSS: a methodology for documenting CSS and generating style guides http://kss-node.github.io/kss-node/tagged: documentationcssstyleguide22-02-2019
AddyOsmani.com - Disallow large imports from JavaScript projectsAre there known large JavaScript dependencies your team wish they could disallow from a project? Good news! ESLint supports disallowing specific imports from projects using the no-restricted-imports rule.tagged: eslintdangling-containersdisallowsizeslarge21-02-2019
AddyOsmani.com - JavaScript Loading Priorities in ChromeHow browsers schedule and execute scripts can impact the performance of web pages. While techniques liketagged: loadingperfperformance20-02-2019
Animating Between Views in React | CSS-TricksYou know how some sites and web apps have that neat native feel when transitioning between two pages or views? Sarah Drasner has shown some good examples and even a Vue library to boot.These animations are the type of features that can turn a good user experience into a great one. But to achieve this in a React stack, it is necessary to couple crucial parts in your application: the routing logic and the animation tooling.Let’s start with animations. We’ll be building with React, and there are great options out there for us to leverage. Notably, the react-transition-group is the official package that handles elements entering and leaving the DOM. Let’s explore some relatively straightforward patterns we can apply, even to existing components.tagged: reacttransitionsviews18-02-2019
Floby/node-url-assembler: Assemble urls from route-like templates (/path/:param)Assemble urls from route-like templates (/path/:param)tagged: urlsroutingnpm16-02-2019
Rare African black leopard captured by camera trap's extraordinary photos | World news | The GuardianRare African black leopard captured by camera trap's extraordinary photostagged: photoblackleopard15-02-2019
DevDocs API DocumentationDevDocs combines multiple API documentations in a fast, organized, and searchable interface.tagged: offlinedocs15-02-2019
The CSS transitioncancel event is coming to Chrome and Safari | Web Platform NewsThe CSS transitioncancel event is coming to Chrome and Safaritagged: csstransitionscancel15-02-2019