#364 — October 31, 2018

Read on the Web

Frontend Focus

Splicing HTML’s DNA With CSS Attribute Selectors — Even confident CSS developers often seem to steer away from attribute selectors. This excellent primer introduces how they work, plus some interesting use cases.

John Rhea

Google Releases reCAPTCHA V3: The New Way to Stop Bots — Instead of just showing a CAPTCHA, reCAPTCHA v3 gives incoming visitors a risk score and lets you take custom actions based on that score.

Google

“Managing” Your Developers Isn’t as Effective as It Appears — No one wants to be the heavy-handed, nit-picking, by-the-book manager. Yet that’s what most management books teach. What if you had the tools to lead with inspiration instead of micromanaging your team? Stop managing, and start leading, today.

Tech Lead Training sponsor

You Might Not Need JavaScript — JavaScript is great, yet you can build so many functional UI components without it. Here are some common web components built with HTML and CSS/SCSS.

Una Kravets

An Annotated webpack 4 Config for Frontend Development — As web development becomes more complex, we need tooling to help us build modern websites. Here’s a very thorough example of a real-world production webpack 4 config.

Andrew Welch

Web Performance 101 — An easily accessible, diagram and code heavy primer to making a site or webapp faster by optimizing assets like JS, CSS, images and fonts.

Ivan Akulov

The CSS Working Group At TPAC: What’s New In CSS? — Last week, Rachel Andrew attended the CSS Working Group meeting at W3C TPAC, and rounds up some of the discussions in this post.

Rachel Andrew

WebAssembly Threads: Ready to Try in Chrome 70 — WebAssembly thread support, which allows for real multi-threaded web apps, has shipped in Chrome 70 under an origin-trial.

Google Developers

? Jobs

ReactJS Developer at Komoot (Remote) — Millions get inspired and plan adventures with our apps. To help us make Komoot the place to go to plan outdoor adventures, we’re looking for an ambitious React developer to join our team.

Komoot

Senior UI Engineer – Sailthru (New York) — Join our team in NYC building next gen apps that help marketers deliver the right message to the right person at the right time.

Sailthru

Join Our Career Marketplace & Get Matched With A Job You Love — Through Hired, software engineers have transparency into salary offers, competing opportunities, and job details.

Hired

? Tutorials & Opinion

Learn CSS Flexbox by Building a Photo Card Component — A good practical example to help you learn the fundamentals of Flexbox.

Ayo Isaiah

Concise Media Queries with CSS Grid — Focuses on the use of grid-template-areas to quickly create responsive layouts with a single rule inside a media query.

Stephen Lindberg

Create a Serverless Powered API in 10 Minutes — Use Cloudflare Workers to create and deploy a serverless API to 150+ data centers.

Cloudflare Workers sponsor

CSS Previous Sibling Selectors and How to Fake Them — CSS previous sibling selectors don’t exist, but they can be ‘faked’.

Facundo Corradini

Using Dark Mode in CSS with macOS Mojave — The latest Safari Tech Preview lets you use different CSS properties depending on the underlying color scheme of the OS.

Paul Miller

You’re Using the em Element Wrong — Semantically, em is for stress emphasis, whereas i is still appropriate for alternate voice or mood.

Facundo Corradini

Creating a Simple Form with CSS Grid

Zell Liew

A Practical Introduction to MongoDB Views

Studio 3T sponsor

Creating Grid Tile Layouts with auto-fit and minmax

Dave Geddes

? Code and Tools

WebAIM: Link Contrast Checker — Check the contrast of your text and links and get a score.

Center for Persons with Disabilities

IronDB: A ‘Relentless’ Key-Value Store for the Browser — Relentless in the sense that it redundantly stores data in multiple browser stores (i.e. in cookies, localStorage, sessionStorage and IndexedDB) and tries to ‘self heal’ upon data loss.

Ansgar Grunseid

(ZURB) Foundation 6.5.0 Released — After 900 commits versions 6.5.0 of this popular framework fixes over 100 bugs fixed, offers more customization, enhanced accessiblility and more.

Nicolas Coden

Shop Like a Developer – Discover and Experiment with Hot New Services ?

Manifold sponsor

simple-keyboard: A Slick Virtual JavaScript Keyboard for the Web — Very smooth and easy to customize.

Francisco Hodge

simplebar: A Vanilla JavaScript Library for Custom Scrollbars

Adrien Denat