MySQL DATETIME VS TIMESTAMP

A question which would come sometimes to mind when starting with MySQL is whether I should use DATETIME or TIMESTAMP data type since both appear to store same date and time component.

Similarities between datetime and timestamp:
1. Values contain both date and time parts.
2. Format of retrieval and display is "YYYY-MM-DD HH:MM:SS".
3. Can include a trailing fractional seconds part in up to microseconds (6 digits) precision.
4. With the fractional part included, the format for these values is "YYYY-MM-DD HH:MM:SS[.fraction]".
5. Both the TIMESTAMP and (as of MySQL 5.6.5) DATETIME offer automatic initialization and updating to the current date and time.

But both differ in some ways as mentioned below:

Differences between DATETIME and TIMESTAMP data types.

DATETIME:
1. Supported range is from '1000-01-01 00:00:00' to '9999-12-31 23:59:59'.
2. Storage Required Before MySQL 5.6.4 was 8 bytes. *
3. Storage Required as of MySQL 5.6.4 is 5 bytes + fractional seconds storage. *
4. Preserves the textual representation of the date and time.
5. A value in the supported range is saved as it is given to MySQL so lets say if you change the timezone of MySQL, the value remains same that is it stores no timezone information and is timezone independent.

Example:

By default MySQL uses the SYSTEM timezone as its timezone which is IST in my system.

mysql> CREATE TABLE `dt` (
  `dt` datetime NOT NULL DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP
) ENGINE=InnoDB DEFAULT CHARSET=utf8 COLLATE=utf8_unicode_ci

mysql> SELECT @@time_zone;
+-------------+
| @@time_zone |
+-------------+
| SYSTEM      |
+-------------+

mysql> INSERT INTO dt VALUES ('2016-09-12 12:12:00');

mysql> SELECT * FROM dt;
+---------------------+
| dt                  |
+---------------------+
| 2016-09-12 12:12:00 |
+---------------------+

Now lets change the session timezone to CDT which has an offset -05:00 hours with respect to UTC.

mysql> SET @@session.time_zone = '-05:00';

mysql> SELECT * FROM dt;
+---------------------+
| dt                  |
+---------------------+
| 2016-09-12 12:12:00 |
+---------------------+

The result above is same irrespective of timezone.

TIMESTAMP:
1. Supported range is from '1970-01-01 00:00:01' UTC to '2038-01-19 03:14:07' UTC. **
2. Storage Required Before MySQL 5.6.4 was 4 bytes. *
3. Storage Required as of MySQL 5.6.4 is 4 bytes + fractional seconds storage. *
4. Preserves values relative to the timezone in use.
5. A value in the supported range is saved in UTC timestamp value when the value is supplied to MySQL, so the value contains a timezone reference. While fetching the value again, MySQL will convert that value from UTC to the timezone specific value. If the timezone of MySQL is changed it has no effect on the UTC value stored but when the value is fetched it is displayed as per the current timezone of MySQL and not in the original timezone value which was stored first time. This occurs because the same time zone was not used for conversion in both directions.

An example of this would be if timezone of MySQL is currently IST and I save a value of "2016-09-12 12:12:00" into the TIMESTAMP datatype field, so when I fetch this record value from MySQL I will get the same value "2016-09-12 12:12:00". Now if I change the timezone value to CDT and fetch this record value, I will get "2016-09-12 01:42:00" which is the CDT equivalent time of IST "2016-09-12 12:12:00".

Example:

By default MySQL uses the SYSTEM timezone as its timezone which is IST in my system.

mysql> CREATE TABLE `ts` (
  `ts` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP
) ENGINE=InnoDB DEFAULT CHARSET=utf8 COLLATE=utf8_unicode_ci

mysql> SELECT @@time_zone;
+-------------+
| @@time_zone |
+-------------+
| SYSTEM      |
+-------------+

mysql> INSERT INTO ts VALUES ('2016-09-12 12:12:00');

mysql> SELECT * FROM ts;
+---------------------+
| ts                  |
+---------------------+
| 2016-09-12 12:12:00 |
+---------------------+

Now lets change the session timezone to CDT which has an offset -05:00 hours with respect to UTC.

