Frontend Focus
Issue 300 — July 26, 2017
Adobe is planning to stop updating and distributing Flash at the end of 2020, encouraging creators to migrate Flash content to open formats like HTML5, WebGL and WebAssembly.
Adobe

Manuel Matuzović thinks Grid is “one of the most exciting developments since responsive design” adding that we should “get the best out of it as soon as possible”.
Smashing Magazine

Including contain, writing-mode, and will-change.
Annarita Tranfici

Frontend Masters
Much more than an intro, you’ll not only learn React, but also a proven set of tools including Router v4 for paging, Jest for testing, Redux and Flow!
Frontend Masters   Sponsor

Sebastian Eberlein explores ‘edge cases’ where scaling a fixed layout with viewport units can be a viable solution.
Hacker Noon

In this talk from CSS Day 2017 Rachel explores how the Web Animations API can be used to generate, manipulate and run CSS Animations in the browser. Associated slides here.
Rachel Nabors

Mozilla has prepared a roadmap for Flash support in Firefox, and guides for site authors to make their final transition away from Flash technology.
Benjamin Smedberg

Jobs Supported by Hired.com

Can't find the right job? Want companies to apply to you? Try Hired.com.

In Brief

webpack 3.4.0 Released news
Tobias Koppers

Migrating Games from Flash to Open Web Standards on Facebook news
The social network is working on a migration path for devs that use Flash to power their Facebook games.
Jakub Pudełek

Components will make you a better web developer 
Component IO introduces modular content management you can embed anywhere.
Component IO  Sponsor

An In-Depth Look at the Updated WebCrypto API in WebKit tutorial
Jiewen Tan

A Collection of Interesting Facts about CSS Grid Layout tutorial
Some interesting but useful tidbits about using CSS grid layout.
Manuel Matuzović

You’re Offline: How to Check for Network Changes & React Accordingly tutorial
Your site should adapt to all kinds of situations: “A change in connectivity is one of them”.
Max Böck

How to Bundle a Simple Static Site Using Webpack tutorial
James Hibbard demonstrates how you can use Webpack to bundle a simple static site.
SitePoint

D3 in Depth: An Intermediate Guide to D3 Visualizations tutorial
Peter Cook

Animating with CSS Variables tutorial
Four examples showing how CSS variables can be helpful for animation.
Val Head

How to Use Polymer with Webpack tutorial
Rob Dodson

A Beginner's Guide to HTML5 Cross-Browser Polyfills tutorial
SitePoint

The Core Concepts of Webpack in 23 Minutes video
Tom Friedhof

The History of the Web: How We Got the Favicon story
“Favorite icons” have been with us since 1999.
Jay Hoffmann

Eleven Examples of How WebVR Is Being Used Today story
Yuvesh Tulsiani

Optimizing Performance of A-Frame Scenes for Mobile Devices story
Mozilla Hacks

A Eulogy for Flash opinion
“There’s no doubt in my mind that Flash drove the web forward.”
Bruce Lawson

Video Player with Android & iOS SDKs tools
Easy to integrate Video Player for web browsers (HTML5), Android & iOS, Chromecast, AirPlay, AppleTV, SmartTVs.
Bitmovin  Sponsor

Flow: A Free Typeface Built for Wireframing tools
Replaces text with lines and comes in three weights.
Dan Ross

Fitty: Makes Text Fit Perfectly to Its Container tools
Rik Schennink

Kap: Open-Source Screen Capture Tool That Uses Web Technologies tools
Wulkano

A CSS-Only Image Slider Based on SVG Patterns demo code
Damián Muti