211: TZ Discussion – Magic Dragon

Justin and Jason discuss Justin’s approach to developing HTML5 apps that feel truly native, how Titanium finally fixed the build bug for iOS6 devices, more on the Titanium license issue, the first paid job advertisement (Java API developer at Uber Media), the effect of moving Catalyst to a new space and the browser-based IDE that Jason is building for the class, setting up a Node.js application on AppFog, resolving payment issues on AnyFu and using PayPal as a payout option, how to determine if reality is merely a computer simulation, Jason’s iPad information workflow – Browser / HackerNode => Instapaper => Pinboard / Evernotewhy the first laptop had such a hard time catching on, the mysterious book Jason received in the mail (Axiomatic – Greg Egan), and some of their favorite movies.

  1. Stanislaw Pitucha says:

    Hi, maybe I can stop you from reinventing the wheel (IDE)
    It seems like what you’re building is a clone of a very secret project, well hidden by the Python community 😉 … the iPython notebook. The home site (http://ipython.org/ipython-doc/dev/interactive/htmlnotebook.html) is not going to tell you much about it, so either play around with it or have a look at videos like http://www.youtube.com/watch?v=HaS4NXxL5Qc and http://www.youtube.com/watch?v=2G5YTlheCbw (later part of the presentation)

    In short what you get is:
    – web-based editor for either code only, or “literate programming” environment – which means you can put blocks of markdown text (that get ignored during execution) in between blocks of code – may be useful for you to put additional instructions / description in them
    – running the code using the run button only – all blocks get evaluated and computed results of all steps are shown
    – no filesystem operations – everyone can see just named “notebooks” which are just json files on the drive, so you can share / copy some template for each student
    – graphics – although it’s mainly integrated with packages like pylab and scipy (maths oriented), you can create your own drawing context abstraction or load images if needed (but hey – graphs are cool too!)
    – the server itself is running in python so there are not many moving parts – server receives the code, executes it and sends back the result
    – you can evaluate everything, or one block at a time
    – exception handling is built-in in a pretty good way

    What you don’t get:
    – standard input – there’s just no interaction while the program is running as far as I can tell, but because you can have multiple code blocks you could simulate the input by having it in a different block at the top and providing your own “line reading” function for it

    For actually running the server, you can use another laptop – create a local network and start it up on your own machine, then point kids at your local address – no access to the internet needed. (just make sure it’s virtualised, in case one of the students decides to try if os.system(‘rm -rf /’) does something cool 😉 )

    It seems like what you’re trying to write on your own right now, so I hope it saves you some time. (and sanity once you get into the problem of sandboxing environments)

  2. Chris Bösing says:

    @Jason Do you use a framework for Node.js? If yes, which one do you use? Just started with Node.js and like express so far, but I would appreciate your opinion as an more experienced Node developer.

  3. Jason says:

    @Stanislaw Pitucha – Thanks so much for all the detailed info about iPython! I actually did take a look at iPython and it is very cool, but for my needs it lacks some of the critical features that I’m looking for like standard input, built-in graphics and a super simplified, kid-friendly UI. Plus, I have some other ideas for it once I get the basic IDE up and running.

    I realize that I may be reinventing the wheel to some degree, but everything I’ve looked at is at best a 70% solution and I really want a 100% percent solution. The good news is that it’s really not that big of a problem. Anyway, I’ve been stricken with the madness so I have to build it regardless, otherwise my head might explode. 😉

    But I do very much appreciate the suggestion.

  4. Jason says:

    @Chris Bösing – Most of the work I’ve done with Node has been with the Uber dispatching system, which wasn’t a web server per say. That said, I have played around with Express a little and from what I can tell it looks it can do the trick.

  5. Stanislaw Pitucha says:

    @Jason – Great. I was pretty sure you didn’t know about it since it was not mentioned on the show, but matched your description really well. But if it doesn’t match all requirements, good luck with your version 🙂 I’d really like to see the result – maybe it could be useful in other situations too.

  6. Aleksander says:

    re “too much inside baseball” on alphas in html:
    Are you kidding me?! This is a show for hackers! It’s supposed to be technical! 🙂

    Greg Egan is awesome. I especially liked “Diaspora”.

    If you want to see something really interesting, watch “The Man From Earth”. It doesn’t look like sci-fi – it’s present-day people just talking in a room – but it does take your mind for quite a trip.

    (Oh, and BTW, I think it’s Janet Napolitano, head of DHS, who famously doesn’t use e-mail… When it comes to SCOTUS, I’d assume hardly any of the Justices uses one.)

  7. Stanislaw Pitucha says:

    @Aleksander ++ for The man from Earth; it does have some interesting ideas.

    Actually, maybe movies with fewer locations and more talking are better in some ways? The man from Earth happens around one house. 12 angry men – one room. Hitchcock’s rear window – one flat. Cosmopolis – one limo. Cube – very limited in a way. All pretty good.
    (did I miss some other significant single-location productions?)

  8. Justin says:

    @Stanislaw Pitucha -Also Hulu’s Booth at the End is very thought provoking.

  9. Andrea says:

    @Jason – FYI, your site is redirecting to appFrog. I think Catalyst Crucible may be a good name for your app. Alliterations can be helpful in remembering items.

  10. flo says:

    why would you want to host the catalyst stuff on the web and get an extra wifi/tethering device? just take your laptop with you and start a vm that acts as a server for this. this will negate the need for constant connectivity.

  11. Jason says:

    @Andrea – Yeah, I’ve been struggling with how to get the DNS configuration working with AppFog. I’m going to try to get that sorted out today. But thanks for the heads-up.

  12. Jason says:

    @flo – If you mean install a VM on every kid’s laptop, then no thanks! 😉 Justin, CJ and I have discovered that installing and configuring software on 15 different laptops (and all while the kids are going crazy) is like the 7th circle of hell. 😉

    Anyway, I already went ahead and bought two of the Verizon Jetpack portable hotspots and they worked like a charm. Each can serve 10 devices and all in they only cost me ($170 + $40 / month), which is in the budget considering Catalyst is $40 / month per kid.

  13. Corey says:

    I built the mobile version of the birdy in a day, thanks to jQuery mobile. It’s great for quickly rolling a site over. But I did turn off the auto ajax loading for each page, cos I needed js to run on page load. I’m sure there’s a work around, but didn’t want to take the time. So I would agree that jQuery Mobile is a really quick option, if not the most robust for apps.

  14. You could use the postMessage function to communicate between the web worker and the main page script. There’s no need to be uploading things to a server.

  15. Andrea says:

    @Andrew Davey – Thanks for that post. I haven’t looked into all of the html5 goodies but now I know that I can use this functionality.

  16. Matt S says:

    Maybe I’m just not getting the architecture of the Catalyst IDE – but why couldn’t you just use javascript events to pass data between “standard in” and the interpreter? No need to block the “intrepreter” class, just listen for an event that is fired when the enter key is pressed on the terminal area.

    You could just use a “dumb” php server to do the file saving (or use localStorage for an offline version).

    If you guys liked Looper, you should check out Brick – same director (Rian Johnson) and lead actor (Joseph Gordon-Levitt). Another of my favorite “under-seen” movies is Inside Man, it’s about a bank robbery but very much a cerebral thriller with an excellent cast.

  17. flo says:


    no not really. i mean that you take your personal laptop (i assume theres no kid on that one) and fire up a server vm on it and then let the laptops connect via wifi to your local server. if you have software like connectify you wouldnt even need a wlan ap.

  18. Corey says:

    @justin – look at Notational Velocity – http://notational.net/ for note taking. You’ve got your system, but this seemed to try to solve the same problem. I’d be curious of your thoughts.

  19. Doug Martin says:

    Hey guys,

    You should checkout Cargo-Bot – it is a free iPad app written in Codea that I’m using with my daughters as an intro to programming (they are 5 and 7). It teaches a lot of cool concepts using a simple mechanism of dragging commands to write a program to move boxes around a screen.

    Here is the url:


  20. Mikael Green says:

    FINALLY someone who appreciates The Thomas Crown Affair (the remake, not the original). Love that movie! 😉

  21. Alfie John says:

    @Justin: Can we get an little update on your fasting experiment?

  22. Ignacio says:

    Hey Justin, regarding making apps feel native with css3+html5 etc. What are you using to do finger swiping, are you using i-scroll by the way? or is there something better that you can recommend.

  23. Lightbot is another good game about programming. It teaches recursion and functions really well. I hate puzzle problems in job interviews but I had game dev applicants play this and it made the interviews more interesting.


  24. Justin says:

    @Ignacio – I haven’t dealt with that problem yet, as soon as I do I will let you know!

  25. Great to hear someone bigging up Super Troopers! It didn’t get a lot of attention here in the UK, but I managed to drill it into a few of my friends with repeat viewings.

    Hoping they can do the original justice if they get round to the sequel they keep talking about.

    Want me to punch-a-size your face, for free?!

  26. Jason says:

    @Andrew Davey – The reason I’m pulling the scripts down from the server instead of passing them via the postMessage function is that the later option requires using eval, and based on my testing that approach would only catch “compile time” errors and not runtime errors. Now I’m not 100% certain of this because I haven’t had time to verify this since reading your comment, but I’m pretty sure that’s the case. But now you have me questioning my results, so maybe I’ll do some more testing. 😉 Either way, I appreciate the feedback.

  27. Jason says:

    @flo – That solution sounds pretty cool, and very economical. I wish I had known about that before buying the portable hotspots and signing the two-year ($20/mo) Verizon contracts. (sigh) Although, having access to the web will prove useful in the long run since I’m planning on making the Catalyst IDE a public web app, where kids can publish their code and share with one another.

  28. Jason says:

    @Doug Martin – Yep, I’ve been playing with Cargo Bot and it’s definitely helped to give me some ideas. While it’s a very well-done game and does a good job of teaching logical and procedural thinking, it doesn’t makes the connection to actual coding, which severely limits its utility for Catalyst.

  29. Jason says:

    @tusongtupa – Yep, Light Bot is interesting in the same way that Cargo Bot is (and likewise has given me a couple of ideas), but in my opinion it falls short for the same reason. If the goal is merely to expose kids to computer-like thinking, then these types of games are great, however, my goal is explicitly to teach these kids how to write real computer programs. If I’m unable to achieve that then in my eyes the experiment will have been a failure. The whole Catalyst effort just requires way too much time and energy to shoot for anything less. Plus, I think we can do it! 😉

  30. Jason, sorry I’m a bit behind on Techzing episodes and just listened to 209 where you mentioned issues with Python IDE and command line interpreter. Did you see http://repl.it/ ? There is also http://www.pythontutor.com/ that shows what happens when the code is executed.

  31. Jason says:

    @Michael Rakita – Yep, I’ve looked at both and both were interesting.

    I tried unsuccessfully to get a copy of repl.it up and running, but I ultimately figured out a way to do synchronous stdin on my own (by routing through a node.js server), and I integrated Python as well by hacking a copy of Skulpt.

    Python Tutor is really cool and ultimately I’d like to integrate something like that, but I need to get a few things in place first.

    I’m hoping to have the Catalyst IDE up and ready for public use within the next few weeks, at which point you guys can see what it is that I’m trying to do.

  32. Bret Vector has a fascinating essay entitled, ‘Learnable Programming’ which might help thinking about Catalyst. http://worrydream.com/LearnableProgramming/

  33. Jason says:

    @John Humphrey – Thanks! Yeah, I read it when it hit HN a month or so ago, and I agree that he made some very good points. My only complaint was that I think he could probably have made the same points with about 20% of the words he used. Man, it was like reading War and Peace! 😉