June 21, 2017


Frontend Focus

Issue 295 — June 21, 2017
“to start working with CSS grid, you first need to set aside the habits, assumptions and practices that have enabled you to create advanced CSS-based layouts”
Morten Rand-Hendriksen
A look at the current state of Web Bluetooth support and how it can play an important role in the physical web and projects using beacons and mobile devices.
Jen Looper
A comparison between using pure CSS versus JavaScript’s native API for animation.
Ollie Williams

Attend full-day hands-on React workshops and dozens of talks at ForwardJS San Francisco this July.
ForwardJS
  Sponsor
How to decide what to refactor and when; how to refactor code whilst still shipping features; how to avoid regressions when adding new CSS and more.
Harry Roberts
A look at how payment platform Stripe used several next-gen web technologies to bring their new suite of tools to life.
Benjamin De Cock
Now with scope hoisting, ‘magic comments’, and more. The upgrade process from v2 is also designed to be very smooth.
Sean T. Larkin
“I’ve heard it from lots of lots of developers. The years tick by on their projects, and all they ever seem to do is add to their CSS, never remove.”
Chris Coyier

Jobs

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

In Brief

Handling Long and Unexpected Content in CSS tutorial
How to handle situations where content overruns the designed space.
Ahmad Shadeed

Getting Started with Draft.js tutorial
A framework for creating browser-based text editors.
Julian Krispel

CSS Tips and Tricks for Making Aspect-Ratio Friendly Boxes tutorial
Chris Coyier

Set Up File Persistence with Chrome DevTools Workspaces tutorial
Changes you make in the DevTools can easily be saved to disk.
Google Developers

Faster Page Load Using Lightweight CSS & SVG Animation (without JS) tutorial
Covers the basics of CSS animation, and the process of setting up an animation, exporting an SVG, and adding classes.
Kyle Henwood

Introduction to Webpack: Entry, Output, Loaders, and Plugins tutorial
A step-by-step guide, going from an empty configuration file to a complete setup to bundle a project.
Jeremias Menichelli

Designing A Simple Web Page with mini.css tutorial
Angelos Chalaris

An Introduction to the ‘fr’ CSS Unit tutorial
Robin Rendle

It’s easy to version control your database alongside your application 
Connect your database to your version control system with SQL Source Control and keep track of every change.
Red Gate  Sponsor

Paint the Web with CSS video
Using CSS as an artistic medium to create images and animations made up of pure code.
Eva Lettner

The Illusion of Speed opinion
“If you could take a 50% hit in real world performance and get a site that feels 50% faster, would you?”
Paul Bakaus

What Does a Well-Documented CSS Codebase Look Like? opinion
Kaloyan Kosev

HTML Imports Are The Best Web Component opinion
Ashley Gullen

HEIF: A First Nail in JPEG’s Coffin? opinion
Could Apple’s new image file format be JPEG’s replacement?
Kelly Thompson

$20 Free Credit on a new account. 
Linux cloud hosting starting at 1GB of RAM for $5/mo. Use promo code HTML520 and get $20 credit.
linode  Sponsor

Feather: A Collection of Open Source SVG UI Icons tools
Line-based and monochrome.
Cole Bemis

Cell: A Self-Constructing Web Framework Powered by A Self-Driving DOM code
Intercellular

html5-parser: Fast C-Based HTML 5 Parsing for Python code
Kovid Goyal

Grid Styled: A Responsive React Grid System Built with styled-components code





Source link