What’s this? A new GoSquared Help Sheet? Hell yeah!

We’re pleased to bring you a brand new GoSquared Help Sheet for your Node.JS needs.

What’s Node.JS?

If you’ve read this far, you probably already know, but for those intrigued, Node.JS is an evented I/O framework for the V8 JavaScript engine. It’s ideal for writing scalable network programs such as web servers.

We’ve been working on some exciting things with Node.JS, and we felt it was only fair to share our knowledge in the form of an easy-to-read Help Sheet.

Feel free to print it out, stick it on your wall, and get developing!

As always, if you find any errors or typos or anything like that, please drop us a note in the comments.

Get the Node.JS Help Sheet PDF (530KB)

Want more?

If you’re stuck, we also have some other helpful Help Sheets – for CSS2 and CSS3, HTML, PHP, and VI, as well as handy OS X Character Reference sheets. All available for FREE download now!

A few months ago, AWS introduced an extremely useful little feature to their consistently developing EC2 platform: Instance Tagging. Before tags, it was relatively tricky to define a clear instance nomenclature, forcing you to implement a vague approach using security groups if you wanted something close to the same functionality. Since there is also a full API surrounding tags, they can be put to work in many useful ways.

Naming instances

Besides attaching up to ten custom nuggets of arbitrary data to instances, tags can be extremely handy when it comes to naming your EC2 instances, and more importantly, using these names to differentiate between instances and their roles. For example, you have three instances. One holds your master database and website, the second is a slave database in replication, and the third is a staging/test server. You’ll want to make pretty damn sure that when you’re SSH’d into all three of your instances, the commands you send are received by the intended recipient server.

In the EC2 management console, you can define a tag key for an instance which is then mapped to a value. There is a default tag key called “Name”. In the value for that “Name” key, you can type in the name you want to assign to that instance. For our servers in this example we can call the master server master-0, the slave server slave-0, and the staging server staging-0. I like this naming system because on the left of the hyphen you can define the type or classification of that server representing the role it performs, and the number following the hyphen can be incremented for each server of the same type, therefore acting as a unique ID for each server.

Conveniently, you can define which of these tags become a column in the table listing all of your instances. If you have a large number of instances, having this custom column for tags present can make it far quicker to find the instance you’re looking for at a glance, rather than trying to derive the right one from all of the other parameters displayed.

Doing some magic with .bashrc

I am a big fan of customising the bash prompt so that it displays only useful contextual information I need to know when I send commands. One of the problems I came across whilst working simultaneously on multiple instances is making sure I am sending commands to the correct one. Sure, most bash prompts include the server’s hostname in the prompt, but beware – there are flaws with this. For example, if you reboot an EBS-backed instance, the hostname it shows is not necessarily the one it is operating from. I needed something more definitive than that.

Here’s some example code you can place in your .bashrc file to display the instance ID and server name in the command prompt:

INSTANCEID=`curl -s http://169.254.169.254/latest/meta-data/instance-id`
SERVER_IDENTIFIER=$INSTANCEID
SERVER_TAG=0
if [ -f /var/opt/server-tag ]; then
SERVER_TAG=`cat /var/opt/server-tag`
SERVER_IDENTIFIER="$SERVER_TAG:$SERVER_IDENTIFIER"
fi
if [ "$color_prompt" = yes ]; then
PS1='${debian_chroot:+($debian_chroot)}\[\033[01;32m\]\u@${SERVER_IDENTIFIER}\[\033[00m\]:\[\033[01;34m\]\w\[\033[00m\]\$ '
else
PS1='${debian_chroot:+($debian_chroot)}\u@${SERVER_IDENTIFIER}:\w\$ '
fi
unset color_prompt force_color_prompt

The great thing about this bashrc code is that if you have a file saved at /var/opt/server-tag which contains the server’s tagged name, the prompt will look something like this:

That prompt clearly defines that I am working as user Ubuntu on a server called Node#1 with instance ID of i-b92990d5, so I don’t need to think twice about that.

Using tags as hostnames

Now that we have named our instances using tags, we can turn them into hostnames so we can address them directly in our scripts, avoiding the need for expensive lookups against Amazon’s API to find server internal IPs. I’ve written a simple script to add entries to the /etc/hosts file for each of your instances that have a tag called “Name”. The value in this “Name” tag will become that server’s hostname, which then forwards to its internal IP address. While we’re at it, we also create the aforementioned /var/opt/server-tag file so our .bashrc script can display the server name in the command prompt. Note this script requires the AWS SDK for PHP and because we’re modifying the /etc/hosts file, you need to run it as root.

< ?php
// Install the AWS PHP SDK from http://docs.amazonwebservices.com/AWSSDKforPHP/latest/ and follow the setup instructions on that page.
require_once "aws-php-sdk/sdk.class.php";
 
define('SERVER_TAG', '/var/opt/server-tag');
 
try{
	// Parse hosts file into an array
	$hosts_file = file_get_contents('/etc/hosts');
	$hosts_lines = explode(PHP_EOL, $hosts_file);
	foreach($hosts_lines as $hlkey => $hline){
		if(empty($hline)) continue;
		$host_lines[$hlkey] = preg_split('/\s/', $hline);
	}
	$hosts_updated = false;
	$this_instance_id = file_get_contents('http://169.254.169.254/latest/meta-data/instance-id');
	// Check server tag directory
	$server_tag_dir = dirname(SERVER_TAG);
	if(!file_exists($server_tag_dir)) mkdir($server_tag_dir, 0777, true);
	// Get the server tag
	$server_tag = file_get_contents(SERVER_TAG);
 
	$EC2 = new AmazonEC2();
	$result = $EC2->describe_instances();
	if(!$result->isOK()) throw new Exception("ec2->describe_instances failed");
	// Each "reservationSet" is essentially an instance or compute "reservation"
	foreach($result->body->reservationSet->item as $rset){
		$iset = $rset->instancesSet->item;
		if($iset->instanceState->code != 16) continue; // Instance is not in "running" state, so ignore
		if(isset($iset->tagSet)){
			// Server is tagged. We should note it down in the /etc/hosts file
			$tset = $iset->tagSet->item;
			$server_identifier = false;
			if(is_array($tset) && count($tset) > 1){
				foreach($tset as $tag){
					if($tag->key == 'Name') $server_identifier = (string)$tag->value;
				}
			}
			else{
				if($tset->key == 'Name') $server_identifier = (string)$tset->value;
			}
			if($server_identifier){
				// This server is tagged with an identifier. Make sure we've got it recorded in the server-tag file if this is our server
				if((string)$iset->instanceId == $this_instance_id && $server_tag != $server_identifier) file_put_contents (SERVER_TAG, $server_identifier);
				// Now me ensure the correct host entry is written or up to date
				$nice_si = str_replace('#', '-', $server_identifier); // Replace # with - to avoid conflicts
				$hosts_match = false;
				foreach($host_lines as $hlkey => $hline){
					if(strstr($hline[0], '#')) continue; // Skip comment lines
					while($hostname = next($hline)){ // Loop through the hostnames to see if this server exists in the host file
						if($hostname == $nice_si){ // Found a hostname match, so check the mapped IP address
							$hosts_match = true;
							$ip_addr = (string)$iset->privateIpAddress;
							if($hline[0] != $ip_addr){
								// Private IP address has changed. Update it after a quick sanity check on IP address
								if(!empty($ip_addr) && strlen($ip_addr) >= 7) $hline[0] = $ip_addr;
								$host_lines[$hlkey] = $hline;
								$hosts_updated = true;
							}
						}
					}
				}
				if(!$hosts_match){
					// This server does not exist in the hosts list. Add it.
					$ip_addr = (string)$iset->privateIpAddress;
					if(!empty($ip_addr) && strlen($ip_addr) >= 7){
						$host_lines[] = array($ip_addr, $nice_si);
						$hosts_updated = true;
					}
				}
			}
		}
	}
	if($hosts_updated){
		foreach($host_lines as $hlkey => $hline){
			$host_lines[$hlkey] = implode(" ", $hline);
		}
		if(file_put_contents('/etc/hosts', implode("\n", $host_lines))){
			echo "/etc/hosts has been updated successfully\n";
		}
		else echo "Could not update /etc/hosts file\n";
	}
	else echo "No changes to make\n";
}
catch(Exception $e){
	die($e->getMessage());
}
 
?>

After running this script, we will have entries in our /etc/hosts file for all of our tagged servers, and because these are now defined as operating system hostnames, you can use these hostnames for connections between your servers (for example, if you were connecting to mysql from slave-0 to master-0 you could define the hostname for the connection as master-0:3306 and the connection will be made via Amazon’s internal DNS network. If you set this script to a regular cron job, you can ensure that the hostnames are kept updated and new ones are added as you tag new instances.

We’re pleased to bring you the 3rd version of the GoSquared CSS Help Sheet, and a brand new CSS3 Help Sheet.

With the VI Help Sheet we released last week, we redesigned our Help Sheets for a much better result when printed on paper, while ensuring they still don’t look too shabby on the screen of your Mac, PC, iPhone or iPad.

We’ve put together a Help Sheet specifically for CSS3. We’ve covered most of the basic options now possible with CSS3, but there’s a ton more we couldn’t fit in, so we’ve linked to a couple of handy articles such as this post by 456 Berea Street on CSS Selectors, and this piece by Paul Irish on Font-Face.

So what are you waiting for? Download them. Print them. Stick ‘em on the wall and get creative!

New to GoSquared?

For those of you new to GoSquared – we help people improve their websites. GoSquared real-time web analytics enables you to understand what’s happening on your site right now. We run this blog, on design, technology and marketing to share our thoughts and content with wonderful people like you in the hope that you’ll also try GoSquared.

As always, if you find any errors or typos or anything like that, please drop us a note in the comments.

Get the CSS2 Help Sheet PDF (230KB)

Get the CSS3 Help Sheet PDF (221KB)

The CSS2 Help Sheet. We made the original based on the wonderful work of Leslie Frank. Never forget those basic and vital styling options with this at your side, or on your wall.

The CSS3 Help Sheet. All that’s coming to CSS, and all that’s already here for Chrome, Safari, WebKit, Firefox, Opera, and, erm, IE9?

We hope these are helpful to you.

Enjoy!

We’re really pleased to bring you another Help Sheet. Introducing the VI Help Sheet for all you Linux loving developers out there.

It’s been a while since we released our set of web development Help Sheets for PHP, HTML and CSS, so we thought it was time to release another. This one should keep a lot of developers happily coding away into the early hours of the morning.

So what are you waiting for? Download it. Print it. Stick it on the wall and get commanding.

As always, if you find any errors or typos or anything like that, please drop us a note in the comments.

New to GoSquared?

For those of you new to GoSquared – we design and engineer web applications for site owners to monitor their traffic and earn more money from their Site. We run Liquidicity, the blog on design & technology to share our thoughts and content with wonderful people like you in the hope that one day you’ll use our products.

Get the PDF (553KB)

Update: Many thanks to Adit Gupta of www.what-a-geek.com for suggesting some more useful commands and for Joe on Smashing Magazine for making a correction to one of the search commands. Thanks also to Oliver in the comments below for informing us of a few other corrections.

Having used MediaTemple‘s hosting options for quite some time, we’ve built up a fair amount of experience working with their (dv) servers. Every now and again you may find it necessary to extend the core functionality of the pre-compiled PHP supplied with the (dv) server using PECL extensions to give your apps that little bit more of a cutting edge.

There is a quick and easy way to insall the PECL modules on your (dv) server: pecl install [extension]. However, if for whatever reason this does not work for you, this guide documents a manual installation method.

A preliminary word of warning & disclaimer
We have only tested the following guide on (dv) 3.5 servers, and cannot in any way guarantee that this method will provide a stable and/or functional installation of your chosen PECL module(s) on your server, version 3.5 or otherwise. If your (dv) server is not version 3.5, this guide may not work due to possible path and environment differences. Therefore, any attempt to follow this guide is undertaken at entirely at your own risk and we cannot be held responsible for any resultant problems.

Phew, now I got that off my chest, let’s get started.

Paths needed
PHP extension (modules) directory: /usr/lib/php/modules
php.ini file: /etc/php.ini
PHP extension .ini files (to facilitate autoload of extensions): /etc/php.d/

For this to work, you’ll need to have root access to your server, and you’ll most probably need developer tools installed as well. To obtain these, log in to your MediaTemple (ac) panel and enable them both there.

Note: Replace [extension] with actual extension name

Open up your terminal using a remote SSH client (if you don’t have one, install an SSH client like PUTTY) and log into your server as root.

Download the extension from PECL to somewhere on the server (e.g. /tmp/download/):
cd /tmp/download/
wget http://pecl.php.net/get/[extension].tgz

N.B. For this bit, [extension] must be replaced by your extension name including any version numbers of the version you downloaded e.g. memcache-2.2.5

Extract the compressed package and change directory to the extracted source folder
tar -xvf [extension].tgz
cd [extension]

From this point onwards, [extension] now represents the actual name of the extension, for example, memcache instead of memcache-2.2.5

Prepare the build environment for the extension and make the binaries
phpize && ./configure --enable-[extension] && make

You may see lots of code/writing flicking up in your terminal. This is normal.
If all that goes good, run:
make install

This should install the shared extension into /usr/lib/php/extensions. If this works properly, the [extension].so extension file will be automatically placed in the PHP extensions directory (/usr/lib/php/extensions)

Navigate to folder containing the .ini files for extensions:
cd /etc/php.d/

Create a new file called [extension].ini
vi [extension].ini

Press i and write/paste the following inside, replacing [extension] with the extension name:
; Enable [extension] extension
extension=[extension].so

Press ESC then type :wq and press enter to save and exit the file.

Restart apache so PHP can load the new extension when it starts up:
/etc/init.d/httpd restart

That’s it! The new module is now installed and should be working properly. If you want to verify this, create a test.php file somewhere on your site, place

< ?php phpinfo(); ?>

inside and access it with your browser. Information for the new extension will appear in the list of extensions if everything has installed correctly.

We hope this helps you out. We would greatly appreciate it if anyone can test this on (dv) servers older or newer than (dv) 3.5 and let us know the result.

Today, we’re introducing our all new Help Sheets. You loved our original CSS and HTML Help Sheets, so we went back to the originals, tidied them up, and gave them a sprinkling of coolness.

We’re also pleased to bring you an entirely new Help Sheet – the PHP Help Sheet. This should be a saviour for you hardcore coders when you forget the odd array function or two.

New to GoSquared?

For those of you new to GoSquared – we help people improve their websites. GoSquared real-time web analytics enables you to understand what’s happening on your site right now. We run this blog, on design, technology and marketing to share our thoughts and content with wonderful people like you in the hope that you’ll also try GoSquared.

You can download the full set as a ZIP (5.4MB) right here:

The all new PHP Help Sheet. Everyone needs a handy reference now and then, so go ahead and print this off. Stick it on your wall and never get lost again!

Get the PDF (1.9MB)

The HTML Help Sheet has been updated and tidied up, so now you have no excuses for not decorating your office notice board with snippets of usefulness.

Get the PDF (1.9MB)

The CSS Help Sheet – our first ever, but updated to match the set. We made the original based on the wonderful work of Leslie Frank. Never forget those styling options with this at your side.

Update: We’ve redesigned the CSS Help Sheet. Get the new CSS2 and CSS3 Help Sheets now!

Get the PDF (1.9MB)

We hope you like the new Help Sheets, and would love to know what you want us to Help Sheet-ise next: JavaScript? Actionscript? JQuery? Tell us in the comments!

Oh and another thing, the other day one of our readers sent in a photo of our CSS Help Sheet on his office notice board. If you’re using our Help Sheets at your office / home / garage / Starbucks we’d love to see! Email us a photo or upload to Flickr with the tag “GoSquared”.

Enjoy!

If you like your blog, but want to make it better, and go tweaking the insides of WordPress, this may be of help to you.

Our good friends over at WP Candy have done a great job in providing you with the quick shortcuts and need-to-knows of WordPress all on one easy to use sheet.

New to GoSquared?

For those of you new to GoSquared – we help people improve their websites. GoSquared real-time web analytics enables you to understand what’s happening on your site right now. We run this blog, on design, technology and marketing to share our thoughts and content with wonderful people like you in the hope that you’ll also try GoSquared.

Get the PDF (592KB)

More Help Sheets by GoSquared: HTML Help Sheet, and CSS Help Sheet

A popular graphical style at the moment is to make your text look indented. I spent months and months trying to work out how to do this after seeing it perhaps for the first time in iTunes. I always looked for a filter or a tool to “emboss” or “bevel” the text, but these never looked quite as nice, and often made the text hard to read.

One day, it hit me: it’s SO SIMPLE! And the method I came up with didn’t involve filters, plug-ins, or any other jazz like that.

All you need to do to create the effect of indented text is to duplicate the line of text, with the duplicate behind, and slightly below the original.

Then, make the duplicated text slightly lighter than the original text. This will work perfectly when you have dark text, just like in the title of this post.

Also, not many people realise you can use this method with light coloured text aswell. However, instead of moving the duplicated line of text below the original, you move it above, and make it darker than the original text. This will look just as good and give the same effect.

This method can be used in almost any application, but I made these with Adobe Illustrator. It’s great to know that something that looks so good can be done so easily.

Hope this helps

Get the Adobe Illustrator CS2 File [1.1MB]

Ever wanted to type the copyright icon, or do an accent over an A without having to resort to some character palette? We have, and it takes time and is an effort. So we put together a series of help sheets that reference all of the characters that aren’t listed on your keyboard, along with their shortcut keys to make your life easier.

New to GoSquared?

For those of you new to GoSquared – we help people improve their websites. GoSquared real-time web analytics enables you to understand what’s happening on your site right now. We run this blog, on design, technology and marketing to share our thoughts and content with wonderful people like you in the hope that you’ll also try GoSquared.

Click on a preview image to view a full jpg.

Note: The “Alt” key on these sheets is the same as the “Option” key as some users may put it.

Download the full set

Get them all in one PDF (216KB)

The Individual Sheets

There were so many, that to make the reference usable and readable we had to divide them into 3 sheets.

Get the PDF (128KB)

Get the PDF (116KB)

Last but not least, one more sheet.

Get the PDF (112KB)

We hope you find them useful.

You might also like our free vector and pixel-perfect icons.

The second in our Help Sheet series, you liked cheating with CSS, hopefully you’ll love cheating with HTML! To get going with HTML, just get the PDF below.

New to GoSquared?

For those of you new to GoSquared – we help people improve their websites. GoSquared real-time web analytics enables you to understand what’s happening on your site right now. We run this blog, on design, technology and marketing to share our thoughts and content with wonderful people like you in the hope that you’ll also try GoSquared.

Get the PDF (112kb)

See also: CSS Help Sheet

New Help Sheets Now Available!