Aubrey Portwood

WordPress — Stoicism — 🎾

Working on an HTML/Offline Version of Google’s Newly Open Sourced 20thingsilearned (20 Things I Learned about Browsers and the Web)

| Permalink

So today I checked out the newly open sourced 20thingsilearned, the code to 20 Things I I just wanted to give it a look over and see if I could get it into some kind of format that I could use to create my own. I checked out the svn (I even setup a virtual machine with Linux so that I could do the svn checkout; I will be posting the screencast later!), but it is powered by the Google App Engine. So, I hacked away this afternoon and have a semi-working offline-able copy of 20thingsilearned (the only problem, so far, is the very first page).

I am going to keep working on it and turning it into something non-App Engine powered (good ‘ol HTML, CSS, and JavaScript) so we can all play with it and do new things. I am going to, at some point (I mentioned I just started with svn) host this on Google Code, especially when I get it matured. But, since I’m not a selfish horder…

[adsense metakey=”ad1″]

Here ya go!

You can demo the latest code here.

[Enjifi – June 29th 2011 – 20thingsilearned – Offline Version] (zip)

Keep up to date on this by following 20thingsilearned.

6 thoughts on “Working on an HTML/Offline Version of Google’s Newly Open Sourced 20thingsilearned (20 Things I Learned about Browsers and the Web)

  • Kenneth Plasa 

    You did a very nice job so far. Because I’d like to use that as a basic design for a website of a friend, who’s a songwriter, and her band, I’d really appreciate it, if you could solve that first (and last) page problem. I’ve tried to capture that website by “WinHTTrack” and some other similar programmes, but they only downloaded and created a basic version without those nice page flipping effects.

    Have a nice day,

  • aubrey 

    I did it using HTTrack, some view source, some browsing the open sourced code, so that’s about all I got out of it.

    I still am planning on following up on this code- if I can open source it (which is why I am holding off right now, to find out) then I will try. If anything, if I can’t get it to work…I’ll take it off! haha


  • Mike 

    Hey, thanks for this!

    I am having a couple of issues and was hoping you might help. I downloaded the source files but am having issues when I try to deploy on my own server. First page looks fine but when I try to click on any links they don’t load and I am getting javascript errors. When the page first loads i get a “TT is not defined” javascript error and when I click on any links I get additional “TT.pageflip.canvas” is null errors. Page content doesn’t change. Also, on page load I don’t have the page curl effect when I mouse over the right side of the page. Am I missing something? Any help would be much appreciated.


  • aubrey 

    I would just make sure you have all the files. I literally just uploaded what I had via ftp to somewhere and it worked (see demo). What browser are you using?

  • Mike 

    Thanks for your response. It’s odd, I download the source code and upload it to my server as is (as well as trying it locally) and it doesn’t work in Chrome or FF5.01 (both on the mac). Here is a link to the version I just uploaded if you want to take a look – This is from downloading the zip, unzipping, and uploading without touching anything.

  • aubrey 

    It appears that twentythings.min.js isn’t getting loaded. I will update the zip file (or, upload it to google code or something) and see if that fixes anything.

Leave a Comment

%d bloggers like this: