1 + 1 = 1

JSConf is over. But what would have I done if I could attend?

timelysis — Wed, 04 Apr 2012 03:22:00 -0400

If you are into JavaScript and/or the web in general you probably have noticed that JSConf finished yesterday. I, most probably as many of you, could not attend. Bummer.

My twitter feed was overflowing with tweets containing the #jsconf hashtag, which sounded quite intriguing. While I was looking at my feed update (getting jealous) I thought - “What would I do if I was there?”

Therefore I decided to put together this short list, just for the heck of it.

1. Learn and discuss
I believe the number 1 reason to go to an event like JSConf is to learn and then discuss what you have learned. And having such a high concentration of people that live and dream in code is very much stimulating your brain activity.

2. Networking
The breaks, the after-parties and all the small group hacking sessions. Meeting people whose articles and tweets you have read is awesome! Having a drink with them is even awesomER. Plus all the sweet talking about JavaScript and how the Web will take over the world. Muhahaha!

3. Ride the mechanical bull
Yee-haa! That’s about it, I’ve never tried it so I’m pretty certain I’ll be a failure but heck why not give it a try.

4. Drink and code Mojito
Apparently mojito was a key word during JSConf ‘12. It seemed like people not only had the alcoholic beverage but also hacked together on the newly open-sourced Mojito MVC application framework by Yahoo. I would love to have a mojito while coding in mojito.

5. Tell people about tiljs.com
JSConf is probably one of the largest JavaScript development conferences and there are numerous JavaScript ninjas who have awesome tricks up their sleeves. The purpose of tiljs.com is sharing JavaScript knowledge (blog post about that) and the people at this conference can contribute a big bunch to my small project. I would have loved to tell them more about it.

Oh well, that’s my top 5. I would love to hear what’s yours?

How I built a website about learning JavaScript in 20 hours

timelysis — Thu, 29 Mar 2012 07:23:00 -0400

I love JavaScript, so I built tiljs.com. Read on to find out how.

I fully enjoy learning new trickery on optimizing, simplifying and improving my code. Therefore, I read a lot on the subject and always try to bookmark the source so that I can come back to it if I forget something. However, this creates a problem - my bookmark list is huge and unmaintainable. I can assume that you, my fellow coder, you suffer from the same disease.

I had a problem and, being the developer that I am, I had to solve it. It was a wonderful Saturday morning when I rolled up my sleeves, fired up Sublime Text 2 and started pondering.

My idea was to build a website where I can post what I’ve learned about JavaScript in more detailed way compared to a bookmark, add more than 1 link and also provide a comments section where others can share their opinion on the topic. Furthermore, others should be able to share their knowledge as well, so that we can learn from each other and get to JS ninja town in the end. So the goal was set, I was ready for lift off.

While working on the idea I came across the following questions:

0. Finding a name and buying the domain
I like short names. The purpose of the site - sharing what you have learned. Today I Learned JavaScript - tiljs. Short - check, sounds good - check, bought through Gandi.net - check.

1. Which server-side framework should I use
So I’m a PHP developer and I have experience with CodeIgniter, so this was the obvious choice. However, for quite some time I wanted to sit on my bottom and learn a new language like Python and/or Ruby. Python was first on my list, so I opened up the browser and asked Google about ‘python django’. After couple of minutes, I decided that it will take me at least a day to get a hang of it and I really wanted to finish the whole project in a weekend. Django was a no-go. Next I tried googling for ‘ruby on rails’. In my opinion, RoR has better documentation and learning it will go faster, but it was still going to require from me some extra effort. It was then that I decided to be boring and to go with what I know, CodeIgniter, and kick-start my project immediately. I couldn’t wait anymore.

2. Users sign-up - Twitter, Facebook or own sign-up
The question here was if I have to go for my own tailored sign-up process or pick Facebook or Twitter connects. Again, since the number one most important thing for me was getting it done, I decided to ditch the own sign-up option because it was going to take more time than the other options. Twitter was the obvious choice since that’s the place where people follow their interests rather than sending each other cat videos and photos of drunk people. I followed this useful tutorial on integrating Twitter OAuth API with PHP and soon enough I had my sign-up ready and kicking.

3. One-page app vs. page refresh
Let’s not forget I’m a huge JS fan, so I was kind of hurting for the one-page app option. However, once again I remembered I’m trying to get to my MVP as soon as possible, so I decided to stick to the old and simple page refresh technique.

4. Design
I didn’t have a lot of questions here. I knew I was after the dead-simple list design, something like what Hacker News has, but a tiny bit more marvelous. I used parts of Twitter Bootstrap here and there, and I’m quite fond of what the design turned out to be (having in mind I’m not a pro designer).

5. Sharing
I’ve seen quite some social plugins, but I decided to stick to AddThis. It’s a dead-easy way of integrating social sharing on your page/website. And I believe a social sharing plugin was an important addition to my share-what-you-have-learned site because “sharing is caring”.

6. Hosting
I was experimenting with DotCloud recently and I’m just loving how simple hosting and deploying can be with their PaaS. I configured 2 stacks for my project - PHP and MySQL, which is for free (you get 2 stacks for free) and I was ready to push my code. All it takes me to deploy is typing ‘dotcloud push tiljs’ in my terminal and voila - it’s online. It takes literally less than 5 minutes to get your product up and running.

It was early Sunday evening when my idea was online, fully functioning and waiting for enthusiastic JavaScripters. It took me around 20 hours from start to finish.

Are you as enthusiastic about JavaScript as I am? Then make sure you check out tiljs.com. I’ll be more than glad to hear your feedback and see you share JS trickery.

jqcached makes DOM selectors caching extremely sexy

timelysis — Fri, 24 Feb 2012 04:04:15 -0500

Welcome fellow Javascript code monkeys,

For a while now, I keep on wondering why Javascript frameworks don’t provide an unified way of DOM selectors caching. I’ve been using this homemade jQuery plugin that aids that exact purpose so I decided to share it with you.

