Best of JavaScript, HTML & CSS – Week of April 21, 2014

by Brian Rinaldi on May 1, 2014

So much good stuff to cover this week! I was away on vacation without Internet access (can you believe it!?!), so this post covers the past two weeks. This week features a ton of CSS, SVG and ES6. Anyway, lots to cover, so I won’t waste any more of your time on intros.

Tutorials

An awesome demo recreating the title theme of True Detective using CSS by Tyler Gaw.
CSS True Titles

An excellent article by Sara Soueidan going in depth into the new CSS shapes specification.
CSS Shapes 101

Good comparison of inline SVG vs icon fonts by Chris Coyier. tl;dr: SVG is better if you can live with the browser support.
Inline SVG vs Icon Fonts [CAGEMATCH]

Learn how to animate inline SVG using CSS from Chris Coyier.
Animating SVG with CSS

A great list of little known CSS quirks, some more useful than others, from Louis Lazaris.
12 Little-Known CSS Facts

Hans Muller explores options for adding captions to images in HTML and CSS.
Captioneering

Stephen Greig shows how much you can do with the CSS timing function for CSS transitions and animations.
Understanding CSS Timing Functions

Daniel Buchner shows how you can achieve element queries, which are like media queries but on a specific DOM element, using current browser technology.
Preview: Element Queries, From the Feet Up

Aurelio De Rosa explains the web notifications API and shows how to use it.
An Introduction to the Web Notifications API

Nicholas Zakas explains how ES6 proxies let you create defensive objects that can prevent common type-checking errors.
Creating defensive objects with ES6 proxies

Jack Franklin begins a series on ES6 features with an in-depth look at arrow functions.
Real Life ES6 – Arrow Functions

Web Components are hot, but Christian Heilmann warns us to avoid making some mistakes with them that could lead us astray.
Web Components and you – dangers to avoid

Libraries and Frameworks

Raymond Camden explains ngrok, a service that allows any sort of local web service to be exposed to the Internet for testing.
Expose Yourself with ngrok

Toby Ho shows how to use Page, a client-side routing micro library useful for building single-page applications.
Single-Page Applications with the Page Micro Library

Your site can access Amazon Web Services without a back-end using the new JavaScript SDK – Saad Mousliki shows how.
Using the AWS JavaScript SDK in the Browser

A solid introduction to the React framework by Jim Cowart focused on building an actual application.
A Thrown-to-the-Wolves-Hands-On Introduction to React

A good look at how to use popular front-end UI libraries without adding unnecessary weight to your app by TJ VanToll.
Using UI Libraries Without the Bloat

Mary Lou created some very cool page loading animations using SVG animations and snap.svg.
Page Loading Effects

Donovan Hutchinson looks into a tool called Wraith for testing responsive designs.
Wraith

Julian Shapiro says that JavaScript is secretly faster for animations using libraries like Velocity.js and GSAP.
CSS vs. JS Animation: Which is Faster?

Alex Young says that as of version 1.11, you can use jQuery UI with AMD compatible loaders like Require.js.
Using jQuery UI with AMD

Johannes Schickling shows how to use Gulp.js to run a local web server with built-in livereload support.
Gulp as a Development Web Server

Mobile

Paul Bakaus documents and discusses six common mobile web development pitfalls and barriers.
Common mobile web development pitfalls

You can now use Kendo UI Mobile with AngularJS using Angular Kendo UI and Burke Holland shows how to get started.
Announcing Support For Kendo UI Mobile With AngularJS

A great guide on implementing remote debugging for hybrid app development on iOS, Android and Windows Phone by TJ VanToll.
A Concise Guide to Remote Debugging on iOS, Android, and Windows Phone

Etc.

I’m proud to announce the Mobile Web Weekly email newsletter, my new collaboration with Holly Schinsky and Cooper Press.
Mobile Web Weekly: A Free, Weekly Email Newsletter

Lukas White shares a overview and review of the open source Brackets code editor.
A Review of the Brackets Editor

According to research, presented here by Tammy Everts, using a CDN may not improve performance.
New findings: Retail sites that use a CDN are slower than sites that do not*

Brian Rinaldi

Brian Rinaldi is the founder of Flippin' Awesome. Brian works as the Developer Content Manager at Telerik (though this site is not affiliated with his employer) focused on ensuring that the Developer Relations team creates top notch content for the web development community. Previously, Brian focused on publishing HTML, CSS and JavaScript developer content for the Adobe Developer Connection at Adobe.

Brian has published in a variety of technical publications over the years, has presented at numerous conferences and events and has served as a technical editor on a number of books.

You can read Brian's blog archive with 9+ years of content at remotesynthesis.com (he still posts, infrequently). You can find a full list of Brian's past publications and presentations. Follow Brian on Twitter @remotesynth.