Webmaster Tools: The Best Education of 2012: Month By Month

The Best Education of 2012: Month By Month:

Well, 2012 has come to a close. A plethora of excellent tutorials and articles were published throughout the year, both here on Nettuts+ and elsewhere around the web. To document the year, I compiled a list of sixty of the best tutorials, month by month. You’ll likely find a few that you missed along the way!

January

Learn jQuery in 30 Days
Sometimes, it’s easy to become overwhelmed by how much there is to learn in this industry. If jQuery happens to be on your personal “need to learn soon” list, then check out Jeffrey Way’s course "Learn jQuery in 30 Days". If you’ll give him fifteen minutes a day for the next month, he’ll help you become a jQuery pro – and it’s free!
.htaccess for the Rest of Us
.htaccess files are used to configure Apache, as well a range of other web servers. Despite the .htaccess file type extension, they are simply text files that can be edited using any text-editor. In this article, we’ll review what they are, and how you can use them in your projects.
HTML5 Please
Look up HTML5, CSS3, etc features, know if they are ready for use, and if so find out how you should use them – with polyfills, fallbacks or as they are.
Understanding MVC and MPV for JavaScript and Backbone Developers
Before exploring any JavaScript frameworks that assist in structuring applications, it can be useful to gain a basic understanding of architectural design patterns. Design patterns are proven solutions to common development problems and can suggest structural paradigms to help guide us in adding some organization to our application.
High Performance HTML5
Steve Souders discusses the impact of website speed on users providing advice on creating high performance HTML5 applications.

February

Wrangle Async Tasks with jQuery Promises
Promises are an exciting jQuery feature that make it a breeze to manage async events. They allow you to write clearer, shorter callbacks and keep high-level application logic separate from low-level behaviors. Once you understand Promises, you’ll want to use them for everything from AJAX calls to UI flow. That’s a promise!
How to Customize Your Command Prompt
I’ve been getting this question a lot: “how did you get your terminal to look the way it does?” If you’ve noticed my terminal and are curious about how I set it up, this is the tutorial for you! Of course, what you learn here will be enough to get you started on creating your own custom command prompt, as well!
Using JavaScript Prototypes with MVC
In this article, we will review the process of using JavaScript, from an MVC-based perspective, to manipulate the DOM. More specifically, we’ll engineer our JavaScript objects, their properties and methods, and their instantiations parallel to the intended behavior of our Views (what the user sees).
Musings on Proprocessing
I’ve been using SASS for pretty much everything I do recently. Here’s some musings on the journey. From hold-ups, to trip-ups, to turn-offs. From apps and teams to workflows and syntax.
It’s Curtains for Marital Strife Thanks to getUserMedia
getUserMedia is an API that gives a web page access to a user’s camera and microphone via JavaScript. It’s supported in Opera 12 and Opera Mobile 12 for Android, and WebKit in Chrome Canary builds (instructions). Like many other APIs, it’s not part of the “real” HTML5 spec. It started life as the HTML5 element, then got moved into the W3C as part of the webRTC specifications. But let’s not taxonomise when we could be having fun.

March

Building a Contacts Manager Using Backbone.js
In this tutorial, we’re going to look at building a fully functional contacts manager using Backbone.js, Underscore.js, and jQuery. We’ll take a look at the basic components that make Backbone tick as well as some of the convenience methods exposed by Underscore. (See the whole session.)
Create Instagram Filters with PHP
In this tutorial, I’ll demonstrate how to create vintage (just like Instagram does) photos with PHP and ImageMagick. Wait? What? Yes, you can do this very thing with PHP and ImageMagick, and that’s just scratching the surface!
It’s Time to Start using JavaScript Strict Mode
ECMAScript 5 introduced strict mode to JavaScript. The intent is to allow developers to opt-in to a “better” version of JavaScript, where some of the most common and egregious errors are handled differently. For a while, I was skeptical, especially with only one browser (Firefox) initially supporting strict mode. Fast forward to today, every major browser supports strict mode in their latest version, including Internet Explorer 10 and Opera 12. It’s time to start using strict mode.
Thining Async
Here’s the rub: when you load JavaScript from a third party you should do it asynchronously. You might want to load your own scripts asynchronously too, but for this article let’s focus on third parties.
Vendor Prefixes are not Developer-Friendly
The premise of prefixes makes unrealistic demands on how developers maintain sites. There’s a lot of conversation about making prefixes work (by changing policy), but I believe they already are at odds with the developer workflow.