We all know the DOM is very slow… slooowww. Usually it is the bottleneck of your Javascript application, so we have to respect it and use it carefully. Minimizing the number of reflows the browser has to make is probably one of best advices when it comes to DOM interaction. Even though less expensive than reflows, DOM querying should also be taken into account. So why re-query the DOM every time when we can cache our selectors? Share this with a friend who doesn’t know yet about the advantages of DOM selectors caching. Sharing is caring.

So I present you jqcached - simple, yet makes your life sexier. Make your application perform better by querying the DOM once and using the selectors without any additional overhead of re-querying them ever again. Visit the project page.

Why use it?

1. The DOM is slow, it is a bottleneck for each JavaScript application. Respect it - cache and reuse.
2. In case you change the name of element’s class or ID, you have to change it only at one place instead of all over the code.
3. It creates convenient coding convention.

How-to use it without context


// Cache by assigning to the jQuery object
$.jqcached({
	'navMenu': $('#navMenu'),
	'home': $('#navMenu').find('li:first')
	'nextPage': $('a.nextPage')
});


// Use by accessing selectors from $.ss
$.ss.navMenu.show();
$.ss.home.bind('click', function () {
	alert("We are in bee's knees");
});
$.ss.nextPage.addClass('highlight');

How-to use it with context


// Or cache by assigning to a passed object
var myMenuView = {};
$.jqcached({
	'navMenu': $('#navMenu'),
	'home': $('#navMenu').find('li:first')
	'nextPage': $('a.nextPage')
}, myMenuView);


// Use by accessing selectors from myMenuView.ss
myMenuView.ss.navMenu.show();
myMenuView.ss.home.bind('click', function () {
	alert("We are in bee's knees");
});
myMenuView.ss.nextPage.addClass('highlight');

Download it from this public Git repository.

How to create a kick-ass product? What I learned from 37Signals's book - Rework

timelysis — Mon, 06 Feb 2012 18:57:11 -0500

Before we begin I want to say that if you have the time, buy and read the book. It’s great source of how-to and how-not-to do a business. It breaks a lot of business myths and builds stable foundation for creating a product the right way.

I’ll write down the key points I found intriguing as a reference to which I can come back. Hopefully it can be helpful to you too.

1. Find your passion and go!
What is the thing that makes your blood boil? Passion for what you build is the most important asset you have. Find it and start, there is big chance there are other people out there who share the same passion. Reach out - blog, tweet, talk about your passion, find people that want to listen to you. Share what you learn on the way - sharing is caring. Create something that you need, there are people who need the same.

2. Failure vs. Success
It’s a common believe that it’s okay to fail, however the mass acceptance of it creates a negative vibe which does cause more people to fail. Be different, believe in your passion, believe in your success and it will come. We learn a great bunch more while being successful, rather than accepting failure and trying again.

3. Ignore the real world
Don’t listen to conventional wisdom that tells you “this is not going to work”, if you have a good gut feeling and passion about something just do it.

4. Yes, go! Do!
Passion by itself is not enough, idea by itself is nothing. What matters the most is the execution of the idea. Again, sit on your bottom and do, don’t find excuses in “not having enough time” or “not having enough money”. You don’t have to have big wallet, hundreds of employees or five-years-ahead business plan. It’s all about keeping it simple. Rework the way you work.

5. Start from the core
Be as lean as possible, find your core feature. Make it simple, make it stand out, don’t bury it behind dozen other features. Less is more. People understand simplicity, that’s why they love it. Don’t throw in more and more features to make all people like you, focus on one feature, make it perfect and a handful of people will adore you.

6. Don’t lose your focus on planning
You’ve just started. You shouldn’t focus on what could be and guessing what it will be, rather sit on your bottom and build the product. Nowadays we live in a dynamic world where things change every day, that makes it almost impossible to create a good plan. Take actions instead of making plans. We are bad estimators. When you estimate a project to be several months long, probably it will take twice as much. Break it down, split the big project into easier and simpler steps that can be done in several days. Building step by step will do you good.

7. It’s time to launch
You already started building your product, probably it’s time to launch. Remember one thing - put it out there. That’s the only way to validate an idea, that’s the only way to get feedback. You might think that it’s not ready yet, but most probably you are wrong. Do you have your core feature ready? Don’t add more features, cut them out. Lean is what you should go after - lean and mean!

8. Don’t be in a hurry to grow
Again, keep it as lean and as simple as possible. Don’t add new features or employees if you don’t absolutely need them. Premature will to grow might cause dramatic failure. Take your time, focus and think. Furthermore, being small makes it easier to change the direction of your product. There are less people that know you, which implies less responsibilities. That results in more flexibility, which even big companies try to achieve.

9. Stand high
Have a point of view, a strong opinion that defines you, your idea and your business. Create an identity for your product, that’s what will attract customers and supporters. Once you’ve build your identity, stand behind it. Live up to the expectations you set with it. No one likes a liar!

10. Distractions are your enemy, focus!
People always complain that they don’t have time while that’s not true. Everyone has enough time, but people tend to be distracted quite easily. When you do a task focus on it, and only on it and this will increase your productivity. Switching between different tasks in a short interval of time is costly operation, we are not robots, don’t multi-task, focus instead. Furthermore, don’t concentrate on what your competition does, don’t soak into their ideas, because you become a follower. You want to be a leader instead, don’t get interrupted being yourself, focus!

11. Ask yourself questions to make sure you are on the right track
Those are several of the questions 37Signals suggests:
- Why are you doing this?
- What problem are you solving?
- Is this actually useful?
- Is there an easier way?
- What could you be doing instead?

Think. Focus. Start.

How to implement an awesome JavaScript JSONP API in 4 easy steps

timelysis — Thu, 02 Feb 2012 10:15:10 -0500

Recently I was given a project at work which had to get some data from a server on a different domain through JavaScript. We all know that this is not possible because of the same origin policy, however JSONP is here to help us hack around the problem. JSONP stands for JSON with padding and it’s incredibly simple, yet powerful way of requesting data from a server on a different domain.

