August 23, 2017


Frontend Focus

Issue 304 — August 23, 2017
A great introduction to Custom Elements – they allow web developers to define new HTML tags, extend existing ones, and create reusable web components.
Eric Bidelman
A fantastic exploration of how work on the experimental Servo browser is beginning to feed into regular Firefox, starting with a new high performance CSS engine.
Lin Clark

Join Kyle Simpson, author of the popular “You Don’t Know JavaScript” book series, as he deep dives into JavaScript’s core mechanics like scope, closure, this and prototypes ..plus new features in ES6 and more.
Frontend Masters
  Sponsor
Chrome Beta and Chrome Dev releases can now be installed and used at the same time as stable Chrome on Windows, Android and Linux. macOS is yet to come in the future.
Google
Ivaylo Gerchev guides you step by step in creating attractive HTML and CSS web presentations using the WebSlides framework.
SitePoint
Sketch is an increasingly popular design tool on macOS. This tutorial explains how to use WebViews to create a plugin for Sketch using HTML, CSS and JS.
Zachary Schuessler
Although the padlock remains an iconic indicator of security, Matt Holt proposes a ‘trust indicator’ to take its place.
Matt Holt
Dominic Elm takes a look at a few different approaches to motion in modern web apps, including Angular’s built-in animation system based on the Web Animations API.
thoughtram

Jobs

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

In Brief

From Firefox 55 On, Selenium IDE Will No Longer Work news
Selenium

Mozilla Pondering Collecting Anonymized Browsing Data? news
Mozilla

Making The Web Smoother with Independent Rendering news
Changes to the Edge rendering engine.
Bogdan Brinza

Building a simple To Do web app with Stitch, React, and MongoDB tutorial
This short tutorial will get you started with MongoDB Stitch.
MONGODB  Sponsor

Be Careful with Sub-Elements of Clickable Things tutorial
Gotchas when attaching event handlers to sub-elements.
Chris Coyier

Using Code Snippets in Chrome Developer Tools tutorial
Alex Kras

9 Tips for More Maintainable CSS tutorial
Joe Reynolds

‘font-size’: An Unexpectedly Complex CSS Property tutorial
A run-through of the hidden complexities of the CSS font-size property.
Manish Goregaokar

150 Tips For Using Chrome DevTools tutorial
Over 150 handy animated gifs showcasing how to use Chrome DevTools.
Umar Hansa

Creating Photorealistic 3D Graphics on the Web tutorial
Engin Arslan

Making the Web More Accessible With AI story
The tale behind a Chrome extension that auto-populates ‘alt’ text on images.
Abhinav Suri

Coder Frozen in 2009 Awakens to Find Frontend Development Not Awful story
Richard Schneeman

.NET and WebAssembly: Is This the Future of the Front-End? opinion
Scott Hanselman

Chris Coyier on the Future of Web Development in 4 Videos video
Media Temple

Turbocharge your website in minutes ? tools
Over 150,000 developers trust Pusher to add features like real-time chat & live UI updates to their websites.
Pusher  Sponsor

Gridzilla: A Responsive, Mobile-First Flexbox Grid System code
Mostafa Fouad

Songbird: Spatial Audio Encoding on the Web code
A real-time spatial audio encoding JavaScript library for WebAudio applications. Repo here.
Google

A Pure CSS Textured Neon Text Effect demo
CodePen

CSS-Only Directionally Aware Hover demo
This is a neat little demo, showing a directionally aware hover effect in pure CSS.
Giana Blantin





Source link