April

Closures: Front to Back
Closures are often viewed as an arcane art in the land of JavaScript. Once mastered, they allow you to write some truly amazing JavaScript. This article will get you up to speed on the magic of JavaScript closures.
Meeting Grunt: The Build Tool for JavaScript
If you’re working on a large project, you’ll no doubt have a build script or a bunch of task scripts to help with some of the repetitive parts of the process. You might use Ant or Rake, depending on the language the project is written in. But what do you use if the project is primarily JavaScript? That’s the problem Ben Alman set out to solve when he created Grunt.
CSS Sprites Revisited
I’m pretty confident that I won’t surprise anyone here by saying that CSS sprites have been around for quite a while now, rearing their somewhat controversial heads in the Web development sphere as early as 2003.
Creating a Mobile-First Responsive Web Design
As the web landscape becomes increasingly complex, it’s becoming extremely important to deliver solid web experiences to a growing number of contexts. Thankfully, responsive web design gives web creators some tools for making layouts that respond to any screen size. We’ll use fluid grids, flexible images and media queries to get the layout looking great regardless of the size of the device’s screen dimensions.
A Baseline for Front-End Developers
I wrote a README the other day for a project that I’m hoping other developers will look at and learn from, and as I was writing it, I realized that it was the sort of thing that might have intimidated the hell out of me a couple of years ago, what with its casual mentions of Node, npm, Homebrew, git, tests, and development and production builds.

May

SSH: What and How
Many web developers use SSH (“Secure Shell”) on a daily basis to manage their servers, back up files, work remotely, and a myriad of other tasks. Today, I’ll explain what SSH is, do a brief history review, and, lastly, teach you how to set it up on your remote server or even your local network. Let’s get started!
10 Things I learned With Interning at YUI
For eight months, I had the opportunity to intern with the YUI Team at Yahoo, while I was completing my engineering degree. Today, I’d like to share the top ten things that I learned from my experience with YUI.
Gem Creation with Bundler
Building a gem used to be a complex task that would require either a precise knowledge of the gem format, itself, or some dedicated tools to generate a suitable boilerplate. These days, we can use the excellent Bundler to remove this complexity and keep the amount of generated code to a minimum.
PHP Database Access: Are You Doing it Correctly?
We’ve covered PHP’s PDO API a couple of times here on Nettuts+, but, generally, those articles focused more on the theory, and less on the application. This article will fix that! To put it plainly, if you’re still using PHP’s old mysql API to connect to your databases, read on!
JavaScript Design Patterns
This time around, you learn about the Adapter, Decorator, and Factory patterns.

June

Key Principles of Maintainable JavaScript
JavaScript is a curious language. It’s easy to write, but difficult to master. By the end of this article, hopefully, you’ll transform your spaghetti code into a five-course meal, full of readable, maintainable yumminess!
Building Web Applications from Scratch with Laravel
In this Nettuts+ mini-series, we’ll build a web application from scratch, while diving into a great new PHP framework that’s rapidly picking up steam, called Laravel — a simple and elegant PHP 5.3 framework.
Understanding Hash Functions and Keeping Passwords Safe
From time to time, servers and databases are stolen or compromised. With this in mind, it is important to ensure that some crucial user data, such as passwords, can not be recovered. Today, we are going to learn the basics behind hashing and what it takes to protect passwords in your web applications.
Classes? Where we’re Going, We Don’t Need Classes!
Classes, classes, classes everywhere. What if we don’t need CSS classes at all? What if we stopped worrying about how many classes we’re using and what we should be calling them and just finished with them once and for all? It would be no revelation to you to say that HTML elements can be styled without recourse to the class attribute, but have you considered the multitude of benefits that come from forgoing classes altogether?
Writing an AngularJS App with an Express + Node.js Backend
AngularJS is like the missing Batarang on your utility belt of web development awesomeness. It gives you two-way data binding that’s both easy to use and fast, a powerful directive system that lets you use create reusable custom components, plus a lot more. Express is an excellent webserver for Node.js that provides routing, middleware, and sessions. Incidentally, the two work quite well together!

July