mysql> SET @@session.time_zone = '-05:00';

mysql> SELECT * FROM ts;
+---------------------+
| ts                  |
+---------------------+
| 2016-09-12 01:42:00 |
+---------------------+

The result above is the CDT date time equivalent of IST date time "2016-09-12 12:12:00".

References:
- https://dev.mysql.com/doc/refman/5.7/en/datetime.html
- https://dev.mysql.com/doc/refman/5.6/en/datetime.html
- http://stackoverflow.com/questions/409286/should-i-use-field-datetime-or-timestamp

* As of MySQL 5.6.4, storage for YEAR and DATE remains unchanged. However, TIME, DATETIME, and TIMESTAMP are represented differently. DATETIME is packed more efficiently, requiring 5 rather than 8 bytes for the nonfractional part, and all three parts have a fractional part that requires from 0 to 3 bytes, depending on the fractional seconds precision of stored values.

https://dev.mysql.com/doc/refman/5.7/en/storage-requirements.html

** Why is the TIMESTAMP datatype limited to 2038 years and not beyond?
- Excerpt from https://en.wikipedia.org/wiki/Year_2038_problem:
"The Year 2038 problem is an issue for computing and data storage situations in which time values are stored or calculated as a signed 32-bit integer, and this number is interpreted as the number of seconds since 00:00:00 UTC on 1 January 1970 ("the epoch").[1] Such implementations cannot encode times after 03:14:07 UTC on 19 January 2038, a problem similar to but not entirely analogous to the "Y2K problem" (also known as the "Millennium Bug"), in which 2-digit values representing the number of years since 1900 could not encode the year 2000 or later. Most 32-bit Unix-like systems store and manipulate time in this "Unix time" format, so the year 2038 problem is sometimes referred to as the "Unix Millennium Bug" by association."

- It is also known as the Y2K28 bug.

A nice illustration from wikipedia showing the Year 2038 bug.

Caution: While designing applications please consider the range limitation of TIMESTAMP datatype [1970-2038] before using it or consider using DATETIME datatype instead.

Apertium: Free open source language translator

Came across a very cool "free" and "open source" tool to translate text from one language to another.

It's "Apertium" => "A free/open-source machine translation platform".

https://www.apertium.org

Excerpt from the site:

Apertium is a free/open-source machine translation platform, initially aimed at related-language pairs but expanded to deal with more divergent language pairs (such as English-Catalan). The platform provides a language-independent machine translation engine tools to manage the linguistic data necessary to build a machine translation system for a given language pair and linguistic data for a growing number of language pairs.

You can try the UI at https://www.apertium.org to translate sample text from one language to another.

Wiki and documentation related to it can be found at http://wiki.apertium.org/wiki/Main_Page

It also has a variety of tools for users / translators and developers: http://wiki.apertium.org/wiki/Tools

Apertium tools for users / translators

Apertium tools for developers

The installation steps are very easy. Just follow the one suitable for your OS at: http://wiki.apertium.org/wiki/Installation

Here is a video explaining the download, install process and command line usage of it for Ubuntu: https://www.youtube.com/watch?v=vy7rWy2u_m0

Below are the steps to install and use in a fresh new Ubuntu system:

1. Download stable-release sh script and run it to add Apertium package key to Ubuntu and to update the packages list.

$ wget https://apertium.projectjj.com/apt/install-release.sh -O - | sudo bash

2. To install all the core Apertium tools run:

$ sudo apt-get install apertium-all-dev

3. Download a language pair for your conversion use. You can search for your language pair here at http://wiki.apertium.org/wiki/List_of_language_pairs. For this example case, we will be downloading spanish-english language pair for conversion:

"apertium-en-es"  => English <-> Spanish

$ sudo apt-get install apertium-en-es

4. Now finally time to test it:

The command syntax is apertium <language-of-given-text>-<language-to-be-translated>

In our case, we will be translating from Spanish to English:

$ echo 'gracias' | apertium es-en

o/p: thank you

Now we will try to convert this spanish sentence "Tengo Un Mes Estudiando Español" which in english means "I've been learning Spanish for 1 month".

