Warning: include_once(js/ie.php): failed to open stream: No such file or directory in /home3/gcalas/public_html/tut7.com/wp-content/themes/bigfeature/header.php on line 15

Warning: include_once(): Failed opening 'js/ie.php' for inclusion (include_path='.:/opt/php54/lib/php') in /home3/gcalas/public_html/tut7.com/wp-content/themes/bigfeature/header.php on line 15

JavaScript Tools of the Trade: JSBin

February 4, 2014  |  Wordpress  |  , , ,  |  Comments Off

We’ve all been there. There are times when you simply want to throw some JavaScript code up and see how it works. Sure, you could go through the hassle of:Setting up a dedicated directoryCreate a file with markupFinding the latest version of your favorite libraries, downloading them and including them in your codeCreating your stylesheetConfiguring your webserverThat seems like an awful lot of work just do do some simple code testing. Thankfully there are tools that make this type of work trivial.In this tutorial, I’d like to go over one of my favorite tools for interactive JavaScript testing, JSBin.The Case...

Read More

Creating Brackets Extensions

February 3, 2014  |  Wordpress  |  , ,  |  Comments Off

A little while ago I wrote about the recent updates to the Brackets editor. Brackets is an open source project focused on web standards and built with web technologies. It has a narrow focus and therefore may not have a particular feature you’ve come to depend upon. Luckily, Brackets ships with a powerful extension API that lets you add any number of new features. In this article, I’m going to discuss this API and demonstrate how you can build your own extensions.It is crucial that you remember that Brackets is in active development. This article is being written in December...

Read More

JavaScript Animation That Works (Part 2 of 4)

January 30, 2014  |  Wordpress  |  , , ,  |  Comments Off

In the last post, we introduced the idea of spriting, an easy way to animate in JavaScript that works in all browsers. We also walked through how to set up the sprite as a background image for a div and then use a line of JavaScript to change the background position to make it appear as if the image has moved. In this post, we will use this technique to animate both running and jumping motions. In order to create the animation, we will need to quickly change the background position at a regular interval. Take a look again...

Read More

Working With LESS and the Chrome DevTools

January 21, 2014  |  Wordpress  |  , , ,  |  Comments Off

This is a complete tutorial to using LESS with Chrome’s DevTools. If you’ve already used Sass with Chrome’s DevTools, you’ll most likely already be familiar with the concepts introduced here.The Tl;drLESS has very recently added support for Source Maps, so this is new and exciting!DevTools mapping means you can view LESS styles for all your relevant CSS.Edit LESS source files within DevTools and have them save to disk.Source Map adoption is improving with Sass, CoffeeScript, UglifyJS2 and more.IntroductionNot too long ago, the Chrome DevTools added a number of IDE-like features (and continues to do so), one of which is the...

Read More

SOLID: Part 2 – The Open/Closed Principle

January 20, 2014  |  Wordpress  |  , , ,  |  Comments Off

Single Responsibility (SRP), Open/Closed (OCP), Liskov’s Substitution, Interface Segregation, and Dependency Inversion. Five agile principles that should guide you every time you need to write code.DefinitionSoftware entities (classes, modules, functions, etc.) should be open for extension, but closed for modification.The Open/Closed Principle, OCP in short, is credited to Bertrand Mayer, a French programmer, who first published it in his book n Object-Oriented Software Construction in 1988.The principle rose in popularity in the early 2000s when it became one of the SOLID principles defined by Robert C. Martin in his book Agile Software Development, Principles, Patterns, and Practices and later republished...

Read More