Teaching with CodeCosmos
Bob Ippolito
RuPy 2013
Budapest, Hungary
How did I get here?
- Using computers since before I could read
- Professionally since 1997
- Founded a company and had a successful exit
- Ended up with a normal job by accident
- Wasn't passionate about it
Finding a mission
- Wanted to do some social good
- Why not education?
- I know how to teach myself programming
- Can I teach others?
It does not suffice to hone your own intellect (that will join you in your grave), you must teach others how to hone theirs.
– E.W. Dijkstra (@DijkstraQuotes)
EG7
- Attended a wonderful conference with great people
- Met COO of The College Initiative
The College Initiative
- Non-profit assistance for High School students
- Summer program to help prepare for college
- Why not open their minds to programming?
Can I use a service?
- Khan Academy had no teaching tool
- Codeacademy had technical issues
- Could I make it work?
Planning to build
- I need it to work without internet
- I want it to also work online
- I don't want to install anything
- Can depend on Chrome
Language
- JavaScript is the only viable in-browser language
- Can't do better given only a few weeks
Canvas
- Strings aren't interesting to today's students
- Khan Academy uses Processing.js
- I knew others who have taught with Processing
- Couldn't find a similar library that did a better job
Editing
- I looked at Ace because Khan Academy uses it
- CodeMirror also had a lot of street cred (WebKit inspector)
- I found CodeMirror's examples to be easier to understand
- CodeMirror works great
Linting
- JavaScript syntax is hard, so linting is essential
- JSHint worked particularly well
- CodeMirror ships with an example
- I moved it to a Web Worker for performance reasons
JavaScript :(
- JavaScript sandboxing isn't a thing
- Web Workers can't talk to a canvas
- iframes don't execute concurrently
- How can I cheat?
Cheating
- Increment a counter for function calls and loop iterations
- If the counter gets too big, abort!
Rewriting JavaScript
- Parse with Esprima
- Transform with Estraverse (insert cheats)
- Write back out with Escodegen
- Eval directly, not in a Web Worker
var wtf = function (a, b, arr) {
arr.forEach(wtf);
};
wtf(null, null, [1]);'use strict';
var __f = __catchErrors(
function __userCode$1() {
var wtf = __catchErrors(
function wtf$1(a, b, arr) {
if (++__ctr >= __maxctr) {
__cont = false;
throw new Error('…');
}
arr.forEach(wtf);
});
wtf(null, null, [1]);
});
__f();Web App
- AngularJS
- Font.js
- jQuery
- JSZipTools
- Underscore
Persistence
- PouchDB
- CouchDB
- follow, request, node-static
Build tools
- Grunt
- Bower
CSS and Fonts
- Pure CSS
- Font Awesome
- Kontrapunkt Bold
- Source Code Pro
- Ubuntu Regular
Hosting v0
- My laptop
Hosting v1
- GitHub pages
- Iris Couch
- Nodejitsu
Hosting v2
- CouchDB + custom module
- No more node.js
Lee County Senior High
- No cell coverage
- No internet connectivity
- Wasn't quite prepared
- But I had local copies of what I needed
What's next?
- exercism.io
- More volunteering
- Keep looking for inspiration
- Any ideas? Would love to hear them
Thanks!
Slides |
|
Source |
|
GitHub |
|
bob@redivi.com |
|
@etrepum |