Let’s suppose you want to build a public API that returns how awesome is something.

You want to provide something like:

how_awesome.is('@filipminev'); // Returns: Uber rad!

I’ll show you how to do it in 4 easy steps.
Let’s get down to bee’s knees.

1. JS API wrapper
I assume you will most probably want to build an API which has one or more public functions (API methods) and several private (internal) ones. I’ve chosen to present the Module Pattern, because it provides a clean way of having private variables and functions. You can read more about it here.


(function (window, document, undefined) {
    // We pass the window, document and undefined as parameters
    // so that the references to those global variables
    // inside the closure do not have to perform a scope look-up.
    // (tiny performance gain)


    var how_awesome = (function (window, document, undefined) {
        var api = {},
            _callID = 1; // Private variable


        // Public API function
        api.is = function(thing) {
            // 
            // Code goes here...
            //
        };


        // Private function
        function _parseJSON(jsonStr) {
            //
            // Code ...
            //
        }


       // Global function
	window.awesomeCallback = function(jsonStr) {
            //
            // Callback code
            //
	};


        // Returning the api variable
        // exposes the 'is' function as public, 
        // everything else stays private
        return api;


    })(window, document);


    // We make 'how_awesome' a global variable
    window.how_awesome = how_awesome;
})(window, document);

2. JSONP request
We create a JSONP request via a script element injection - create a new script tag with src attribute = the destination of the data we have to fetch.


// Public API function
api.is = function(thing) {
    var src = '';


    // Remote domain from where we need to request data
    src += 'http://how.awesome.is/?';


    // We want to know how awesome is the thing
    src += 'thing=' + encodeURIComponent(thing);


    // Callback and callID are explained later
    src += '&callback=awesomeCallback';
    src += '&callID=' + _callID;


    var head = document.getElementsByTagName('head')[0];
    var script = document.createElement('script');
    script.async = true;
    script.id = 'awesome_' + _callID;
    script.type = 'text/javascript';
    script.src = src;


    // Appending the script to the head makes the request!
    head.appendChild(script);
    _callID++;
};

3. Create JSONP response
Let’s assume our JSONP request ended up on this really simple PHP script, which we will call awesomeness.php.


<?php
    $howAwesome = array(
        'Stinks like unwashed socks',
        'Meh',
        'Not to shabby',
        'Auwesome',
        'Uber rad!' 
    );


    if (isset($_GET['thing']) &&
        isset($_GET['callback']) &&
        isset($_GET['callID'])) {


        $callbackData = array();
        $callbackData['callID'] = $_GET['callID'];
        $callbackData['thing'] = urlencode($_GET['thing']);


        $asciiSum = 0;
        $thing = $_GET['thing'];


        for ($i = 0, $len = strlen($thing); $i < $len; $i++) {
            $asciiSum += ord(substr($thing, $i, 1));
        }
        $callbackData['awesomeness'] = $howAwesome[$asciiSum % 5];

        
        // That's how we create the JSONP response!!
        echo $_GET['callback'] . "('" . json_encode($callbackData) . "')";
        return; 
    }

As you can see we create the JSONP response just by wrapping the json encoded data by the callback specified in the JSONP request. In that way we return JavaScript code which is then interpreted by the browser. It will try to find in our case a global function named awesomeCallback.

4. Handle JSONP response
As mentioned above, now the browser will call the global function awesomeCallback with the JSON string as a parameter. So let’s define the function, I’ll put it in our API wrapper closure since it uses the private function _parseJSON.


window.awesomeCallback = function(jsonStr) {
     // Parses JSON string to JSON object
    // See function definition below
    var json = _parseJSON(jsonStr);


    // API call clean-up
    // Removes the injected script from the DOM,
    // that's why we needed a callID parameter
    // that we pass in the JSON request
    var elem = document.getElementById('awesome_' + json.callID);
    elem.parentNode.removeChild(elem);


    // Print the result!
    var thing = decodeURIComponent((json.thing+'').replace(/\+/g, '%20'));
    console.log(thing + ' is ' + json.awesomeness);
};

Since I decided to make this example JSON API framework agnostic, we need a function that parses the returned JSON string into a JSON object. That’s the definition of the private function _parseJSON:


