Tools to support live coding as in Bret Victor's “Inventing on Principle” talk

Question

I\'ve watched an already well known video where Bret Victor, former Apple UI designer shows amazing demos with immediate updates of running code after changing literally one

Answer 1

These days for frontend development a lot of the tools offer something called "hot-reloading", basically making your changes in code immediately visible in the browser/mobile emulator. This is independent of the IDE/editor.

Answer 2

I believe the following allow changing a line in source (and seeing the immediate effects):

1. Codea Air Code: Code on your browser (in Lua), see the output on a wifi-connected iPad.
2. Water by Gabriel Florit. HTML, CSS, runs in a browser.
3. Live Scratchpad by Neonux. Mozilla extension.
4. Swift Interactive Playgrounds: comes with Xcode 6, for coding in the Swift programming language.
5. JS Bin: HTML, CSS, Javascript, runs in a browser.
6. Light Table: example on Youtube.
7. Atom: with preview html plugin.

Note: I have experience only with 1, 5-7. For many of these, I don't think you can put your cursor on a certain part of the code and have the relevant portions of the image highlighted.

Edit: added items no. 4 (2014.10.27), 5 (2014.10.31), and 6-7 (2015.03.12).

Edit 2 (2015.06.25): from http://sixrevisions.com/tools/code-demo-sites/ (most of these are HTML/CSS/Javascript).

1. Codepen
2. Liveweave
3. dabblet
4. jsfiddle
5. kodtest
6. Plunker
7. CSSDeck
8. Reloado
9. ideone
10. JQ.VER.SION
11. SQL Fiddle

Answer 3

Chris Granger is building something called Light Table that looks like a promising move in this direction. Initially it only support Clojure, but he is promising to support other languages in the future.

• http://www.chris-granger.com/2012/04/12/light-table---a-new-ide-concept/
• http://app.kodowa.com/playground