Wednesday, September 5, 2012

Best of JavaScript, HTML5 & CSS3 - Week of August 27, 2012

Best of JavaScript, HTML5 & CSS3 - Week of August 27, 2012:
There was no shortage of anything this week, as you can see below. There were a ton of tutorials and a lot of new or updated libraries. Some notable items include a new version of HTML5 Boilerplate, a Grunt task for maintaining icons called Unicon, a new version of CreateJS, and DOMvas a tool for writing arbitrary HTML to a canvas element. These are just a handful of the items, but read on for so much more.

Tutorials

position: sticky landed in the WebKit nightly and Chrome Canary and Eric Bidelman explains how it works.

Stick your landings! position: sticky lands in WebKit

Arley McBlain explains how to use responsive web design techniques to make your content vertically responsive.

Responsive Web Above The Fold

Dmitry Baranovskiy posts a good introduction to JavaScript types and how they are implicitly converted.

JavaScript: Types

See how Cross-Origin Resource Sharing (CORS) allows you to connect to 3rd party APIs without browser security warnings.

Understanding Cross-Origin Resource Sharing (CORS)

Alex Young continues his JavaScript 101 series by discussing equality and strict equality.

JS101: Equality

Rick Waldron covers new behavior in the JavaScript Object.observe spec that can notify programs of mutations to objects.

JavaScript Object.observe

Pamela Fox shows how to create an autocomplete for location using the Google Maps' Autocomplete API.

Using the Maps API Autocomplete for User Profile Location

Eric Bidelman demonstrates techniques for importing large numbers of files/folders into the Filesystem API.

Integrating input[type="file"] with the Filesystem API

Johnny Simpson shows how to use CSS transitions and transforms to create a round, rotating menu.

The Creation of a CSS3 Clickable, Rotating Menu

Matty Collins shares a technique using only CSS, without JavaScript, to hide and show off-screen elements, in this case checkboxes, on mobile.

CSS :target for Off-Screen Designs

Libraries and Frameworks

A good overview of Edge Animate for web developers by David Deraedt.

Edge Animate for web developers

A new tutorial series by Creative JS teaches advanced file uploading techniques, including chunked uploading, in HTML.

Advanced Uploading Techniques — Part 1

Jeremy Chone shows how to write easier to maintain asynchronous JavaScript using jQuery's $.Deferred().

Asynchronous JavaScript Programming. The Power Of $.Deferred for HTML5 Application

Andrew Trice shows how he integrated OriDomi and App-UI to create folding HTML views.

Folding HTML Views in App-UI

Tyler Craft shows how to create an infographic with multiple area charts and context tool to zoom and pan data with D3.js.

Multiple Area Charts with D3.js

Raymond Camden shares his initial experiences using Node.js and Express.

Thoughts on Node.js and Express

Raymond Camden shows how he built a wrapper for the PhoneGap Build API using JavaScript in Node.

A PhoneGap Build API wrapper in Node

Andy Appleton discusses how he thinks Backbone has made him a generally better JavaScript programmer.

Backbone has made me a better programmer

Claudio Ortlonia walks through building a Backbone app and testing it with Jasmine, all using CoffeeScript.

Building and Testing a Backbone App

Peter Keating details how he develops with LESS for CSS and the workflow that he uses.

Setting up my LESS Environment for CSS

Jose Mota compares Backbone and Ember.

Game On: Backbone and Ember

Mobile

Missed the open Q&A session on PhoneGap/Cordova? Check the transcripts for lots of great info.

Transcript From Open Session on PhoneGap/Cordova

A step-by-step walk through on how to use your own local Weinre server with Adobe Shadow by Joseph.

Use your own Weinre server with Adobe Shadow – Step by step

New and Updated Libraries and Frameworks

Domvas, by Paul Bakaus, is a new project that allows you to take arbitrary DOM content and paint it to a Canvas.

Painting the DOM to Canvas with Domvas

New versions of the CreateJS JavaScript libraries and tools have been released.

New CreateJS Version Launched

Avgrund is a slick jQuery plugin for creating modal boxes and popups that show depth between popup and page.

jQuery plugin for Avgrund

Chirp.js is a lightweight library for easily adding tweets on your site that supports templating & client-side caching.

Chirp.js — Tweets on your website, simply.

Bootstrap 2.1.0 is a big release featuring improved docs, submenus on dropdowns, affix plugin and more.

Bootstrap 2.1.0 released

Dropbox.js is a new library for working with the Dropbox API with client-side or server-side JavaScript.

Some love for JavaScript applications

BookBlock is a jQuery plugin that creates a booklet-like component with a “page flip” navigation.

BookBlock: A Content Flip Plugin

Mobify.js is an open-source, client-side web framework and Node-based client that adapts any website to support any device.

Mobify.js

WebSpecter is an acceptance test framework that runs on PhantomJS and performs BDD-style tests written in JavaScript or CoffeeScript.

WebSpecter

Version 4.0 of HTML5 Boilerplate front-end template is released.

HTML5 Boilerplate

The Filament Group released Unicon, a Grunt.js task for generating CSS files and properly sized PNG files (based upon SVG files) for a variety of browsers and devices.

Unicon: A Grunt.js plugin for managing and delivering sharp icons to all devices

Etc.

Kooky for iPad is an amazing PhoneGap app by Amanita Design (the guys behind Machinarium) and Adobe's Tom Krcha.

Kooky for iPad by Amanita Design released

The Atari Arcade now features classic Atari games rebuilt with HTML5 and the CreateJS framework.

Atari Arcade: Classic Games Reimagined in HTML5

Ryan Stewart shows how to force Chrome to always with Brackets Live Preview support turned on.

Always Starting Chrome with Brackets Live Preview Support

DIGITAL JUICE

No comments:

Post a Comment

Thank's!