function _parseJSON(jsonStr) {
    if (typeof jsonStr !== "string" || !jsonStr) {
        return null;
    }


    // Has JSON.parse built in?
    if (window.JSON && window.JSON.parse) {
        return window.JSON.parse(jsonStr);
    }


    // Logic borrowed from https://github.com/douglascrockford/JSON-js/blob/master/json2.js
    if (/^[\],:{}\s]*$/
    .test(jsonStr.replace(/\\(?:["\\\/bfnrt]|u[0-9a-fA-F]{4})/g, '@')
    .replace(/"[^"\\\n\r]*"|true|false|null|-?\d+(?:\.\d*)?(?:[eE][+\-]?\d+)?/g, ']')
    .replace(/(?:^|:|,)(?:\s*\[)+/g, ''))) {
        return (new Function( 'return ' + jsonStr))();
    }
    throw new SyntaxError('JSON.parse');
}

Voilà! Our awesome JSONP API is complete! You can check out the complete source on GitHub.

Another very intriguing topic, which I would like to discuss with you in the comments below, is: How do we secure a JavaScript JSONP API like that one? Any suggestions?

FOCUS, FOCUS, FOCUS on the process

timelysis — Fri, 20 Jan 2012 03:39:00 -0500

“Hey you, you..” Hugo shouted.

A tall girl turned around.

“Yes… yes, you!” he confirmed.

She didn’t know him, so she was obviously confused. Nevertheless, she strode towards his direction. Her hair red and wavy, eyes glaring with the reflection of every color around, her hands gracious, her legs long and skinny.

“Listen, listen. Focus… I have no time.” Hugo panted.

“Do I know you?” the girl asked.

“Ah pardon, I’m Hugo.” he answered. “And what’s your name?”

She took a step back, wondering whether she should answer or just walk away. Her lips were trembling, she was about to speak. “Charlotte.”

“I’m pleased to meet you dear lady. Do you maybe have a moment to spare?”

“Hmm.. but.. yes, yes sure.” Charlotte answered while checking her tiny wrist watch.

It was a sunny day with mild wind. They were standing in front of the train station in Brussels, facing each other. Two strangers - one with a problem, and the other possibly with a solution.

“I missed my train.” Hugo explained. “Do you know where I can check when is the next train to Paris?”

“Yes, follow me.” she told him.

They passed through a huge room with a high ceiling, people inside it looked like tiny ants in a big anthill. In there everyone looked tense and in a hurry just like Hugo. But not Charlotte, she seemed to be calm.

“The timetable is right there.” she smiled, soring her long index finger in the air. “Across of you.”

Hugo impatiently looked, scanning through the many blinking rows of trains leaving the train station, setting off in various directions. His eyes glimmered when he saw Paris on it. Platform 5, train leaves at 14:41.

“Excuse me, Charlotte, what time is it?” asked Hugo.

Hugo turned around, but she was gone. Ah, and he even forgot to thank her. He scanned the room as he scanned the trains timetable, just this time Paris was Charlotte.

Yes, there she was. He saw her red wavy hair dangling down a long corridor. He quickly followed her.

“Charlotte, hey, Charlotte..” Hugo was running after her.

Charlotte turned around, her smile was still hanging there underneath her pointy nose.

“Hi” Hugo tried to catch his breath. “Sorry, I didn’t have a chance to say thank you, so thank you.” he smiled for a first time today.

“No worries.” she answered.

“Can I.. do you maybe want to get a coffee?” Hugo proposed - impatiently waiting for Charlotte’s answer.

“I would love to, but only if we walk North.” she said. “I go only to the North.”

Hugo was confound by her answer, but quickly came to his senses and answered. “Yes, North, right. I have about 42 minutes to my train. It has to be enough.”

They walked away together - Charlotte walked North, Hugo walked next to her. Not event after a minute they found a cozy looking place. Hugo ordered himself a shot of espresso, because he “needed it very badly” as he mentioned to Charlotte on their one minute walk to that place. She had a glass of water.

“So where are you going to the North?” Hugo asked, sipping from his tiny cup of coffee.

Charlotte smiled, she expected that question. “Nowhere specific, just to the North.” She made a small pause, saw the confusion in Hugo’s eyes and continued. “I have no final destination, I’m just going North.”

“Hm, where do you plan to go to? Holland? Denmark? Norway?” he asked still confused.

“I don’t have a plan. I just wake up everyday and go North. I take small steps. I’m not in a hurry because I don’t have a destination. I have a direction.” she continued.

“But what about work? Don’t you have a job? Don’t you have any responsibilities?” Hugo was interested.

Charlotte brushed back her hair and smiled. Hugo was staring at her. She had a beautiful smile. “I did have a job,” she answered “but then I quit 2 months ago. Since then I’m walking North.”

“But why North?” Hugo wanted to know more.

“Because I threw a coin twice, and twice I got heads. If it was tails, I was going to head South.” she took a coin out of her pocket and put it on the table between them. “I learned a lot of things on the way - about myself and life in general. I realized how important focus is. I used to have a plan and destination, to be in a hurry to finish all my to-dos. To-do after to-do were streaming in and out of my head. I lost my freedom. I became a slave of my own plans. Hugo, do you know what is the meaning of the name Charlotte?” she asked.

“No, do you?” he responded.

“It means free man. I was not free anymore, Hugo. I was a prisoner. My being was not defined by my thoughts, but rather by my to-dos. I needed a change. Then I found about focus.” she smiled widely. “Focus means to take your time, not to rush, to enjoy, interact and learn from whatever comes on your way, not to generalize.” her voice was full of enthusiasm and passion. “Our ancestors were once thinkers, but our world today turned us into doers. We value quantity and solutions, but we forget about the process.”

“The process?” Hugo asked.

“Yes. The distance between the start and the finish, the distance between A and B. Many people see only B and have their eyes on the price, other don’t even dear setting off from A. Those kinds of people are very different, but they are the same when it comes to understanding focus and process. When one focuses on the process, he can find great gems on the way. And it’s up to me and you to find those little gems.”

Charlotte pushed the coin towards Hugo. “Flip the coin.” she prompted him. He took it and the coin went into the air, flipped and fell back on the table. Meanwhile, Charlotte stood up and looked back at the coin.

“Do you know what’s the meaning of your name, Hugo? It means thinker. Maybe Paris will not be your final destination.” she smiled and left the café.

Hugo was still standing there, looking down at the coin. It was tails.

WebEater follows you wherever you go

timelysis — Wed, 28 Dec 2011 11:36:59 -0500

It’s holiday time! And don’t we all love that. A week ago I packed my bags and came back home. I wanted to see and catch up with lots of friends, so I directed my browser to Facebook and contacted them. There was I chatting and occasionally waiting for a reply when I got myself thinking - “Isn’t it going to be neat to have something quick and funky to do while I’m waiting for the response?”

And WebEater was born.

Press Alt + S to show and hide it.

It’s a Nokia-like snake game that follows you wherever you go on the interwebs.

All you should do is drag and drop the link below into your bookmarks bar, therefore creating a bookmarklet.

WebEater

And bam! You can play it wherever you go. Just click on the bookmarklet that you created and press Alt + S. It’s already preloaded in my blog, so all you need to do is press Alt + S now.

Controls:
Arrow keys - move
Alt + S - start/resume
Alt + S - pause
Alt + R - restart

The game was implemented using the HTML5 canvas element and you can find the code in this GitHub repo.

From 0 to 15,909 pageviews: the Hacker-News and Paul-Irish effects

timelysis — Thu, 22 Dec 2011 11:01:20 -0500

Whoa, that’s pageviews.
All the way. Double pageviews.
Oh my God. It’s double pageviews all the way.
Whoa, that’s so intense.
Whoa, man. Wow. Whoa-ho-ho.
Oh my God. Wow. Yeah.

Look at that.
It’s starting to even look like triple pageviews.
Oh my God. It’s double pageviews all across the graph.
What does this mean?

It’s so beautiful. *weeping*

Disclaimer: I know this number is nothing for most of you, nevertheless that’s a milestone for me.

On 11/11/11 11:11:11 I started this blog which I called 1+1=1. It’s idea is to celebrate imagination and serve as my brain dump. Many people ask me why 1+1=1. The explanation is below.

The first articles were focused on imagination: how it works, how to get brilliant ideas using it and then just do it. I truly believe imagination is the greatest resource we, humans, have, next to time. I got several ‘nice read’ comments from friends and that meant a bunch to me. Woohoo, there was someone out there reading it.

Then I wrote an article about the reasons you must install Sublime Text 2. I use it extensively (for work mostly writing PHP, for my side project mostly writing JavaScript and for my blog mostly writing gibberish) and I had to share the love.

Hacker-News effect

So what happened? I posted the article on Hacker News at 4pm UTC following the advice from this post: “Whats the best time to post to HackerNews”. In the first 30 minutes the article got several up-votes and comments, when suddenly they started growing faster - it made it on the frontpage. I was excited. The post stayed on the frontpage for about 30 minutes. In the evening I couldn’t follow up the blog because I had a Christmas party to attend, but when I came home early in the morning I sat in front of my computer to find out that I’ve made 3,274 pageviews that day. Woohoo again!

What are the reasons that the post got any vote-ups and comments? I believe there are 4 reasons:

1. Number in the title
The title was “9 reasons you must install Sublime Text 2. Code like a man, man.” When you see the digit 9 and the word ‘nine’, which one do you understand and assimilate faster? Digits work better - they are shorter, so faster to read. When you scan through a page in most of the cases digits catch your attention because we process them immediately.

2. Scandalous statement in the title
“Code like a man, man.” That was unplanned, I promise. It was a reference to the hilarious OldSpice commercial which states - “Smell like a man, man.” Nevertheless, some people called it sexist. However, this resulted in more comments because if people were not interested in the article itself they wanted to talk about the “sexist” title.

3. Entertaining intro
There is a lot of information on the internet, a lot. It’s impossible to read everything, and therefore readers pay less attention and time for reading every single piece of news. I tried to attract readers by making the article’s intro engaging and entertaining Sublime-Text-2 version of the OldSpice commercial. I believe the intro is the crucial point when the reader decides whether to read on or leave.

4. Written with passion
It’s mentioned last, but it’s the most important one. I wrote about Sublime Text 2 because it fascinates me. I believe when you write with passion, you find people who think likewise.

Paul-Irish effect

The day after publishing my post the pageviews naturally went down. However, on the next morning, I opened Google Analytics and I was surprised. More than 60 people were reading the blog at that very moment. What was going on? I checked the top referrals and found out most of the visitors come from Google+. I thought to myself “Hm, I didn’t post it there.” I surfed to Google+, pasted the URL of the blog post in the search bar and what do I see? Paul Irish had shared it. I smiled.

There was a constant flow of visitors all morning and afternoon. Then in the evening Paul Irish tweeted that his “G+ stream has been lighting up” which resulted in even more visitors and even more people started tweeting the link. The pageviews got up to 4,298 for that day only. Woohoo once again.

What are the reasons Paul Irish posted the link on his Google+ stream? I believe there is 1 very important reason.

It’s all about moving the web forward. Linters are amazingly useful code quality tools, they make you write better code. JSHint and JSLint are awesome. JSHint integrated in your Sublime Text 2 editor is even better. If everyone is on the same page when writing code, the web will move forward in a faster pace.

Conclusion

Hacker News, Twitter and Google+ are all great platforms for discovering useful information and getting discovered, use them wisely. If you have something interesting to say, don’t wait another instance, just do it. Sharing is caring!

9 reasons you must install Sublime Text 2. Code like a man, man.

timelysis — Thu, 15 Dec 2011 10:03:00 -0500

Don’t miss my new blog post:
How I built a website about learning JavaScript in 20 hours

Hello, fellow code monkeys.

Look at your editor. Now back at mine. Now back at yours. Now back to mine. Sadly your editor is not like mine. But if you stopped using noob-scented editor, and switched to Sublime Text 2, your editor could look like mine.

Look down. Back up. Where are you?

You are on a desk with the editor your editor could look like.

What’s in your hand? Back at me. I have it! It’s a package control with several handy plugins that you would love. Look again. The plugins are now diamonds. Anything is possible when your editor looks like Sublime Text 2 and not Eclipse.

I’m on a horse.

Coming straight from the homepage of Sublime Text: “Sublime Text is a sophisticated text editor for code, html and prose. You’ll love the slick user interface and extraordinary features.”

0. It’s gorgeous
I probably can’t stress that enough - Sublime Text is the most beautiful editor I have laid eyes on. It has simple, clutter-free UI, and yet powerful functionalities. Before I switched I even created this Eclipse Sublime-Text-like color theme (it’s in top 20 most picked themes), because the syntax highlighting of the default theme is that awesome. Then, one happy day I just closed Eclipse and downloaded Sublime Text 2.

1. It’s blazing fast
I can open it and then close it for less than 10 seconds on my Mac OS X 10.7.2. For comparison, it takes me 2 minutes to do the same with Eclipse. Opening files, switching between files, searching in files and the whole project, switching between different projects, it is all amazingly fast. Just try it!

2. It’s updated pretty-much daily
You can have Sublime Text 2 if you download it from here. It is available for all the popular OS choices - OS X, Linux and Windows. The editor can be downloaded for free, however a license must be purchased for continued use. There is currently no enforced time limit for the evaluation.

However, in order to get the daily updates you gotta download the nightly/dev version from here: http://www.sublimetext.com/dev. You will not regret that.

3. ⌘ + P
I just love that! That’s my bread and butter.

Command + P (OS X) or Control + P (Linux/Windows) activates the magic. Press the combo and a drop-down appears.

Start typing and see how the files of your project jump in and out, that’s the fastest way to search for files in a project. The cool thing is not only it searches for the filename, but also the whole file path. So if you have a file - src/Controller/TestShizzle.php, and then search for “controller test”, bam you have it! Furthermore, the search is quite forgiving when it comes to typos, which is neat.

So after you wrote “controller test”, and Sublime Text focused the correct file then you can continue with “controller test@” which reveals the list of methods in that file. Cool, heh?

When you have opened a file:
- Command + P and then type ”@”, that gives you a list of all the methods in this file.
- Command + P and then type ”:” followed by a number, that jumps to the specified line number in this file.

4. Installing packages can’t be easier
First install Package Control from here. Restart Sublime Text and you are ready to go!

Shift + Command + P gives you another handy drop-down. Write “install” and an option “Package Control: Install Package” appears. Select it by hitting “Enter” and wait for the package list to load. Browse through it or simply search for a specific package. Easy!

When you install a plugin through the Package Control, it is being automatically updated to the newest version. Restart the editor after you install plug-ins in order to start using the goodies.

5. Git plugin
Install by following the instructions here: https://github.com/kemayo/sublime-text-2-git/wiki (Easy way to install: use Package Control: Install Package and search for “Git”).

Use it. Shift + Command + P comes in use again. Shift + Command + P and write “git”, you will see all the possible git commands you most probably use on a day-to-day basis. Shift + Command + P+ “git blame” + hit that “Enter” + punch the colleague that broke the sacred code. :) You have it all - git status, git pull, git push, git diff, you name it.

6. Code completion
A plugin which probably you will fancy: https://github.com/Kronuz/SublimeCodeIntel (Easy way to install: use Package Control: Install Package and search for “CodeIntel”).

You use it by Control + Space, also you can explore classes and methods by clicking on them while holding the Alt key. Don’t despair! The first time you use the plugin it will need to build some indexes which can take more than a few seconds (depending on the size of your project). If $allOk === true then you are good to go.

7. Lint plugin
SublimeLint will hurt your feelings, but it will make you write better code: https://github.com/Kronuz/SublimeLinter (Easy way to install: use Package Control: Install Package and search for “SublimeLinter”).

It has built-in linters for JavaScript, PHP, Python, Ruby, Java, Perl and Objective-J. It is extremely handy.

8. Many other goodies I use on a daily basis
- WordHightlight plugin is something useful: https://github.com/adzenith/WordHighlight
- Make the gorgeous, even more gorgeous with this funky Soda theme: https://github.com/buymeasoda/soda-theme
- Control + Command + P - switching between different projects
- Command + / - commenting/uncommenting
- Command + ] - Indent
- Command + [ - Unindent
- Control + Command + Up - move selected line up
- Control + Command + Down - move selected line down
- Command + Number - switches to an open tab. Command + 1 goes to the 1st tab, Command + 2 - 2nd tab, etc.
- Shift + Command + F - searches through the whole project
- Shift + Control + K - deletes selected code or line

TL;DR
Sublime Text 2 is just auwesome. It makes you fly like Superman, fight like Chuck Norris and code like Linus Torvalds. Download it. Impossibru!

ф.

You are running out of time. If you have an idea, just do it!

timelysis — Thu, 01 Dec 2011 16:34:00 -0500

You are running out of time. I am running out of time too, so I will be short. In my previous articles I talked about imagination - what is it, how to use it, how to get brilliant ideas. You don’t have an idea yet? Go have a beer with Imagination, think, talk and then come back here.

If you are a person who:
- dreams of getting into a great university. Just go and study!
- wants to be be stronger, run further, be healthier. Just put down the chocolate and run!
- is an artist that takes marvelous photos, draws touching images. Just take the camera and go outside!
- envisions a change in the politics and economics of their country. Just get involved!
- has a business plan for a product. Just go out and sell it.
- is a start-up enthusiast (entrepreneur, code monkey, design guru). Just sit down on your ass and code!
- has a crush on this cute girl/guy you see everyday in the lunch break. Just go and say ‘Hi’!
- is a dreamer!

Carpe diem. Just. Do. It.

Dream as if you’ll live forever. Live as if you’ll die today.
—James Dean

Why always “not yet”? Do flowers in spring say “not yet”?
—Norman Douglas

And in the end, it’s not the years in your life that count. It’s the life in your years.
—Abraham Lincoln

To change one’s life: Start immediately. Do it flamboyantly. No exceptions.
—William James

You may delay, but time will not.
—Benjamin Franklin

We cannot waste time. We can only waste ourselves.
—George M. Adams

Life happens too fast for you ever to think about it. If you could just persuade people of this, but they insist on amassing information.
—Kurt Vonnegut, Jr.

There’s never enough time to do all the nothing you want.
—Bill Watterson

The fear of death follows from the fear of life. A man who lives fully is prepared to die at any time.
—Mark Twain

What would be the use of immortality to a person who cannot use well a half an hour.
—Ralph Waldo Emerson

May you live all the days of your life.
—Jonathan Swift

I wasted time, and now doth time waste me.
—William Shakespeare

Every second is of infinite value.
—Johann Wolfgang von Goethe

We are always getting ready to live but never living.
—Ralph Waldo Emerson

The future has a way of arriving unannounced.
—George F. Will

When one has a great deal to put into it a day has a hundred pockets.
—Friedrich Nietzsche

We’re fools whether we dance or not, so we might as well dance.
—Japanese Proverb

And no, we don’t know where it will lead. We just know there’s something much bigger than any of us here.
—Steve Jobs

Inhale. Exhale. Close your eyes. Imagine. Open your eyes. Go and do it!

ф.

Inhale. Exhale. How to come up with possibly brilliant ideas?

timelysis — Sat, 26 Nov 2011 14:58:00 -0500

Inhale. Exhale. It is dark outside and the sun has set long time ago. It feels like ages since I saw the light for a last time. It is even darker in my room since my lights burned out a week ago. I have three candles that glimmer in the darkness and the light coming out of my computer screen. It brightens me but it does not enlighten me. I separate my fingers from the keyboard, pick my hands up, rotate them 180 degrees, look at them and then put them on my eyes. It is even darker and I like it. Oh, how much I do value it. Inhale. Exhale. The music in the background is farther and further than a moment ago, it echoes in my ears. Inhale. Exhale. The pitch black in front of my eyes starts twisting, it forms a black hole which pulls me towards itself. It is the last quarter of second before I get sucked in. Inhale. Exhale. Freedom. I am in the middle of nothing, it is just me, myself and I(magination). Go!

Let’s go approximately five months back in time. It is a Saturday afternoon in the beginning of the summer. I am laying on my bed after watching several episodes in a row of That 70’s Show when I realize I haven’t had my lunch yet. I crawl out of bed, pace slowly through the infinite corridor leading to the living room and the kitchen. I open the fridge, take a pick inside and close it. I walk out of the kitchen and slide on the sofa where I spend a dozen of minutes thinking with what I could possibly pleasure my stomach. I make myself scrambled eggs with bacon. Now let’s leap an hour and a half forward. Inhale. Exhale. I am sitting under the shower - the hot water is raining down on me while I am looking at the water whirling around the siphon and then disappearing forever just like the seconds spent watching it. Skip forward another three hours. Inhale. Exhale. I am in a gloomy pub - the music echoes on the dark walls and jumps back at us. We are having dark beers and my thoughts rarely return back from the dark walls unlike the music. Close your eyes. Inhale. Exhale. We are another two hours ahead. I collapse on my bed, too tired and busy with empty thoughts to even go out of my own clothes. I lay on my back and stare into the darkness. I have goals and I am not even moving an inch closer to them day after day. I have procrastination in my blood stream. It is time for change, time to put my time back on time.

Let’s go approximately three hundred years back in time. “Aha!” it’s probably what Newton said to himself when he saw the apple falling down on the ground. He has just found the force of gravity - the force which pulls all of us towards the center of Earth. Newton’s Universal Law of Gravitation is extremely important scientific discovery that changed our understanding of the universe. And how did it all happen? Sir Isaac Newton was wandering in the apple-tree gardens, unwinding his thoughts and opening his mind to what imagination says.

Let’s go approximately two millennia back in time. “Eureka! ” shouted Archimedes running naked on the streets of Syracuse. He had just found out that the volume of displaced water in the bath is equal to the volume of his body. He was enlightened, he had an insight. How did he have this idea? Wouldn’t it be good if we had a recipe that we can follow step by step? A spoonful of apple seeds, 10ml of water and a pinch of brown sugar. What did Archimedes do? He was relaxed, his mind was free of any thoughts, he was submerged into the bathtub and his imagination. I say yes, there is a recipe. There are certain steps you can follow to get ideas. Some of the ideas might be totally ridiculous, but some of them might be ingenious. I will share my approach which I believe might work for you as well.

We are back to nowadays. Inhale. Exhale. I slowly open my eyes. It is nine o’clock in the morning and it is bright outside. I open my window and take a deep breath. Inhale. Exhale. The air is fresh - it wakes up my mind and energizes my body. I stand up, open the door and walk in the bathroom. I turn on the water in the shower and while waiting for it to heat up I stand in front of the mirror, observe my reflection and reflect on what happened in my dreams. After a minute or so I go under the running water. Inhale. Exhale. Close my eyes. My mind starts drifting after a while, it goes wild. It goes from penguins to deep space exploration and time travel. I am just sitting motionless and observing my thoughts flow over my head. Have you noticed how the walls in the bathroom get steamy and when you move your fingers across you leave marks? The walls are my canvas. I draw. I spend a big chunk of my time in the shower drawing my thoughts on the walls. After half a minute the drawings start disappearing, then I redraw the good ones and let the rest vanish from time and space. I do not ask myself “why” or “but”, I just let imagination do its thing.

The “Aha” and “Eureka” moments do not always come easily. When we have set on a quest to solve a problem, to find a solution, we might get stuck somewhere in the middle. We get frustrated that our thoughts do not move forward even though we have examined all possible ways to get to the solution. It is easy to give up when you are in this situation. But then procrastination will possess you and will not let go. Procrastination feeds on weakness - giving up makes it stronger, putting off feeds it. How do we leap over this abyss? How do we get to the ideas? My recipe:

1. Inhale.
2. Exhale.
3. Close your eyes.

Cover your eyes with your palms and stare into the darkness. Rearrange your thoughts, reopen your mind, fall in the black hole of imagination. You are in a kingdom where you are the king/queen. In this parallel universe where your word is a command. Search for your passion, find your purpose, get motivated, be enlightened. And do not open your eyes until you catch your brilliant idea by the tail.

I was there and I kid you not I am mesmerized. I got my idea - a quest to bring procrastination down to zero around the world. It is a project that I work on every day and I will not give up until it helps at least one more person other than myself. It worked for me, and I cannot wait to share it with all of you. Soon.

Now, can I ask you for a little favor?
Inhale. Exhale. Close your eyes … just do it!

How was it? What did you see? Share it with me and the world.

ф.

From A to B, and then ∞ or how imagination works

timelysis — Thu, 17 Nov 2011 14:10:00 -0500

Picture a coordinate system. What are A and B? They are points, correct. So let A be at (1,1) and B at (11,11). When connected A and B form a line, which we might say has a beginning and an end. Since we see the line’s A and B, we can perceive it, understand it and measure it. It has a slope of 1 and length of 10√2. It’s finite. Now let’s introduce ∞ to the game a.k.a. infinity, in Latin infinitas which means unboundedness. Imagine, where do we place ∞ on the coordinate system? “How do we place the unbounded on the bounded coordinate system” you might ask. That’s unquestionably impossible, it would violate the laws of mathematics and physics. In the Ancient World people were imagining and depicting infinity with the ouroboros snake. Intriguing.

Picture a sunny deserted island and the never-ending blue sky above it. What are A and B? A is you, B is the horizon. The distance between your eyes and the horizon is actually finite, it’s √(your height in cm / 6,752) in km. We can perceive, understand and measure that. For me it’s a bit over 5,30km. But what is out there after those 5 kilometers? How do we see the unseen? Does not compute. Seeing over the curve of Earth would violate the laws of physics - matter, it’s volume and mass. Around the year 1000 a Norse explorer, Leif Ericson, was the first to set foot in North America. He imagined that there is land beyond the horizon. Astonishing.

Picture yourself in bed, it’s warm and cozy. What are A and B? A is now - you are still awake, B is the point you start dreaming. The time between A and B can be measured, it’s variable but finite number. How? I’ll explain. There are 4 different stages of sleep - transition to sleep, light sleep, deep sleep and REM (Rapid Eye Movement) sleep, and the 4 of them together form a sleep cycle. On average a sleep cycle continues for about 90 minutes. Approximately 70 minutes after you fall asleep you get into the first REM stage, this stage renews the mind and makes your dreams lucid. But what happens when we start dreaming? Blank. Not only we cannot foresee our dreams, but also we talk about them as “what a crazy dream” on the next day. In Ancient Greece and Egypt dreams were portrayed as a divine message, one which was then deciphered by a dream interpreter in order to establish a connection with the supernatural. Fascinating.

We can conclude that getting from A to B is relatively straightforward, using our knowledge we can make our way through. However, from B onwards we need something more to understand the mysteries. A wise man once said “Logic will get you from A to B. Imagination will take you anywhere.” That’s it. That’s our unknown, our x - imagination. The questions is how do we turn it on? How do we make it work its magic? And the answer is we can - you can, I can, that other guy can do it as well. Not only we can, we already do. Maybe we don’t realize it, but we have all woken up from a vivid dream and thought to ourselves - “Wow, that was insane. Thanks. More please.” Dreams are imagination, they are hardly explainable as it is ∞, unpredictable as it is the space beyond the horizon. Imagination is infinite and it goes beyond what we see and know.

We do imagine. Unfortunately, most of the times we forget. But can we do it all the time? Can we do it consciously? We need to think of the conditions before starting to dream. We are relaxed, there are no limits to our thoughts - they flow freely. For example: “You are making your way through a jungle, when a polar bear and a penguin walk in, ask you for a lighter and directions to the nearest bar.” There is no one to tell us that’s impossible, no one to say “Moron, penguins live in the South hemisphere while polar bears live in the North hemisphere” or “Jeez, penguins in the jungle, are you kidding me?!” You might say it can be socially awkward. I say no.

It was insane to think life expectancy on average will be 70 years a millennia ago. It was socially awkward to say the Earth is not flat 5 centuries ago. It was crazy to think a man can go in outer space. What was “black magic” yesterday, it’s reality today all thanks to imagination. We are 7 billion on Earth today, if we all imagine where can we be tomorrow? Imagination means moving forward, moving beyond B. So I plead … please let’s talk more penguins.

Notes:

1. Points A and B are on the line of the function f(x) = x. While I was writing the time was f(x) hours and the-angle-between-f(x)-and-Oy minutes.
1. How far away are you from the horizon?
1. The formula for optimal sleep: (# of hours) modulus 1.5 = 0 where # of hours >= 6 and <= 9. Basically 6, 7.5 or 9, everything more than 9 increases the chance of heart attack. Why 1.5? Because a sleep cycle continues 90 minutes on average (hour and a half). You feel better when you wake up in the end of a cycle.
1. The wise man is Albert Einstein.
1. Around year 1000 life expectancy was ~30 years and population ~300 million, today life expectancy is ~70 years and population ~7 billion.
1. Even in the Bible we can find references to imagination: Genesis 11:6 - And the Lord said, behold, the people is one, and they have all one language; and this they began to do: and now nothing will be restrained from them, which they have imagined to do.
1. Imagination, motherfucker, do you speak it?

1 + 1 = 1 or how you can get anywhere using your imagination!

timelysis — Fri, 11 Nov 2011 06:11:00 -0500

And let’s countdown together! 1… 1… 1… Go! It’s currently 11th of November 2011, 11:11am UTC or if we have to present it funkier 11-11-11 11:11:11. So what does this mean to you? And what does this mean to me? Does it mean anything at all? Yes and no.

It’s just another tick-tock of the clock, or total of 24 tick-tock’s around the globe: 1 for each timezone. You might be lucky and hear two of those tick-tock’s if you are traveling to the West faster than the Earth’s rotation speed (only possible with Concorde commercial flights which don’t exist anymore) , or traveling to the East through the International Date Line. But as far as I know there is no 11-11-11 11:11:11 Tick-Tock-er Award, you can’t get rich and famous. Unless maybe you manage to hear it three times, then you might get a Nobel Prize for it. And yes, that’s not valid for people in orbit and pilots in fighter aircrafts, that’s cheating. Unquestionably it’s fun to think about it, but other than that this phenomenon has not actual purpose.

You probably see it coming right? I hope you see it already, if not bear with me.

Someone told me a while ago, there is no right or wrong, good or bad, purposeful or purposeless, it all depends on the angle you are looking at it. Let’s do a rotation transformation together … say… with angle of rotation 111 degrees, direction clockwise. Do you see it now? How do you feel? It’s good, it has purpose, it makes me smile. Smile along.

So what is it? What do we have in front of us? A beginning.

A beginning of an unwinding path that leads to the new purpose - put a tock to procrastination and a tick to imagination. 1 Universe, 1 Earth, 1 you and 1 me all fighting 1 evil. We are all 1, and in this 1 we are many. 1 + 1 = 1.

1 tiny step onto this path by 1 of you out there might cause 1 big difference. 11-11-11 11:11:11 is gone in the blink of an eye, but imagination will last forever.

P.S.
1. Follow/subscribe/friend/add/stalk me, there is more to come.
1. I’m developing something under my sleeve that might as well aid you fight procrastination, it helped me.
1. Imagine.