Explores the use of media queries in responsive design today, how they work alongside Flexbox and Grid Layout, and what’s coming in the future.
Rachel Andrew
Google Chrome will soon begin to block ads on some sites by default. Here’s a closer look at how it will work.
Daniel Aleksandersen
Firefox’s new JS debugger is pretty powerful, and will help you write fast, bug-free code.
Smashing Magazine
Master CSS Grid and Flexbox, the latest tools and tricks to layout beautiful, responsive web applications with less code.
Frontend Masters
Sponsor
Historical context on how CSS approaches/tooling have evolved to what we have today.
Peter Jang
A meaty first step in a series on creating a game built around the mechanic of React and Redux controlling SVG elements.
Bruno Krebs
We all want images to load fast: “Choosing the right image format, optimizing the quality and using responsive images are important tasks, but what can we do beyond that?”
Smashing Magazine
We linked to the code a few weeks ago but now the CTO of Basecamp and creator of Ruby on Rails shares his vision for an alternative to single-page client-side MVC apps.
David Heinemeier Hansson
The grid- prefix is no longer required for properties such as grid-gap and grid-row-gap , (although Firefox still needs it right now).
Manuel Rego on Twitter
Jobs
In Brief
CSS Grid Layout Module Level 2: First Public Working Draft news Level 2 expands Grid by adding ‘subgrid’ capabilities and aspect-ratio–controlled gutters. W3C
How W3C is Fast-Forwarding Media Support on the Web news François Daoust (W3C)
Welcoming Progressive Web Apps to MS Edge and Windows 10 news Edge now supports Service Workers and push notifications. Microsoft
Project Tracking, Teamwork & Client Reporting Like You've Never Seen Before
monday.com Sponsor
Get a Parallax Effect on the Cheap tutorial It’s pretty neat just how simple this approach is. Dave Rupert
Automatic Visual Diffing of Web Pages with Puppeteer tutorial How to set up Puppeteer to automate both taking screenshots of your project and comparing them. Monica Dinculescu
Hyperapp + Parcel = A Neat Way to Create Frontend Apps tutorial Beat that JavaScript fatigue with a tiny Elm-inspired frontend library plus a new, no-config asset bundler? Adam Boro
Three 'Superpowers' of the Flexbox Model tutorial How flex-basis , flex-shrink and flex-grow work. Maciej Nowakowski
Using the 'initial' Keyword in CSS tutorial It can act something like a ‘reset’ for CSS properties. Adam Laki
Counting with CSS Counters and CSS Grid tutorial Cleverly using CSS Grid to work around a CSS counter limitation. Preethi Sam
Five Things Episode 4: Five Things About RxJS in Angular, with Ward Bell video In this episode learn how Angular uses RxJS and how RxJS helps with cloud development with Ward Bell. Microsoft Sponsor
CSS Best Practices: Scaling CSS in a Fast-Growing SaaS Startup story Sqreen
A History of WaSP and Why Web Standards Matter story Jason Hoffman
Frontend Frameworks: Custom vs Ready-to-Use Solutions opinion Ivaylo Gerchev
30 Scalable and Customizable SVG Backgrounds for Web Pages tools These are really neat. Matthew Lipman
AccessLint Hooks into GitHub, and Comments on Your Pull Requests tools AccessLint Sponsor
Font Awesome Free 5 Now Available on GitHub tools Fort Awesome
LCUI: A C Library for Building Desktop UIs with C, XML and CSS code Like C? Like Web technologies? Here’s a lightweight way to marry the two if building small desktop apps. Liu Chao
|