$ echo 'Tengo Un Mes Estudiando Español' | apertium es-en

o/p: Have A Month Studying Spanish

Same translation from google translate results in:

I have a month studying Spanish

Seems like Apertium translation result is quite similar to google translate result. This is great, coming from a free and open source tool. Hope you find use for it in your applications :)

Google dev tools Security and Audits tab

Two great tools provided by Google developer tools browser console are:

- The Security tab:

Security validation

Security inspection result for a site using https

It provides below checks for your website:

1. Valid certificate
Whether the connection to this site is using a valid, trusted server certificate.

2. Secure TLS connection
Whether the connection to this site is using a strong protocol version and cipher suite.

3. Secure Resources
Checks if all resources like js, css and others are fetched through https.

Security inspection result for a site using http and fetching sub-resources through http

- The Audits tab:

The Audit tab

It provides a great tool to check and provide useful suggestions for network utilization like using gzip compression, combine js files, minify css and js files and web page performance like remove unused css styles for your web site which can be considered in your application context and used accordingly. You can see in detail the changes suggested for each category by clicking on the leftmost arrow against each category.

Below is result audit output from some public sites:

Audit result-1

Audit result-2

Audit result-3

These two tools will definitely help us monitor the security and improve network and web performance of our sites.

MySQL auto update date_created and date_updated columns

It's usually a good practice to have two columns called date_created and date_updated in every table. One can always use it in application and it helps in debugging too as to when a record was created and last updated in various circumstances and contexts.

This responsibility can be given to MySQL to automatically assign current time values to these columns.

In MySQL 5.6 onwards, this can be done by setting the data type of the columns to be either date time or timestamp and creating date_created column with NOT NULL DEFAULT CURRENT_TIMESTAMP  schema and date_updated column with NOT NULL DEFAULT '0000-00-00 00:00:00' as schema with attribute ON UPDATE CURRENT_TIMESTAMP.

Below is a sample schema of a table containing date_created and date_updated columns:

CREATE TABLE `time_stamp` (
  `id` int(10) unsigned NOT NULL AUTO_INCREMENT,
  `date_created` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP,
  `date_updated` timestamp NOT NULL DEFAULT '0000-00-00 00:00:00' ON UPDATE CURRENT_TIMESTAMP,
  PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8

But there is a catch here, since this is not applicable to all MySQL versions. Earlier to 5.6 version, MySQL allows a table to have only one TIMESTAMP column with an automatic TIMESTAMP value, that is you can either have date_created or date_updated auto updated to CURRENT_TIMESTAMP not both.

Related to this the MySQL documentation has some very good info at this page: https://dev.mysql.com/doc/refman/5.5/en/timestamp-initialization.html

Excerpt: "By default, TIMESTAMP columns are NOT NULL, cannot contain NULL values, and assigning NULL assigns the current timestamp."

So the workaround this is to have date_created column with timestamp NOT NULL DEFAULT '0000-00-00 00:00:00' schema  and date_updated column with timestamp NOT NULL DEFAULT '0000-00-00 00:00:00' ON UPDATE CURRENT_TIMESTAMP schema.

With above, the date_updated field is correctly updated by MySQL automatically when there is an update and to update date_created field with current timestamp value, we have to explicitly pass NULL value to date_created field which will then store the CURRENT_TIMESTAMP value in the field.

Below is a sample schema for above changes:

CREATE TABLE `time_stamp` (
 `id` int(10) unsigned NOT NULL AUTO_INCREMENT,
 `date_created` timestamp NOT NULL DEFAULT '0000-00-00 00:00:00',
 `date_updated` timestamp NOT NULL DEFAULT '0000-00-00 00:00:00' ON UPDATE CURRENT_TIMESTAMP,
 PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8

So for a structure as above the insert query would be as below:

INSERT INTO `test`.`time_stamp`
(`id`, `date_created`) 
VALUES
(NULL, NULL);

For update the query would be:

UPDATE 
    `test`.`time_stamp` 
SET 
    `id` = '4' 
WHERE 
    `time_stamp`.`id` = 1;

Above will just update the date_updated with the CURRENT_TIMESTAMP and the date_created value will remain same as earlier. Caution needs to be taken while updating records so as not update date_created field with NULL value.

One could also say that instead of MySQL automatically updating the date_updated field, I would like the date_created field to be updated automatically by it. Yes, it is just a reverse case and can be used, in which case while updating the record one has to pass NULL value to date_updated field. But the thing is that since there will be many updates and only a one time insert so passing a NULL while a one time insert reduces the overhead on us of passing a NULL for every subsequent update and let MySQL handle it for us. But yes this is debatable and there are cases where this reverse structure can be used.

Another workaround this is to have date_created field updated with current timestamp value using  a trigger when a record is inserted.

Hope this helps :)

PHP best practices going ahead

I have been considering a few things that one needs follow, do and have in their projects and applications and I came up with the below list:

1. Object Oriented Techniques and practices
2. Use of Interface Concept
3. TDD (Test Driven Development) based development both on the server and client side
4. Source code management tool like GIT
5. Language specific package management tool for managing dependencies. For example: Composer for PHP
6. Continuous Integration tool
7. Automated testing

There are many more, I might be missing. Please let me know in comments. :)

Video on MySQL master slave Replication

A video session on "Intro to MySQL master slave Replication". Hope you enjoy it :)

Developing a To-Do application using TDD approach using QUnit as the testing framework

I recently tried my hands at TDD to develop a basic ToDo app using QUnit as the testing framework.

Here is the link to the application demo.

I have written both unit and integration / functional tests while developing this app. The source code can be checked here.

To run and see the results of tests, refer below links:

Unit test results
Integration / Functional test results

Hope this helps in learning :)

Video Tutorial on Network Throttling tool provided by Google Chrome Developer tools

Network Throttling tool provided by Google Chrome Developer tools

In this video we will be seeing how this tool helps us to test your application at different network speeds, thus giving us info and insight as to how users having different speeds of internet use our application and the challenges they face and how the performance can be improved and how the application can be made more usable in such cases.

Interesting article on importance of coding and testing

A very interesting article on testing and coding illustrating many simple tips, important points:

- why one should test and code
- what one should test
- how and what kind of testing one can provide
- what one should not test
- how important testing is
- and others

If you are new to testing, it is a good place to start. Overall as the title of the article says "Why and how testing can make you happier", so it is time to be happy :D

Interesting read it makes. Hope you enjoy it too as I have :)

http://mikbe.com/code/testing/dx/2016/03/11/why-and-how-testing-can-make-you-happier.html

Lorem ipsum content for html

If you want some dummy html content for test purpose like form, paragraph or list content then you can use content from http://html-ipsum.com/

Testing APIs in CodeIgniter 2.x using phpunit and Guzzle Http client

Sometimes we have apis implemented in our application and there are different levels at which these can be tested.

1. Unit tested at model level to check the logic is working fine
2. Tested at API call level to ascertain whether all the apis as expected are working and are returning data as expected.

Today, we will be learning how to test APIs in CodeIgniter 2.x version using phpunit and Guzzle Http client.

Basically Guzzle Http client is a client used to make http client requests.

Ref: https://github.com/guzzle/guzzle

"Guzzle is a PHP HTTP client that makes it easy to send HTTP requests and trivial to integrate with web services."

We will basically be creating an API for a blog so as to get blog posts and add blog post. When testing APIs, we are basically testing the output format, expected fields in the output and their data type and value if needed.

Sample code can be found at git repository here: https://github.com/satejkumar/CodeIgniter_API_Testing

We are using composer to install the dependencies: phpunit and Guzzle http client.

So download the latest CodeIgniter 2.x version and create a composer.json file with the following content:

{
    "require": {
        "guzzlehttp/guzzle": "^6.1",
        "phpunit/phpunit": "*",
        "phpunit/php-invoker": "*",
        "phpunit/dbunit": "*"
    }
}

and then install the dependencies using the below command:

$ composer install

Then we create our test file inside application/tests/ folder called PostsTest.php

All the dependencies are included by the autoload file.

require('../../vendor/autoload.php');

Before doing each test case, we setup the Guzzle Http client and set the base uri of the API request as below inside setUp() function which is called before each test function call.

