In Japan, and a little session on Web Storytelling (Articles that I liked: July 2015)


I have been blessed to meet so many nice, talented, and driven people in my life, and one thing led to another and I will be talking about how Tech and Design can shape future of web storytelling next week, August 10, 2015 in Tokyo Shibuya’s Loftwork.

This is an amazing opportunity. It has getting me think a lot about what I do (I am still trying to figure out exactly what I do myself) and why I love some aspect of what I do so much, with passion. I think it boils down to the fact that I get chance to meet and collaborate with so many talented and smart people.

My family and I got here this weekend and it is HOT.

Anyway, if you are by any chance living in Japan and see this before next Monday, love to see you. Come join us!

Here is the copy of session description in Japanese.

Continue reading…

ECMAScript 6 (Articles that I liked: June 2015)

A colleague of mine and I have been discussing about future of javascript and our code base at Harvard Business Review’s website, and I am sold on the idea of going with ES6. I love the idea of “One Javascript” and by using tools like webpack and babel Javascript Compiler, you can actually start using the benefit of ES6 today, in every browser (obviously not every feature, but still). I love that they included important stuff like native unicode support in the spec. Please count me in.

Speaking of unicode, I also love the idea of Google Noto Fonts. Love the name. The white block that you see when unicode character is nicknamed “Tofu” and by using this fonts, cached around the world near you, there will be no-tofu. Love it.

Continue reading…

Starting a local simple http server (and Articles that I liked: May 2015)

Github pages are amazing. Best thing ever. Well, second best thing after git, anyway.

More and more javascript work that I do (such as creating slide deck using remark, for example), less and less I need heavy dependency on servers, but I just need to serve up markup and javascript. In the past I have used Mac installed Apache or MAMP type solution, but that is even much more than I need. Then I came across Python 2’s SimpleHTTPServer. Mac OS (at least ones on my machines) comes with it.

All you need to do is:

python -m SimpleHTTPServer 8088

then you can access http://localhost:8088. Nice.

I am constantly running vagrant machines, so usually port 8080 is taken. Being able to specify port like that is actually really cool.

Also, I’ve been posting links that I liked at my tumblr blog. Here are few weeks worth of links:

Continue reading…

OpenVis Conf 2015 (and articles that I liked: April 2015)


Bocoup’s OpenVis conference is by far my favorite conference of all time. I was only able to go one day in 2014, but I participated fully in 2013 and 2015, and I’ve loved every session. Before I forget (which I did last year…) I am going to write down/copy over my notes here.

Languages and libraries to checkout:

Ideas, cool presentations, quotes etc:

  • “Treat user input as first-class streaming data” – Jeffrey Heer
  • “Scrollytelling” “Web is a story telling medium” – Jim Vallandingham (and here is how, and thought on that by Mike Bostock)
  • “Editing is not simplifying, but clarifying.” – Nigel Holms on “Context”
  • “Million, billion and trillion is confusing. It should be mln, billion, trillllllllllion.” – Holms
  • “Getting your web development environment ready = Mise en place” – Alyson Hurt

This conference is awesome and looking forward to next years!
Continue reading…

Articles that I liked: March 2015

I’ve been posting links that I liked at my tumblr blog. Below are the month worth of links:

An excellent and brilliant “Quotes on Design,” a creation by Mr. Chris Coyer:

… Loading quotes from “Quotes on Design” …

And other links that caught my eye.
Continue reading…

Updating old php scripts and learning PDO (PHP Data Object).

