Frontend Focus
Issue 190 — May 27, 2015
A look at building a simple drum machine with the Web Audio API with a mixture of synthesizing and sampling sounds.
Chris Lowis

Dave Raggett on how the use of Web technologies will have a big impact on the costs and deployment of Internet of Things (IoT) services and devices.

E-mail is not known as a great venue to experiment with HTML but Litmus have used some clever CSS and HTML trickery to render a ‘live’ Twitter feed within an email on several platforms.
Litmus Blog

See a new and better way to build cross-platform native apps using Web technologies with NativeScript through our launch video, ready to watch right now.
Telerik   Sponsor

The W3C is working with edX to offer a (paid) ‘verified certificate’ you can earn by taking a HTML 5.1 MOOC that starts next week.

“In Chrome 44, and ServiceWorkerRegistration.getNotifications() have been added and simplify some common use cases when dealing with notifications with push messages.”
HTML5 Rocks

To celebrate the release of a new car, a digital artist was commissioned to make a WebGL art piece where particles would be in sync with an engine sound. This is a look at how it came together.
Simo Santavirta

Jobs Supported by

  • Design Technologist at Stamen (San Francisco, CA)Excited by a continuous flow of new projects? Practice creative re-use while trying new things? Can you balance diverse input: creative and technical direction, production expediency, and client feedback? We deliver delight with D3, Leaflet, WebGL, and whatever else the situation demands. Stamen Design
  • Want to work on new projects? Make more money? Try a new stack? Relocate?On Hired, we'll bring the options to you. With over 2,000 pre-screened tech companies in 10 cities in the US UK, you'll be sure to find what you're looking for. Join Hired today.

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

In Brief

YouTube Live Streams Get HTML5 Player And Now Support 60FPS Playback news

Angular U, the Who’s Who of Angular - Jun 22-25 - keynotes from: Brad Igor Misko Crockford and Souders news
In San Francisco, covering Angular 1.x, 2, TypeScript, ECMAScript 6, Web Components and more.
An AngularJS Conference  Sponsor

Last Call Working Draft of CSS Flexible Box Layout Module news
The spec describes a CSS box model (commonly known as ‘flexbox’) optimized for user interface design.

The Art Of The SVG Filter And Why It Is Awesome tutorial
Examples of creating some amazing text effects on regular text using SVG.
Smashing Magazine

Using and Styling HTML5 Meter tutorial
Preethi Ranjit

How to Make High Performance PhoneGap Apps tutorial
Josh Morony

Prevent Chrome from Translating a Page tutorial
David Walsh

How to Recreate Buffer's Loading Animation in CSS tutorial
CSS Animation Rocks

Create Fullscreen HTML5 Page Background Video tutorial
Dudley Storey

Clipboard Hijacking with HTML5 
Tim Branyen

Give back to the developer community-apply to teach today. 
Actively seeking web developers to join our tight knit family of passionate teachers and earn royalties.
Pluralsight  Sponsor

Rocket Packs On Escalators: Stop Messing with Progressive Enhancement video
Christian Heilmann

Slack Logo CSS Animation code demo

Rikulo: A Web and Mobile App Framework using Dart tools
Potix Corporation

react-droparea: HTML5 File Drag and Drop Component code

AudioDrop: Drag-and-Drop Loading of Audio Buffers code
Enables drag-and-drop loading of Audio Buffers from audio files dragged onto an element.
Kyle Stetz