protected function setUp()
{
        $this->client = new GuzzleHttp\Client([
            'base_uri' => 'http://localhost/'
        ]);
}

One function is to test get post API request, so we are making a get request to url http://localhost/posts/index/1 to get the first post and are expecting a json content and the json content should have some fields and should have an id value of 1.

public function testGet_ValidInput_PostObject()
{
        $response = $this->client->get('posts/index/1');
        $this->assertEquals(200, $response->getStatusCode());

        $data = json_decode($response->getBody(), true);

        $this->assertArrayHasKey('id', $data);
        $this->assertArrayHasKey('title', $data);
        $this->assertArrayHasKey('content', $data);
        $this->assertArrayHasKey('author_id', $data);
        $this->assertArrayHasKey('emails_sent', $data);
        $this->assertArrayHasKey('created_at', $data);
        $this->assertArrayHasKey('updated_at', $data);
        $this->assertEquals(1, $data['id']);
}

So we are using assertArrayHasKey() function to check if a particular field is present in the data set and assertEquals() to check for value.

Another function is to test POST request to create a new blog post.

public function testPost_NewBlog_Post()
{
        $response = $this->client->post('posts/index', [
            'form_params' => [
                'title' => 'My Random Post',
                'content' => 'Content',
                'author_id' => 1
            ]
        ]);

        $this->assertEquals(200, $response->getStatusCode());
        $data = json_decode($response->getBody(), true);
        $this->assertGreaterThanOrEqual(1, $data['id']);
}

In the above function we are creating a post request to the url http://localhost/posts/index with post parameters and are then expecting a 200 status code output and a json content with a field "id" which should have an integer value greater than or equal to 1.

Now that we are done with the tests, we can run them from the project root directory using below command:

$ ./vendor/bin/phpunit application/tests/

Basically phpunit and Guzzle Http client help us in making requests and verify responses thus enabling us to test APIs.

Ref: https://ole.michelsen.dk/blog/testing-your-api-with-phpunit.html
Excerpt: "Remember it's just as important to test failing/edge cases as testing when things go well. Also you should run these tests against an isolated testing environment if they modify your data."

A link I found highlighting principles that guide us in development for an ethical web

I found this very simple yet very clear list of principles that can be kept in mind while developing for the web.

https://ethicalweb.org/

Excerpt from above link:

"As web developers, we are responsible for shaping the experiences of user's online lives. By making choices that are ethical and user-centered, we create a better web for everyone."

Hope it helps and guides us in creating a better web for everyone :)

Using git pre-commit hook for php and js syntax check

This is a followup from my two previous posts on php and js git pre-commit syntax check where I had mentioned how to check for php and js syntax independently using pre-commit with git.



But what if we wanted to check for both php and js syntax at same time while committing. So, I used the scripts used for both and combined them. Below is the final result.

#!/bin/bash

commit_error=false

ROOT_DIR="$(pwd)/"

LIST=$(git diff-index --cached --name-only --diff-filter=ACMR HEAD)

ERRORS_BUFFER=""

for file in $LIST

do

    EXTENSION=$(echo "$file" | grep ".php$")

    if [ "$EXTENSION" != "" ]; then

        ERRORS=$(php -l "$ROOT_DIR$file" 2>&1 | grep "Parse error")

        if [ "$ERRORS" != "" ]; then

            if [ "$ERRORS_BUFFER" != "" ]; then

                ERRORS_BUFFER="$ERRORS_BUFFER\n$ERRORS"

            else

                ERRORS_BUFFER="$ERRORS"

            fi

            echo "Syntax errors found in file: $file "

        fi

        # Check for xdebug statments

        ERRORS=$(grep -nH xdebug_ "$ROOT_DIR$file" | \

                 sed -e 's/^/Found XDebug Statment : /')

        if [ "$ERRORS" != "" ]; then

            if [ "$ERRORS_BUFFER" != "" ]; then

                ERRORS_BUFFER="$ERRORS_BUFFER\n$ERRORS"

            else

                ERRORS_BUFFER="$ERRORS"

            fi

        fi

    fi

done

if [ "$ERRORS_BUFFER" != "" ]; then

    echo

    echo "Found PHP parse errors: "

    echo -e $ERRORS_BUFFER

    echo

    echo "PHP parse errors found. Fix errors and commit again."

    commit_error=true

else

    echo "No PHP parse errors found. Committed successfully."

fi

files=$(git diff --cached --name-only --diff-filter=ACM | grep "\.js$")

if [ "$files" = "" ]; then

    exit 0

fi

pass=true

JS_ERRORS_BUFFER=""

echo -e "\nValidating JavaScript:\n"

for file in ${files}; do

    result=$(jslint ${file} | grep "${file} is OK")

    if [ "$result" != "" ]; then

        echo -e "\t\033[32mJSLint Passed: ${file}\033[0m"

    else

        JS_ERRORS=$(jslint ${file})

        JS_ERRORS_BUFFER="$JS_ERRORS_BUFFER\n$JS_ERRORS"

        echo -e "\t\033[31mJSLint Failed: ${file}\033[0m"

        pass=false

    fi

done

echo -e "\nJavaScript validation complete\n"

if ! $pass; then

    echo -e "\033[41mCOMMIT FAILED:\033[0m Your commit contains files that should pass JSLint but do not. Please fix the JSLint errors and try again."

    echo -e $JS_ERRORS_BUFFER

    echo

    commit_error=true

else

    echo -e "\033[42mCOMMIT SUCCEEDED\033[0m\n"

fi

if $commit_error; then

    exit 1

fi

Store it in .git/hooks/pre-commit

Give it execute permission: $ chmod +x .git/hooks/pre-commit and it should be good to go :)

Sample output when I try to commit two php files and two js files with syntax errors:

Filenames with code content:

error.php

<?php
$array = ;

another_error.php

<?php

var_dump(');

error.js

i =

another_error.js

i = k;

$ git commit -m 'Error Commit' error.php another_error.php error.js another_error.js

Output from above error commit:

Syntax errors found in file: another_error.php 

Syntax errors found in file: error.php 

Found PHP parse errors: 

PHP Parse error: syntax error, unexpected ';' in /var/www/html/error.php on line 2

PHP Parse error: syntax error, unexpected '');' (T_ENCAPSED_AND_WHITESPACE) in /var/www/html/another_error.php on line 2

PHP parse errors found. Fix errors and commit again.

Validating JavaScript:

JSLint Failed: error.js

JSLint Failed: another_error.js

JavaScript validation complete

COMMIT FAILED: Your commit contains files that should pass JSLint but do not. Please fix the JSLint errors and try again.

error.js #1 'i' was used before it was defined. i = // Line 1, Pos 1 #2 Unexpected character '(space)'. i = // Line 1, Pos 4 #3 Unexpected '(end)'. i = // Line 1, Pos 3 #4 Stopping. (50% scanned). // Line 1, Pos 3

another_error.js #1 'i' was used before it was defined. i = k; // Line 1, Pos 1 #2 'k' was used before it was defined. i = k; // Line 1, Pos 5

Above script can be further modified to format the output better but is helpful for basic php and js syntax issues and js standard checks in code :)

Associating git hooks with js syntax check

This is a followup article from my previous post.

Here we will be using git pre-commit to check for syntax error while committing in JavaScript files.

We will need nodejs in our system. Please check https://nodejs.org/en/ for downloading and install steps.

Note: I am using ubuntu 14.04 for this setup.

Steps to add pre-commit JavaScript syntax check with git:

1. Use npm to install jslint package globally in your system.

https://www.npmjs.com/package/jslint

$ npm install -g jslint

This should globally install jslint in your system and can be referenced as below to check syntax error for any js file.

$ jslint sample.js

for (i = 0; i < 10; i++)

{

        sum += i;

}

Sample output from above command:

sample.js

 #1 'i' was used before it was defined.

    for (i = 0; i < 10; i++) // Line 1, Pos 6

 #2 'i' was used before it was defined.

    for (i = 0; i < 10; i++) // Line 1, Pos 13

 #3 'i' was used before it was defined.

    for (i = 0; i < 10; i++) // Line 1, Pos 21

 #4 Unexpected '++'.

    for (i = 0; i < 10; i++) // Line 1, Pos 22

 #5 Expected exactly one space between ')' and '{'.

    { // Line 2, Pos 1

 #6 Use spaces, not tabs.

    sum += i; // Line 3, Pos 1

 #7 Expected 'sum' at column 9, not column 2.

    sum += i; // Line 3, Pos 2

 #8 'i' was used before it was defined.

    sum += i; // Line 3, Pos 9

 #9 Expected '}' at column 5, not column 1.

    } // Line 4, Pos 1

Above info is quite informative and helpful to fix basic syntax errors, missing semi-colons, indentation etc.

Correcting the above errors to below code and running jslint again:

var i, sum = 0;

for (i = 0; i < 10; i = i + 1) {

    sum += i;

}

Output from jslint:

sample.js is OK.

Note: Please also refer rules and standards being followed by jslint for checking here. Makes a nice read. :)

2. Now that jslint is globally available, let us use it and create a pre-commit file.
I found below links which highlight the use of it in a script:

http://stackoverflow.com/questions/15703065/setup-pre-commit-hook-jshint
http://dev.venntro.com/2012/11/maintaining-consistent-javascript-with-jslint/

The only disadvantage I see in the script is that it only highlights passed and failed JavaScript files with names and does not specify the error in each.

So, I made a few changes to the script as below (highlighted in blue):

#!/bin/sh

files=$(git diff --cached --name-only --diff-filter=ACM | grep "\.js$")

if [ "$files" = "" ]; then

    exit 0

fi

pass=true

ERRORS_BUFFER=""

echo -e "\nValidating JavaScript:\n"

for file in ${files}; do

    result=$(jslint ${file} | grep "${file} is OK")

    if [ "$result" != "" ]; then

        echo -e "\t\033[32mJSLint Passed: ${file}\033[0m"

    else

        ERRORS=$(jslint ${file})

        ERRORS_BUFFER="$ERRORS_BUFFER\n$ERRORS"

        echo -e "\t\033[31mJSLint Failed: ${file}\033[0m"

        pass=false

    fi

done

echo -e "\nJavaScript validation complete\n"

if ! $pass; then

    echo -e "\033[41mCOMMIT FAILED:\033[0m Your commit contains files that should pass JSLint but do not. Please fix the JSLint errors and try again."

    echo -e $ERRORS_BUFFER

    echo 

    exit 1

else

    echo -e "\033[42mCOMMIT SUCCEEDED\033[0m\n"

fi

3. Save the above script in your git pre-commit file as below:

$ cd /project/directory/
$ vim .git/hooks/pre-commit

Paste the above content and save it. Then give execute permission to it.

$ chmod +x .git/hooks/pre-commit

And we are done and ready :)

Trying a sample case:

I have two js files named sample.js and another.js with below content:

sample.js:

var i = j;

for (key in names) {

    echo names[key];

}

another.js:

var i = []

Lets try to commit them:

$ git commit -m 'Error Commit' sample.js another.js

Below is the pre-commit check output:

Validating JavaScript:

JSLint Failed: sample.js

JSLint Failed: true.js

JavaScript validation complete

COMMIT FAILED: Your commit contains files that should pass JSLint but do not. Please fix the JSLint errors and try again.

 sample.js #1 'j' was used before it was defined. var i = j; // Line 1, Pos 9 #2 'key' was used before it was defined. for (key in names) { // Line 3, Pos 6 #3 Cannot read property 'kind' of undefined // Line 3, Pos 10

 true.js #1 Expected ';' and instead saw '(end)'. var i = [] // Line 1, Pos 11

The output can be formatted a little bit better to place each line error in a new line of its own. But this simple tool is pretty handy for checking js errors while committing :)

How to generate text representation of an image using PHP?

We will learn how to convert an image to its text representation using PHP that can be used in an html page (if any such requirement arises in your application or just for fun sake :) ).

The steps followed to convert the image to text representation are:

1. Get the width and height of the image to be converted.
2. Loop through every pixel value in the image.
3. At every pixel value, find the color at that position.
4. Apply that color to a # symbol we use to represent that pixel.
5. Finally we get the text representation of the image represented by # (hashes).

Code:

<html>
    <body style="background-color: #000000;">
        <tt>
<?php

$img = imagecreatefromjpeg('red_leaf.jpg');
$dx = imagesx($img);
$dy = imagesy($img);

// Loop through each pixel in the image and check the color
// Then do something with that color data like display the # character
// at the appropriate color for each pixel.
for ($y = 0; $y < $dy; $y++) 
{
     for ($x = 0; $x < $dx; $x++) 
    {
         $col = imagecolorat($im, $x, $y);
         $rgb = imagecolorsforindex($im, $col);
         printf('<font color=#%02x%02x%02x>#</font>',
             $rgb['red'], $rgb['green'], $rgb['blue']);
    }

     echo "<br>\n";
}

imagedestroy($im);

?>
        </tt>
    </body>
</html>

Image used in the program:

Sample output can be seen here.

Cool isn't it :)

Associating git hooks with php syntax check

Many a times we have faced this problem that when we commit something and it breaks something on the server due to some syntax error.

I know that these can be caught by IDEs and good editors, but sometimes there might be an syntax error introduced after a code merge conflict resolution and commit.

To address this, we can use git pre-commit hooks to check for any syntax errors in the to be committed files.

There is a good script I found which does this at https://github.com/ReekenX/phpcheck-git

Steps to add pre-commit php syntax check with git:

(Issue below commands in your console)

1. $ cd /project/directory/

2. $ cd .git/hooks/

3. Get the pre-commit script file from above github page or from direct link: https://raw.githubusercontent.com/ReekenX/phpcheck-git/master/pre-commit

$ wget https://raw.githubusercontent.com/ReekenX/phpcheck-git/master/pre-commit

4. Give execute permission to it.

$ chmod +x pre-commit

This should be it :)

Now if you try to commit any php file, it will display message about any syntax error. If there are, then it will specify the file, error and line number where the error took place and will abort the commit.

This small tool will help us in better checking our code before being committed :)

MVVM pattern as applied to Javascript

MVVM stands for Model, View and ViewModel pattern.

Application: Used in knockout.js library.

Role of each part:

Model - Handles the application's persisted data that is the data which the view page receives through an ajax request from the server(GET or POST). It can also be used to store the data which is passed to the page when the page is loaded for the first time with some data content, to be used later on client(browser) side.

View - It simply represents the html content. Each View is associated with a ViewModel. View changes according to changes in ViewModel(It's next in list).

ViewModel - It is basically a model for the view. It is a code representation of the data and the supported operations on it. The ViewModel is not usually used as a persisted storage medium but is meant to hold dynamic data and handle related operations. It basically holds the unsaved changes the user is working with. The data can be saved by posting it back to server.

                     ViewModels in knockout.js are implemented by POJOs(Plain Old Javascript Objects). For instance, if you are dispaying a list of todo notes(View), then your ViewModel might hold a list of such note objects and expose several functions to modify/add notes. Display of notes changes according to changes made to notes ViewModel.

Getting started with Redis

As per redis home page,

"Redis is an open source (BSD licensed), in-memory data structure store, used as database, cache and message broker. It supports data structures such as strings, hashes, lists, sets, sorted sets with range queries, bitmaps, hyperloglogs and geospatial indexes with radius queries."

Redis Installation Steps:

I am trying the below steps in an ubuntu 14.04 system. Open the terminal and issue the below commands:

1. Get the latest tar zip for redis (http://redis.io/download)

$ cd /path/to/download/directory/
$ wget http://download.redis.io/releases/redis-3.0.7.tar.gz

2. Untar it and issue below commands:

$ tar xf redis-3.0.7.tar.gz

$ cd redis-3.0.7

$ make

$ sudo make install

Getting started with Redis:

1. Run redis server in one console:

$ redis-server

or as a background process:

$ redis-server &

2. You can interact with redis now using the built-in client in console:

$ redis-cli

redis> set name Satej

OK

redis> get name

"Satej"

If you are a newbie at Redis like me, give a try at the online interactive tutorial: http://try.redis.io/. It's real fun and easy.

I learnt some basic data types and their related operations from the tutorial:
- integer
- string
- list
- set
- sorted sets
- hashes