Wow, this was a busy week! I know there’s a lot here, but I highly recommend taking the time to read through as there were a lot of important tutorials and releases this week. Some significant releases include new Twitter BootStrap, Bower, UIKit, Ractive.js and more.
From microphone to .WAV with: getUserMedia and Web Audio
Marko Dugonjić looks at a number of methods for setting subheads with CSS.
Setting subheads with CSS
Animating with requestAnimationFrame
Check out this cool code for generating random spherical effects using Marko Švaljek.
Random spherical effects
Louis Lazaris details why the ::selection pseudo-element isn’t in current or future specs though it is widely used.
What’s the Status of the ::selection Pseudo-element?
OOP is Not Your Hammer
Stephen Thomas presents an approach to responsive images supported by all browsers using CSS background images.
Simple Responsive Images With CSS Background Images
Dr. Axel Rauschmayer shows how modules work in ECMAScript 6 and tools that allow you to already use them now.
ECMAScript 6 modules: the future is now
David Walsh shows the HTML and CSS required to build a cube
Create a CSS Cube
Krasimir Tsonev shows some usage examples of CSS before and after pseudo elements
CSS: :before and :after pseudo elements in practice
Libraries and Frameworks
Jonathan Fielding walks through the steps to build you own command line utility using Node.
Writing a Command Line Utility using Node
Tim Severien shows how you can use the Promin jQuery plugin to easily create user-friendly multi-step forms.
Creating Multi-step Forms with jQuery and Promin
Pamela Fox shares an internal best practices guide to writing Backbone apps at Coursera.
A Guide to Writing Backbone Apps at Coursera
Ben Nadel explains his current solution to implement lazy loading of images within an AngularJS application.
Lazy Loading Image With AngularJS
Johnny Simpson reviews a number of bootstraps including Twitter Bootstrap, Foundation, Pure, Cardinal, UI KIt and Topcoat.
Bootstraps and Web Kits: Enemy or Efficient?
Joel Hooks shows how to use ui-router with AngularJS to define states, and transition your application to those states.
The basics of using ui-router with AngularJS
Addy Osmani shares tips and examples of integrating a back-end build process dependent on Maven with a front-end process using Grunt.
Making Maven Grunt.
Arunoda Susirpala demonstrates how to use Meteor Streams to add messaging based, real-time communication with Meteor.
Real-Time Messaging for Meteor With Meteor Streams
Gabriel Manricks walks through the process that Handlebars uses to compile templates.
Handlebars.js – a Behind the Scenes Look
Raymond Camden shares another, better, example of using PhoneGap and Parse to add the ability to upload files in an app.
Better example of PhoneGap, Parse, and uploading files
New and Updated Libraries and Frameworks
Bootstrap 3 RC1 is out with tons of changes, new docs and more.
Bower 1.0 is a total rewrite designed to be much faster with a clear architecture, along with a host of new features.
grunt-express let’s you start an Express.js web server using Grunt, specifying the port and other options.
pointer.js is a utility that helps developers manage touch and click events across devices.
Mobile and Desktop Event Normalization with pointer.js
Ractive.js offers features like data binding, efficient DOM updates and event handling with a short learning curve.
Ractive.js – next-generation DOM manipulation
UIKit is a modular front-end framework featuring a collection of HTML, CSS, and JS components.
Peter Bell shows common problems around rewriting history using Git and how to solve them.
Changing History with Git
This WebGL Water demo by Evan Wallace is pretty amazing (note: doesn’t work in all browsers).
Paul Trani shows how to create a slideshow gallery with Edge Animate with infinite photos loaded dynamically.
How to Create a Slideshow in Edge Animate
Raymond Camden discusses a few Brackets extensions that make it easier to work with GitHub.
Using GitHub with Brackets
Modern Web Newsletter
Subscribe to receive the Modern Web tutorials, sent out every second Wednesday.