The Principles of Agile Development
Agile or Agile Development – we hear these words more often these days. But do we really know what it is all about? How can it help us become more effective, while having lots of fun developing software? How can we use it to communicate with business people and make this communication easy and constructive for both sides?
From FTP to Git: A Deployment Story
Once upon a time, there was a file. It was on your computer, and you wanted to get it on a server. Ever wondered why there are so many ways to do that? We’ll explain some of the basics of deployment in this article so you understand when to use what. Let’s get started!
Test-Driven Development in PHP: First Steps
Let’s admit it: the PHP community has lagged a bit, when it comes to advocating test-driven development. We know we should, but, even to this day, a sizable portion of the community does not. In this new series of videos and tutorials, created by the Nettuts+ team, we’re hoping to change that. Trust me: it’s not as tough as you think.
Ping-Pong Game Tutorials with HTML5 Canvas and Sounds
Making games in HTML5 Canvas is not that hard once you learn the logic of the game you are creating. In this tutorial, you will learn how to create a not-so-basic ping-pong game in Canvas. First of all, lets take a look on the main concept and some basic logic behind this game.
How I Learned Backbone.js, Three.js, and GLSL in One Week
Last week was the 7dfps challenge, an open challenge where participants had to make a FPS in only one week. Such contests are very very interesting for those who want to experiment with things. Challenging yourself is IMO the best way to learn new things. You may also know the famous “Ludum Dare” contest. I learned to use Backbone.js and Three.js (a famous library on top of WebGL) in only one week, so you have no excuse to not be able to do the same

August

Game On: Backbone and Ember
So you’ve accepted the challenge to go thick on the client-side; well done. You’ve considered all the frameworks out there and are unsure which one to choose? You’re not alone. Read on.
Vagrant: What, Why and How
This article will help walk you through using Vagrant to manage your virtual machine instances, and explain how you can take advantage of Puppet to provision various resources, like PHP and PostgreSQL.
Node.js for Beginners
Event-driven programming can be overwhelming for beginners, which can make Node.js difficult to get started with. But don’t let that discourage you; In this article, I will teach you some of the basics of Node.js and explain why it has become so popular.
Magazine-lika Layout for the Web with CSS Regions and Exclusions
The most frequently asked question I get since posting my responsive navigation patterns article is: How do I handle complex navigation for responsive designs?”
Writing a Command Line Node Tool
Today we are going to combine a few different tools and create a simple Node package that will allow a user to search a directory for files. In this tutorial we will use Grunt to do a lot of the work for us, see how to to make a Node script executable on the command line, and finally see how we publish it to the Node Package Manager (npm) so anyone can install it.

September

Organizing Enterprise-Level Applications
Organization can make or break the maintainability of an application. With smaller applications, organization is more obviously apparent; however, as the application grows and as the number of application developers and front-end engineers producing code increases, the more confusing organization can become. In this post, we will go over some basic concepts for keeping applications organized so that finding relevant code is an efficient and systematic process.
Hands-On Unit Testing With PHPUnit
In this screencast, we’ll build a relatively simple class, using TDD techniques. Along the way, we’ll discuss various PHPUnit methods, how to create mock objects, and more! I encourage you to work along; it’s the best way to learn!
Understanding Backbone.js and the Server
Most Backbone tutorials will describe the process of sending RESTful requests to the server. But, how do we capture that data with our server-side framework? How do we know what the request urls are? How do we monitor these requests using Chrome Dev Tools? I’ll show you all of that and more in this screencast.
Rundown of Handling Flexible Media
When you take the responsive web design route, part of the deal is fluid grids. That is, container elements set in percentage widths. Just one example: an
that holds a blog post might be 320px wide on a small screen device and 690px wide on some large screen. Text can be resized and will flow nicely to fill a container. That’s not too hard. But media – images, video players, and audio players – demand a bit more attention (e.g. a video that sticks off the edge of the screen == bad). This post is to round up the methods of handling that.
HTML5 Web Storage – Cookies are so 1994
In this two part series, we’re going to look at Web Storage, one of the best and most interesting features to come out of the HTML5 spec. We’ll look at the history of both Web Storage and cookies.

October

Make JavaScript Testing Fun with Testem
JavaScript testing is a sensitive subject. Some developers are huge advocates of it (including myself), while others don’t see the need or benefit. One huge barrier is the simple fact that it can sometimes take a considerable amount of setup to get up and running. The longer it takes, the more likely it is that the developer simply won’t bother. That’s why Testem is so fantastic; it makes testing as effortless as possible, and, more importantly, fun!
Getting Started with Web Workers
One of the many design goals of the JavaScript language was to keep it single-threaded and, by extension, simple. Though I must admit that, given the idiosyncrasies of the language constructs, it is anything but simple! But what we mean by being “single-threaded” is that there is only one thread of control in JavaScript; yes, sadly, your JavaScript engine can do only one thing at a time. Now, doesn’t that sound too restrictive to make use of multi-core processors lying idle on your machine? HTML5 promises to change all of that.
Namespacing in PHP
It’s been a bumpy ride, in regards to namespace support in PHP. Thankfully, it was added to the language in PHP 5.3, and the applicable structure of PHP code has improved greatly since then. But how exactly do we use them?
Step by Step: From jQuery to Backbone
I’ve seen many struggle when they first meet Backbone.js. In this blog post I will gradually refactor a bit of code from how I used to write JavaScript before, into proper Backbone.js code using models, collections, views and events. Hopefully this process will give you a firm understanding of the core abstractions in Backbone.js.
Contraint Validation: Native Client Side Validation For Web Forms
Validating forms has notoriously been a painful development experience. Implementing client side validation in a user friendly, developer friendly, and accessible way is hard. Before HTML5 there was no means of implementing validation natively; therefore, developers have resorted to a variety of JavaScript based solutions.

November

20 All Too Common Coding Pitfalls For Beginners
Regardless of our current skill level, we all were beginners at one point in time. Making classic beginner mistakes comes with the territory. Today, we’ve asked a variety of Nettuts+ staff authors to chime in with their list of pitfalls and solutions – in a variety of languages. Learn from our mistakes; don’t do these things!
Why Haskell?
Being a purely functional language, Haskell limits you from many of the conventional methods of programming in an object-oriented language. But does limiting programming options truly offer us any benefits over other languages? In this tutorial, we’ll take a look at Haskell, and attempt to clarify what it is, and why it just might be worth using in your future projects.
Testing JavaScript with PhantomJS
I don’t think I need to convince you that testing your JavaScript code is a good idea. But, it can sometimes prove tedious to test JavaScript code that requires a DOM. This means you need to test your code in the browser and can’t use the terminal, right? Wrong, actually: enter PhantomJS.
JavaScript APIs You’ve Never Heard of (and Some You Have)
This week I was scheduled to give a brand new talk at YUIConf entitled, JavaScript APIs you’ve never heard of (and some you have). Unfortunately, a scheduling conflict means that I won’t be able to attend. So instead of letting the work of putting together a brand-= new talk go to waste (or otherwise be delayed) I decided to put together a screencast of the talk.
Code Smells in CSS
My day-to-day life is spent working in-house at BSkyB… I work on big websites, the last of which took me over a year to build the front-end for (and it’s still ongoing). For me, in my world, bad CSS is a very specific and troublesome thing; when you’re working on one site for months on end, you can’t afford poor code, be it CSS or otherwise, and any bad code needs righting.

December

Apache: Aliasing and Redirection
It’s common for a client to send a request for a file that either does not exist on the server, or exists in a different location. This can occur for a variety of reasons. You might move your files around the server (or to a completely different server), or you may want to present a logical file system structure to connecting clients.
Essential Command-Line Tools for Web Developers
Tools can make our workflows feel seamless, allowing us to focus on what we are building, and not worry about the process. Most web developers, on all portions of the stack, work from the command-line. There are countless utilities, which can make you more productive. These aren’t full blown command-line applications, such as Git, but rather simple and composable tools, which can improve your workflow as a web developer.
Dependency Injection in PHP
Dependency injection has been a frequent subject of discussion among many corporate developers in the past few years. Many feared that they might sacrifice too much time building their application architecture without doing any real work. In this article, I’ll explain why PHP developers should consider taking advantage of dependency injection, when building large, scalable projects.
How to Make Your Site Look Half-Decent in Half an Hour
Programmers like me are often intimidated by design – but a little effort can give a huge return on investment. Here are one coder’s tips for making any site quickly look more professional. I am a programmer. I am not a designer. I have a degree in computer science, and I don’t mind Comic Sans. (It looks cheerful. Move on.)
Persistent Terminal Sessions
Have you ever had a remote terminal session running, only to have your connection drop out half way through a large task? Then, you reconnect, not knowing anything about its progress (if any) and current status. Screen is the solution to this problem. Screen allows you to start terminal sessions that you can disconnect from and resume at any time.