Over a million developers have joined DZone.

Best of JavaScript, HTML & CSS - Week of March 25, 2013

DZone's Guide to

Best of JavaScript, HTML & CSS - Week of March 25, 2013

· Web Dev Zone ·
Free Resource

Jumpstart your Angular applications with Indigo.Design, a unified platform for visual design, UX prototyping, code generation, and app development.

This is a very, very full update this week. I also have my own announcement to make. I have recently launched a new site featuring articles and tutorials for web designers and developers called FlippinAwesome.org. I have already begun posting a multi-part series teaching PhoneGap Build as well as some great contributions from Jen Looper and Aurelio De Rosa. Please check it out and share your thoughts - and I am hoping I can make this a valuable ongoing resource for you.


Jonathan Sampson and Ralph Whitbeck show how to build Windows Store apps for Windows 8 using jQuery.
Building Windows Store Applications With jQuery 2.0

Boris Smus shows how to serve high quality images on the web today, without polyfills, JavaScript and CSS hacks.
Easy High DPI Images

Chris Coyier shows how to have elements slide-in as you scroll down similar to the G+ app on Android using CSS and JavaScript.
Slide In (as you scroll down) Boxes

Zoe Gillenwater demonstrates that you can add a CSS transition to the z-index property but it might not work as you expect.
CSS3 transitions and z-index

Very cool tutorial by Donovan Hutchinson shows how to make a 3D rotating iPhone with CSS.
Make a 3D iPhone with CSS

Bem Jones-Bey explains what "shape-outside" is in CSS exclusions and how to use it.
Freeing the Floats of the Future From the Tyranny of the Rectangle

Hans Muller uses CSS exclusions to create a polygonal shape-inside that penetrates an HTML element's content box.
Hans Muller's WebKit Blog: Penetrating Text

Kevin Dangoor shows how the Brackets Quick Open feature was built and the JavaScript used to get the best matches.
Brackets Quick Open: That’s No Regex!

Divya Manian examines the practice of using long decimal percentage values in responsive design, how it can break in Safari and alternatives you can use.
Using decimal percentage values in responsive design

Alex Sexton shares tips and techniques for optimizing and deploying large JavaScript applications.
Deploying JavaScript Applications

Philip Walton shares some strategies for dealing with the global nature of CSS, whether in your own project or when creating a library.
CSS: Everything is global and how to deal with it

Libraries and Frameworks

Burke Holland examines Angular Directives, explaining what they are, what problems they solve and how you can use them to create your own re-usable components.
AngularJS Directives and The Computer Science of JavaScript

Kris Schultz teaches the basics of AngularJS by walking through building your first application using the framework.
Getting started with AngularJS

Alex Young continues his Backbone.js tutorial series, updating to version 1.0 and adding new functionality.
Backbone.js Tutorial: Updates for 1.0, Clear Complete

Tom Coleman shows how to quickly prototype web applicatoins with Meteor and Meteorite.
Prototyping with Meteor

Scott Douglass shows how to get your environment set up to begin building EmberJS applications.
Ember: Up and Running

Node 0.10 includes significant changes to the streams module ad Alex Young explains everything you need to know.
Five Minute Guide to Streams2


I posted the first three parts of a multi-part series walking you through creating your first mobile application with PhoneGap Build and jQuery Mobile.
Create Your First Mobile App with PhoneGap Build

Saad Mousliki demonstrates how to build a contact manager app using HTML, JavaScript, Wakanda Studio and PhoneGap.
Build a Contacts Management App Using HTML5, JS, CSS3, and Wakanda Studio

Raymond Camden documents his experiences integrating the Google Analytics plugin with PhoneGap and PhoneGap Build.
Google Analytics and PhoneGap

New and Updated Libraries and Frameworks

CSSDB is a curated collection of CSS, Sass, LESS and Stylus libraries.
CSSDB: A Database Of CSS Libraries

ScreenCheck is a cool responsive web design tool for testing your website at different screen resolutions.
CyberCrab - Responsive Resolution Tester

Matteo Bicocchi released a new library based on his efforts to get HTML5 audio to work properly on mobile.
Making HTML5 audio actually work on mobile

PeerCDN uses WebRTC to serve a site's static resources over a peer-to-peer network of visitors currently on the site.

Enyo 2.2 was released including Windows 8, Windows Phone 8 and BlackBerry 10 support.
Enyo 2.2: Even More Platforms, List Madness

screenfull.js is a wrapper for cross-browser usage of the JavaScript fullscreen API.
screenfull.js demo

The Brackets Sprint 22 Build includes many of the most requested code editing features and extension installation.
Brackets Sprint 22 Build

Bootstrap Tag Autocomplete is a Bootstrap plugin to autocomplete Twitter-style tags for contenteditable div elements.

cdnjs is a new, open-source CDN that hosts any library - from JavaScript, CSS, SWF and more.
cdnjs - the missing cdn

Bespoke.js is a microframework for you to build your HTML presentations on.


Mozilla and Epic Games port Unreal Engine 3 to the browser using a "highly optimized version of JavaScript."
Mozilla and Epic Games port Unreal Engine 3 to the browser, no plugins necessary

Hakitzu: Code of the Warrior is a strategy game designed to teach kids JavaScript while controlling their characters.
'Hakitzu' Teaches Kids to Code With Robot Warriors

Nintendo releasing Nintendo Web Framework, a new tool for building apps for the Wii U using HTML 5 and JavaScript.
Nintendo hopes to win app and web devs to Wii U with JavaScript tools

John McCutchan shows how you can profile mobile HTML5 Apps remotely using Chrome DevTools.
Profiling Mobile HTML5 Apps With Chrome DevTools

Addy Osmani covers a number of useful Chrome DevTools extensions for popular frameworks and tools.
DevTools Extensions For Web App Developers

Take a look at an Indigo.Design sample application to learn more about how apps are created with design to code software.


Published at DZone with permission of

Opinions expressed by DZone contributors are their own.

{{ parent.title || parent.header.title}}

{{ parent.tldr }}

{{ parent.urlSource.name }}