UI for developpers

Live coding

Without reload all code and replay all interactions and data inputs

What append for previous registered listeners, timeout|timeintervals, created objects, states, etc.

LOD

Global overview of code

Typography of code

Aka Code color sheme, coding font, typeface for developers

Color and fonts

Comment shouldn't use grey, but more visible color like red, because it's important.

Sticky blocks / smart folding (context, label, compound):

Use font size, style and weight to make differences and differents glyphs for better reading

Visual programming

dataflow / diagrammatic programming

node-based VPL

Rich shell

Aka CLUI (command line user interface), beagle (wrong keyword)

TermKit (node + webkit):

Hotwire Shell (python):

Other:

Shell autocompletion:

Notebook

Aka document code

  • Jupyter Notebook (IPython Notebook) .ipynb

  • Literate CoffeeScript .litcoffee .coffee.md

two-column Docco

Outline

Also called Document map.

Outline important elements like :

  • pages

  • sections and sub-sections

  • titles and sub-titles

  • Objects : packages, classes, methods, properties, etc.

Minimap

Graphical dezomed view of document like navigator panel in Photoshop

Code hightlighting

Aka syntax hightlighting

Code flow

Save all calls, contexts (like closures), parameters, time, duration

Code reload

  • live reloading: reload completely, loose the app state

  • hot reloading: reload partial parts, but keep current app state

Works easily for declarative code. It's more complicated for imperative code (or procedural code), where the code controle the app state with control flow

Declarative programming contrasts with imperative and procedural programming. Declarative programming is a non-imperative style of programming in which programs describe their desired results without explicitly listing commands or steps that must be performed

Breadcrumbs

Sticky context

Or sticky scope

See also breadcrumbs

Code vision

contextual information and navigation displayed at the top of classes, interfaces, and members

PreviousHuman InterfaceNextDevelopment

Last updated