I started making websites in 1998. Gosh, in the internet years, that’s a forever ago. Remember Perl CGI and its cgi-bin folders? I have also written a lot of website using php along the way, and LAMP stack was sort of my thing for a while. But since I started to focus every efforts on front-end stuff, it have been a while since I looked at simple backends. Some of the sites that I created long ago desparaetly needs some updates. I have, in the past, thought or looked into converting sites to ruby on rails at one point, then looked into python, then thought hard about switching to some kind of static site generator engines (like jekyll or, and finally more recently, thought about converting them to MEAN stack. But, really, who has time for that? Lately, I am thinking about just upping my php level and “patcing” it right in php5. Or at least keep the database structure and convert the backends to be more like API or services, still using php.

This weekend, I have been sort of playing with one of my old project: Softball Stats, written by David Carlo. It is an awesome little project.

“SoftballStats is a collection of PHP4 scripts and a MySQL database that track the stats, games, players, and every play made in multiple softball/baseball seasons. SoftballStats also compiles statistics for each player.”

I could use this on my work co-ed softball team, or also use it for my son’s summer league. I started updating it on my github.

Found this excellent website:

Here ares some notes that I kept while updating some of scripts.

First thing is the way I have been connecting to the database.

I was doing this:

$link = mysql_connect("", "user", "password");
$result = mysql_query("SELECT * FROM player WHERE SeasonID = 2014");
$row = mysql_fetch_assoc($result);
echo $row['name'];

New (Well, new to me.) way to do this is using PHP Data Object

$pdo = new PDO(';dbname=database', 'user', 'password');
$result = $pdo->query("SELECT * FROM player WHERE SeasonID = 2014");
$row = $result->fetch(PDO::FETCH_ASSOC);
echo $row['name'];

Also, way I was doing mysql_num_rows($result) will now have to changed to

As with mysql_data_seek($result),

Simple enough? I was cruising along, then I encounter the error. Or more like, NOTHING. By default, error is a blank screen, as it turns out.

My php.ini was in /Applications/MAMP/bin/php/php5.5.10/conf/php.ini (Note that it is not MAMP/conf as you expect, it’s in /bin. you can find this infor using . and display_errors was in line 277.

Actually, you need to put those two lines in the php file:
ini_set('display_errors', '1');

Got some things fixed, but broke more things. Ugh. Still working on it. Ah, time. I wish I had more.
Continue reading…

Conflict resolution on git


Git is just amazing. Learning command line git is one of the best thing that has happen to me. I’ve been lucky to work with some talented guys from bocoup, and I’ve gotten to know quite a bit about it lately and just wanted to document things that I do when I encounter that dreaded (well, not THAT bad) “We can’t automatically merge this pull request.” message.

Also if you have not seen this Cheat Sheet do yourself a favor and take a look.

So, pull request can’t be merged. It’s because what you worked on (likely your branch) have some conflicts with what you are trying to merge, likely origin/master. this stack overflow answer was useful in understanding what I am doing.

My instinct was to git pull. But that is a bad idea (Quick! git reset origin/your-working-branch --hard to get what you have pushed to github!). When you encounter “can’t merge” message, git’s help suggest this:

Step 1: From your project repository, bring in the changes and test.

git fetch origin
git checkout -b your-working-branch origin/your-working-branch
git merge master

fetch then merge is much better than pull. Pull does too much under the hood (as my co-worker Tim says “too much magic”). But still, chance is that you may end up with WAAAAY too many conflicts and therefore very hard to resolve them. Perhaps there is even better idea:

git fetch --all (You may not have to do –all, but I am paranoid and this is my feels safe blanket, if you know what I mean. It’ll ensure you have the latest remotes.)
then git rebase origin/master

Ah, rebase. I had sort of hard time understanding concept of rebase, but perhaps git’s message explained it to me the best. It says “First, rewinding head to replay your work on top of it…” All your commits are “replayed” after changes that are already in master. People used words like “flattening the history” when explaining rebase, which was confusing to me. but “replay your work on top” explanation worked best for me.

When you rebase, or “replay your work on top,” you resolve conflict one by one, as it encounters conflict.

You may get a message like this:

Applying: My commit 1.
Using index info to reconstruct a base tree...
M	source/js/file.js
M	source/js/folder/file.js
Falling back to patching base and 3-way merge...
Auto-merging source/js/folder/file.js
CONFLICT (content): Merge conflict in source/js/folder/file.js
Auto-merging source/js/file.js
CONFLICT (content): Merge conflict in source/js/file.js
Failed to merge in the changes.
Patch failed at 0002 My commit 1.

When you have resolved this problem, run "git rebase --continue".
If you prefer to skip this patch, run "git rebase --skip" instead.
To check out the original branch and stop rebasing, run "git rebase --abort".

Nice to have that –abort option. Unlike merge or pull, you can just forget about the whole thing. Continue till you are done.

But because rebase changes the history, you may get message like this.

Your branch and 'origin/your-working-branch' have diverged,
and have 95 and 2 different commits each, respectively.
 (use "git pull" to merge the remote branch into yours)

If you push force that message will go away
git push origin your-working-branch --force

$ git push origin your-working-branch -f
Counting objects: 51, done.
Delta compression using up to 8 threads.
Compressing objects: 100% (12/12), done.
Writing objects: 100% (13/13), 1.56 KiB | 0 bytes/s, done.
Total 13 (delta 8), reused 0 (delta 0)
 + 368da98...4266772 your-working-branch -> your-working-branch (forced update)

When you push force you’ll see the previous sha and the new one, so if you mess up and want to revert, simply reset hard on that previous sha and push force again
they look like previous_sha…new_sha

so in this case
git reset 368da98 --hard

In case of “Oh Crap, I made a spelling mistake and I just pushed that.”

You could git reset HEAD~1 -- soft to undo last commit and re do it, OR,
change the file, then git commit --amend
Either way, since you already “Pushed” you need to push –force to make it work.

If your working directory is dirty (meaning you have conflicts) and you don’t have any work you need to save:

# Cleans the working directory.
git reset HEAD –hard

# Reset the branch to the remote (in this case your-working-branch.
git reset origin/your-working-branch –hard

Continue reading…

Open Vis Conf 2014 was amazing! Love that conference.

Good people at Bocoup puts out this kick-butt conference in Boston every year. I am lucky to have participated in both of those years.


I only was able to go to one day of it this year, but it was very interesting and inspiring as last years. I whole heartedly agree with Mike Bostock’s sentiment of “design is hard” and it was helpful for me to see his breakdown of why. Neat to know about “Fitts’s Law.” NYTimes git tool called “Preview” which takes screenshot of git commits are pretty cool. Thoughts on explanatory graphic vs exploratory graphic. He says don’t be afraid to fail. Try bad idea deliberator to evaluate it. He says “Javascript” is “One True Language.” Sam Selikoff’s js framework talk was very interesting and I need/can’t wait to see the code. Kennedy Eliot of WaPo and Jen Christiansen’s talk was very close to my field. Print publication with online challenges. Finding “Narrative” in data. Story telling is important. All good design/presentation is a god story. ICanHaz.js sounds really interesting. I need to check it out. All the other talks, I have notes to go over, but was great. Nice to see all the folks too. Those are my people. Very inspiring.

I’ve been posting links that I liked at Posterous (RIP) and then my tumblr blog. Here are the week worth of Articles that I liked: Friday, May 9, 2014: