Learning Javascript with Object Graphs (Part II) Static Version The first article using graphs to describe JavaScript semantics was so popular that I've decided to try the technique with some more advanced ideas. In this article I'll explain three common techniques for creating objects. My goal is that this will help people understand the strengths and weaknesses of each technique and understand what's really going on. Classical JavaScript Constructors First let's create a simple constructor function with a prototype. classical.js#rectangle function Rectangle(width, height) { this.width = width; this.height = height;}Rectangle.prototype.getArea = function getArea() { return this.width * this.height;};Rectangle.prototype.getPerimeter = function getPerimeter() { return 2 * (this.width + this.height);};Rectangle.prototype.toString = function toString() { return this.constructor.name + " a=" + this.getArea() + " p=" + this.getPerimeter();}; Now let's define a new class of objects called Squares that inherit from Rectangles. classical.js#test
CSS Sprites: Image Slicing’s Kiss of Death Back when video games were still fun (we’re talking about the 8-bit glory days here), graphics were a much simpler matter by necessity. Bitmapped 2-dimensional character data and background scenery was individually drawn, much like today’s resurgent pixel art. Hundreds and later thousands of small graphics called sprites were the building blocks for all things visual in a game. Article Continues Below As game complexity increased, techniques developed to manage the multitude of sprites while keeping game play flowing. And what does this have to do with the web? Everything old is new again, and though the rise of 3D games has made sprite maps obsolete, the concurrent rise of mobile devices with 2D gaming capabilities have brought them back into vogue. Specifically, we’re going to replace old-school image slicing and dicing (and the necessary JavaScript) with a CSS solution. How do CSS Sprites work? Let’s start with the master image itself. On to the HTML. Applying the CSS#applyingcss
Online Python Tutor - Learn programming by visualizing code execution Learning Javascript with Object Graphs (Part III) Static Version Part I of this series explained basic object graphs and visually described references, closures, and basic inheritance in JavaScript. Part II compared different styles for doing object-oriented programming in JavaScript. Now in Part III we'll get creative and look as Ruby's object model and compare it to how JavaScript works. Also I'll show how to implement some Ruby style classes. Why Ruby Ok, I'll admit, I used to be a ruby guy. Also I chose ruby because I've noticed that several newcomers to the node.js community come from ruby and other languages with similar object systems. What are Objects Both languages are object oriented languages. Methods versus Functions Probably the biggest difference between the object models when you get down to it and ignore syntax is the fact that Ruby has methods and JavaScript has first-class functions. Gotta keep them separated In classical OO, there is this idea that you must separate function from state. Controlled Inheritance A String Ruby
Using the memcached telnet interface This is a short summary of everything important that helps to inspect a running memcached instance. You need to know that memcached requires you to connect to it via telnet. The following post describes the usage of this interface. How To Connect Use "ps -ef" to find out which IP and port was passed when memcached was started and use the same with telnet to connect to memcache. Example: telnet 10.0.0.2 11211 Supported Commands The supported commands (the official ones and some unofficial) are documented in the doc/protocol.txt document. Sadly the syntax description isn't really clear and a simple help command listing the existing commands would be much better. Traffic Statistics You can query the current traffic statistics using the command stats You will get a listing which serves the number of connections, bytes in/out and much more. Example Output: Memory Statistics You can query the current memory statistics using stats slabs Which Keys Are Used? stats items Never Set a Timeout > 30 Days!
The Ultimate Guide to WordPress Multisite We’ve been developing plugins for it since the old days when it was WordPress MU, and we use it to power Edublogs, a huge network of blogs for educators and students. Personally I also use Multisite a lot. I use it to host client websites, to create sites demonstrating techniques I outline in my books and tutorials, and to keep everything in one place. In this guide to Multisite I’m going to show you everything you need to know to get started with Multisite and create your own network of blogs or sites. I’ll cover: What is Multisite and how is it different from regular WordPress? But first, let’s get some terminology straight. Network refers to the entire Multisite network, i.e. your WordPress installationSite refers to one of the blogs or sites created as part of the network. So when I refer to your site, I don’t mean your whole network of sites, but just one of the sites on it. So now we’ve got that sorted, let’s take a look at Multisite! What is Multisite? Uses for Multisite Creating a Site
Why use "closure"? Static Version One of the greatest features of the JavaScript language is closure. I've discussed this concept some in the "What is This?" What is a closure Again from wikipedia: In computer science, a closure is a first-class function with free variables that are bound in the lexical environment. Or the way I understand it intuitively: A closure is a function defined within another scope that has access to all the variables within the outer scope. Using closure to hide state Imagine this piece of code: greet_plain.js function greet(message) { console.log(message);} function greeter(name, age) { return name + ", who is " + age + " years old, says hi!" // Generate the messagevar message = greeter("Bob", 47); // Pass it explicitly to greetgreet(message); Output Bob, who is 47 years old, says hi! We're manually passing the internal state around so that the other functions can get ahold of it. Clearly there must be a better way. greeter.js return function greet() { console.log(message); };} personclass.js
Get To Know Linux: The /etc/init.d Directory If you use Linux you most likely have heard of the init.d directory. But what exactly does this directory do? It ultimately does one thing but it does that one thing for your entire system, so init.d is very important. The init.d directory contains a number of start/stop scripts for various services on your system. Everything from acpid to x11-common is controlled from this directory. Of course it's not exactly that simple. If you look at the /etc directory you will find directories that are in the form rc#.d (Where # is a number reflects a specific initialization level - from 0 to 6). Now if you are using a distribution like Fedora you might find this directory in /etc/rc.d/init.d. In order to control any of the scripts in init.d manually you have to have root (or sudo) access. /etc/init.d/command OPTION Where command is the actual command to run and OPTION can be one of the following: startstopreloadrestartforce-reload Most often you will use either start, stop, or restart.
Collecting all the cheat sheets What is "this"? Static Version Most people that learn JavaScript are coming from a background in another language. This brings with it a view of how the world works that may be different from how it really works in JavaScript. For this and other reasons, JavaScript is often misunderstood. It's all about where you are. In all programming languages, there is this idea of current scope and current context. In JavaScript all new scopes are created through "function" definitions. This is an example of global scope: global.js // Define a couple of global variablesvar name = "Tim";var age = 28; // Access one of them from the global scopename; Output => 'Tim' This is an example of local scope: local.js // Create a couple of local variables in a function.function newScope() { var name = "tim"; var age = 28;}// Try to access the local variables from the global scope// This will cause an error.name; Error ReferenceError: name is not defined Lexical Scope Lexical scope is the key to making closures work. lexical.js closure.js
Logo design tutorial When a company starts, the image is often one of the things that can impulse the acknowledgment of the business existence around their area of influence. A company’s image primary consists of the logo, the stationery, presentation cards, mail templates and even digital signatures. Once the company starts to gain reconnaissance, other elements are developed, such as the website, social networks and others. On this tutorial we will be focusing our attention on one of the main elements of any company’s image, the logo. 1. It’s not the same to plan a logo idea for a fast food company than a heavy machinery factory, you need to determine your company’s identity in order to create an image that plays along with the whole idea of your business. Color are also strong communicators, a blue logo for example will evocate water, relax, sky or serenity, while a black logo for example will communicate seriousness, some relation with machinery works, petroleum and elegance. 2. 3. 4.
DevDocs — Git / git add Name git-add - Add file contents to the index Synopsis git add [--verbose | -v] [--dry-run | -n] [--force | -f] [--interactive | -i] [--patch | -p] [--edit | -e] [--[no-]all | --[no-]ignore-removal | [--update | -u]] [--intent-to-add | -N] [--refresh] [--ignore-errors] [--ignore-missing] [--chmod=(+|-)x] [--] [<pathspec>…] Description This command updates the index using the current content found in the working tree, to prepare the content staged for the next commit. The "index" holds a snapshot of the content of the working tree, and it is this snapshot that is taken as the contents of the next commit. This command can be performed multiple times before a commit. The git status command can be used to obtain a summary of which files have changes that are staged for the next commit. The git add command will not add ignored files by default. Please see git-commit[1] for alternative ways to add content to a commit. Options <pathspec>… Files to add content from. -n --dry-run -v --verbose -f --force
Prototypal Inheritance Static Version In almost all modern programming languages we use the concept of Object Oriented Programming (OOP) to help manage the complexity of today's software. The biggest challenge in modern software is in fact managing the complexity of it. Most languages do this with a variant OOP called Classical OOP. This is the one you see in Java, C#, C++, PHP, Ruby, and Python. It has the idea that classes should be separate from instances. While this is a great abstraction, I would like to experiment with other ideas. So what does JavaScript have? From what I hear (I wasn't there at the time), JavaScript was initially a prototypal inheritance system. Classical OOP classical.js var frank = new Person("Frank Dijon");frank.greet(); Output => 'Hello world, my name is Frank Dijon' Here we have a class like object Person. Prototypal OOP I don't like the new keyword, it overloads the meaning of functions and is dangerous. Instead try this on for size: prototypal.js#intro-to-style Using Object.spawn
Lessons From A Review Of JavaScript Code - Smashing Coding Advertisement Before we start, I’d like to pose a question: when was the last time you asked someone to review your code? Reviewing code is possibly the single best technique to improve the overall quality of your solutions, and if you’re not actively taking advantage of it, then you’re missing out on identifying bugs and hearing suggestions that could make your code better. None of us write 100% bug-free code all of the time, so don’t feel there’s a stigma attached to seeking help. Some of the most experienced developers in our industry, from framework authors to browser developers, regularly request reviews of their code from others; asking whether something could be tweaked should in no way be considered embarrassing. Reviews are a technique like any other and should be used where possible. Today we’ll look at where to get your code reviewed, how to structure your requests, and what reviewers look for. Introduction Where Can I Get My Code Reviewed? What Should Code Reviews Provide?