Intro to JavaScript

JavaScript (AKA ECMAScript) is by far the most amazeballs programming language for the web. The fact that you can work with it both server-side and client-side is incredible and should excite developers.

Fast things to know:

  • Netscape created JavaScript
  • Microsoft created JScript (a clone of JavaScript)
  • In 1996 in an effort to unify browsers the ECMAScript Language Specification was started and in 1997 the ECMAScript 1st  standard was created
  • Currently we are up to the 6th Edition
  • JavaScript (JS) is an object-oriented programming language designed for browser interaction
  • Has grown beyond the original purpose of a scripting language

The easiest way to play with JavaScript is by building a simple html file:

<!DOCTYPE html>
<html>
 <head>
 <title>JavaScript</title>
 </head>
 <body>
 
Hi
var hello = document.getElementById('hello').innerHTML='Hello World'; </body> </html>

The simple script above uses JavaScript to change “Hi” to “Hello World”.

CodeIgniter: Ability to add HTML attributes to a table row such as class or id

It is annoying that CodeIgniter’s HTML Table class does not support the ability to add attributes to the table rows such as classes, ids and data-attr. Using something like the Twitter BootStrap you may be wanting to add classes to the rows so that you can style rows that are success, errors or warnings.

I decided that this is crazy and that the rows should work the same as the cells. I have posted two options on GitHub to overcome the problem:

  1. Extend the Table class -> https://github.com/dalehurley/codeigniter-table-rows -> add MY_Table.php to application/libraries folder
  2. Replace the Table class -> https://github.com/EllisLab/CodeIgniter/pull/2540 -> replace CI_Table.php in system/libraries folder (please comment and push for this to be pulled)
  3. Despite which solution you chose you can add the HTML attributes to the table row using 1 of two methods:

        $rows[]=array('data'=>$row, 'class'=>'warning');
        echo $this->table->generate($rows);
    

    or

        $this->table->add_row(array('data'=>$row, 'class'=>'warning'));
    

    So you may want to do something like:

        $this->load->library('table');
        foreach($people as $person)
        {
            $row_data=array($person->given_name,$person->family_name,$person->city);
            $this->table->add_row(array('data'=>$row_data, 'class'=>$person->status));
        }
        $this->table->set_heading(array('Given name','Family Name', 'City'));
        echo $this->table->generate($rows);
    

My first Node App – Single file message queue

CreditorWatch connects to a government service and they have restricted us to a single concurrent connection via our frame relay connection, i.e. if we try to do two concurrent socket connections the second socket connect will not receive any data back. It is possible to use PHP, though this seemed like the wrong tool. Node offers the ability to run a continuous running bare basic server, avoiding Apache etc.

What we wanted to do is a little tricky, normally with a queue you send the queue worker a task and then continue on. In this case we send the queue the request and wait for the result. It works like this:

  • The requestor sends a request
  • The queue queues the request for processing
  • The queue moves through the queue
  • The queue returns the response to the requestor

The example below doesn’t do anything except return the sent message, in our production environment we send the message via Telnet and send back the response.

//require the net services
var net = require('net');
//queue for processing
var queue = new Array();
//make sure there is unique keys for each queue element
var used_keys = new Array();
//the finished items queue
var finished_queue = new Array();
//keep a count of requests
var request_count = 0;
//start the queue processor - below
process_queue();

//start a server for the other apps to connect to via a socket connection on port 1337
var server = net.createServer(function (socket) {
	//create a unique key
	var request_id='a'+(++request_count)+Math.ceil(Math.random()*3000);
	//check the key is not in use
	while(used_keys[request_id]!=undefined)
	{
		request_id='a'+(request_count)+Math.ceil(Math.random()*3000);
	}//if it is in use - somehow - create another
	//set the key as in use
	used_keys[request_id]=true;
	//log the details
	console.log('New Socket Conn');
	console.log('Request #' + request_count);
	//wait for the socket to send a message
	socket.on('data', function(data) {
		//log the data sent
		console.log('The Request: '+data.toString());
		//add the message to the back of the queue - bonus tip - you could set a priority option here
		queue.push({'req_id' : request_id, 'msg' : data.toString()});
		//call the watcher to see if there is a response - passing this socket details
		get_data(request_id,socket);
	});
	//log when the socket is closed
	socket.on('close', function(data) {
		console.log('Connection closed');
		console.log(process.memoryUsage());
	});
});
//init the listener
server.listen(1337, '127.0.0.1');
//the watcher function to check if there is a response
function get_data(req_id, socket)
{
	//the function we will loop back on - a while loop blocks
	function sub_get_data()
	{
		//is the queued item processed
		if(finished_queue[req_id]!=undefined)//yes
		{
			console.log('Have found request #' + req_id);
			//send the response to the requestor and close the connection
			socket.write(''+finished_queue[req_id]);
			socket.end();
			//garbage clean uo
			delete finished_queue[req_id];
			delete used_keys[req_id];
		}
		else//no
		{
			console.log('Havent found request #' + req_id);
			//in 20th of a second check again
			setTimeout(sub_get_data, 50);
		}
	}
	//init the watcher loop
	sub_get_data();
}

//the queue which keeps looping every 10th of a second to check if there is new items
function process_queue()
{
	//console.log('The queue is running n');
	//loop through the queue
	while(queue.length)
	{
		//not sure why i put in the if???
		if(queue.length)
		{
			console.log('There is ' + queue.length + ' items in the queue');
			//get the first item in the queue and remove it from the queue
			item=queue.shift();
			//process the item and add it to the finished queue for the get_data watcher to pick up
			finished_queue[item.req_id]=do_something_or_nothing(item.msg);
			console.log('The response for request #'+item.req_id+': '+finished_queue[item.req_id]);
			console.log('There is ' + finished_queue.length + ' items in the finished queue');
		}
	}
	//console.log('The queue is taking a break n');
	//take a break - 10th of second
	setTimeout(process_queue, 100)
}

function do_something_or_nothing(msg)
{
	return msg;//yeah we did nothing - thought you could do a lot
}

It is always good to test and test we did. The below script sends a random number to the Node app and checks that the random number returned is the same sent. We set up 20 terminal screens to run 100 continuous cURL calls to the below to confirm the queue is sending the response back to the requestor. We expect a max of 5 concurrent connections to this specialist service in the same second so 20 is a prefect test.

&lt;?php
//random number
$send=rand(0, 99999);
//the connection settings
$port=1337;
$ip='127.0.0.1';
//open the socket to the node server
$fp = fsockopen($ip, $port,  $errno, $errstr, 5);
//send a message to the socket connection
fwrite($fp, $send);
$msg='start';
$content='';

//get the message sent back
$msg=fgets($fp);

//check the message returned is the message returned
if($msg==$send)//a match
{
	echo '
	We are happy
';
}
else//something is wrong
{
	echo '
	Oh ' .$send . ' - ' . $msg . ' didnt match
';//hopefully wont happen
}
//close the connection
fclose($fp);

Node.JS – just starting out

Pretty excited. I heard about node.js about two years at Web Directions South. It was just starting to get coverage and a very small group of supporter were excited. The excitement in me died prematurely as I realised at that time hosting of node.js was going to a be pain. Now times have changed and it looks like everyone is into node.js. This weekend I am going to start learning it by reading the book Jump Start Node.js by Don Nguyen, on SitePoint. I will post a follow-up to what I think of the book.

From chapter 1, node.js:

  • Is fast – really fast
  • Works on both the front and back-end
  • Is non-blocking
  • Theoretically will scale beyond your operating system
  • Is event driven
  • Can be accessed in Command line / Terminal RPEL
  • With Express a quick app is built
  • MongoDB is used for a signin form

It is a great start to node.js. You get a feel that it is something that is complex, but has a lot of upside. Obviously the ‘Hello World’ app is super complex compare to PHP’s. Though I would say the abstraction of the server is why PHP’s one is so simple. You see that the author has missed using sudo when running one of the commands, and some of the steps are hidden in the middle of a big text-block. It is a good start just a few small sloppy errors.  All in all I am excited to get started with node.js.

Tips for applying for a web developer role

Here it is, an ad for a front-end developer/designer on Seek.

Since putting up the ad we have received some brillant and some terrible resumes.

This has lead me to think that web developers need some guidelines when they are seeking a new job.

  1. You must have a personal site. This is critical, you are a web-head, you advocate the web, you love the web, I expect you to have a website. This does not have to be the world’s most mind blowing site. Just something that is going to show you can at least put some code together. If you are a hardcode developer and cannot design than use Twitter BootStrap, at least it will look neat. If you are a designer than the site needs to look awesome!
  2. Back-end and front-end are very different roles. Sometimes the lines are very blurred, other times it isn’t. Your strength is going to be one or the other. If it is a back-end role, than Java, Ruby, PHP, C++ or Python (insert other server-side language) should be a big part of your background. If it is a front-end role HTML, CSS, JavaScript, PhotoShop, Illustrator, and basic server-side should be a big part of your background.
  3. If the job is for UX/UI your resume must reflect this, even if it isn’t, you are a tech-head so it should show a logical organisation. DO NOT USE THE STANDARD WORD TEMPLATES!!! They are horrible and lead to a bad user experience.
  4. Explain your role on projects. Do not list one of the world’s largest sites with a vague one word description of your role. Clarify exactly what you did. Otherwise there is no way of knowing if you were the UX lead who designed the end-to-end customer experience or the tea-lady.
  5. Do not list your ex-company’s projects unless you were on them, and if you were on them, list what your role and accomplishments were.
  6. DO NOT CLAIM OTHERS’ WORK AS YOURS. Are you serious? Do you honestly think that you will not be caught out? Come on! If you do not get caught in the interview process, you will be caught out once you start and your new employers will be very upset. Though I get the feeling if you are in this group you are like one of the applicants who’s code samples still contained the original author’s links in the footer.
  7. This is professional process, so treat it as such. While you can be quirky and this is encouraged, do not put not safe for work content in your resume. Check your spelling. Consistently format your resume. Write a cover letter covering each of the requirements. Write a two to three sentence introduction in the email.
  8. Make me want to hire you. You are a product, you need to make me want to spend money on you. Tell me about how you will make us successful, especially when I put exactly how you will in the job ad.
  9. Provide samples of your work. These can be code samples, wireframes, mockups, GitHub, your blog posts, side projects, StackOverFlow responses, Redit etc. as long as you created it. Given the fact it is so easy to create side-projects online there is zero reasons for not having something you created.
  10. Do not apply for roles above your experience level. If you are straight out of uni you will do well, just don’t apply for a role which is requiring you take on responsibility beyond your ability (there is of course exceptions). There is plenty of opportunity to jump in the deep-end. Just get some experience first.

PHP strpos function not working – It does, just not the way you expect

strpos($needle,$hey_stack);  returns the exact the position of the the needle in the heystack.

The powerful/easy-to-use if(strpos(‘hey’,’hey world’)){//do something}else{//do something else} feature of PHP is also a major weakness if you do not fully understand how if statements in PHP work.

Continue reading “PHP strpos function not working – It does, just not the way you expect”