#381 — March 6, 2019

Read on the Web

Frontend Focus

WebAuthn Approved As Web Standard for Password-Free Logins — The W3C announced earlier this week that the Web Authentication API (WebAuthn) is now an official standard for password-free logins on the web.

Emil Protalinski

Cache-Control for Civilians — An accessible look at what the HTTP Cache-Control header can do when it comes to controlling how your assets are cached. Covering strategies, asset management and more.

Harry Roberts

New. Cloudflare Registrar - Domain Registration at Wholesale Pricing — Cloudflare Registrar securely registers and manages your domain names with transparent, no-markup pricing.

Cloudflare Registrar sponsor

Microsoft’s New Edge Browser Looks A Lot Like Chrome — Leaked screenshots show the upcoming Chromium-powered browser (which is still being tested internally). Neowin has more screenshots here.

Tom Warren

Web Page Footers 101: Design Patterns and When to Use Each“A footer is the place users go when users they’re lost.” — Some good tips and advice here on what to consider when building out your site footer.

Therese Fessenden

Building Robust Layouts With Container Units — When inspecting most other grids in DevTools, you’ll notice that column widths are dependent on their parent element. This article will help you understand how to overcome these limitations using CSS variables & how you can start building with container units.

Russell Bishop

The Firefox Experiments I Would Have Liked To Try — The author has been a member of the Firefox Test Pilot team for a number of years. Here he takes a comprehensive look back on several ideas he would have liked to have explored/implemented within Firefox.

Ian Bicking

💻 Jobs

Full-Stack Engineer - React/Rails (NYC) — Rapidly growing healthcare startup in the addiction and sobriety space seeking talented developers to help build the future of online addiction and sobriety support.

Tempest, Inc.

Frontend Developer at X-Team (Remote) — Join the most energizing community for developers. Work from anywhere with the world's leading brands.


Find A Job Through Vettery — Vettery specializes in dev roles and is completely free for job seekers.


📘 Articles, Tutorials & Opinion

Content-Based Grid Tracks and Embracing Flexibility — A look at how to size CSS Grid tracks based on their content with min-content, max-content and auto.

Hidde de Vries

Lesser-Known CSS Properties Demonstrated with GIFs — A good collection, visually represented, of several lesser-known CSS techniques.

Pavel Laptev

How to Filter Elements from MongoDB Arrays - With Studio 3T — Learn how to resolve one of the most common problems that plagues those new to MongoDB.

Studio 3T sponsor

▶  Advanced CSS Margins — A roughly ten-minute video exploring the advanced aspects of CSS margins.


▶  How Google Search Indexes JavaScript Sites — Martin Splitt explains how JavaScript influences SEO and how to optimize your JavaScript-powered website to be search-friendly.

Google Webmasters

How to Render 3D in 2D Canvas — Or, more accurately, projecting 3D coordinates into a regular 2D canvas. The effect is striking.

Louis Hoebregts

A/B Testing For Mobile-First Experiences — Tips and advice for implementing A/B testing on mobile for the web.

Suzanne Scacca

Reducing First Input Delay for a Better User Experience

James Milner

Learn How to Manage Domains with DNSimple's API Node.js Mini-Course

DNSimple sponsor

Should You Use Source Maps in Production? — A source map is a file that correlates between a minified version of an asset (e.g. CSS or JavaScript) and the original source code.

Chris Coyier

Why I Write CSS in JavaScript

Max Stoiber

🔧 Code and Tools

CSS Lego Minifigure Maker — A fun little demo: Swap heads, change colors, take figures apart.

Josh Bader codepen

react-svg-pan-zoom: A React Component That Adds Pan and Zoom Features to SVG

Christian Vadalà

RFS: Responsive Font Size Engine — Automatically calculates the appropriate font size based on the browser viewport dimensions.


Take Our ~7min Survey for a Chance to Win a Lego Star Wars TIE Fighter

ActiveState sponsor

utterances: Commenting Widget Built on GitHub Issues

Jeremy Danyow

   🗓 Upcoming Events

UpFront Conference, March 22 — Manchester, UK — A frontend conference 'open to everyone who makes for the web'.

FrontCon, April 3–5 — Riga, Latvia — A two-day conference focused on frontend concepts and technologies.

SmashingConf, April 16–17 — San Francisco, California — A friendly, inclusive event which is focused on real-world problems and solutions.

CityJS Conference, May 3 — London, UK — Meet local and international speakers and share your experiences with modern Javascript development.

CSSCamp 2019, July 17 — Barcelona, Catalunya — A one-day, one-track conference for web designers and developers.