ide - script - Herramientas para apoyar la codificación en vivo como en la charla "Inventar en el principio" de Bret Victor
selenium script (8)
He visto un video ya conocido en el que Bret Victor, ex diseñador de Apple UI, muestra sorprendentes demos con actualizaciones inmediatas del código en ejecución después de cambiar literalmente un símbolo en el código fuente.
Para aclarar mi pregunta a aquellos que no han visto o no tienen tiempo para mirar el video: quiero usar una herramienta como esa para escribir mi propio software. ¿Está disponible la herramienta que estaba demostrando, o hay otras herramientas similares?
No importa qué idiomas / entornos, solo quiero que se ejecute mi código y luego cambiar una línea en el código fuente y ver inmediatamente los resultados actualizados sin reiniciarlo.
El video también está disponible en YouTube , y los puntos clave son:
Quien lo hace
Encontrará muchas cosas interesantes en las comunidades de React y ELM, y en las comunidades de programación funcional frontend en general.
Algunas plataformas recientes de full-stack que de alguna manera están tratando de proporcionar un entorno de desarrollo de este tipo son:
Eve :
Una startup de Andreessen Horowitz / Y-Combinator, financiada por 2.3 millones, de Chris Granger, un programador Clojure influyente que ya construyó LightTables.
Tecnologías : Rust (back-end), TypeScript (frontend) con una implementación casera de los conceptos de React (lo que ellos llaman "microReact")
Unison :
No es una empresa (¿todavía?) Pero cuenta con el apoyo de una campaña de Patreon, de Paul Chiusano (autor del famoso libro "FP in Scala").
Tecnologías : Haskell (backend), ELM (frontend).
Nota : puede ver que los tipos detrás de estas herramientas son programadores funcionales con experiencia. Verifique la sección "Cómo funciona".
Cómo funciona -> programación funcional
Los programas tienen estado.
¿Por qué Bret Victor pudo hacer ese video?
Porque:
- su arquitectura es explícita sobre las mutaciones del estado
- él usa pureza funcional
- él registra hechos históricos como estado, en lugar del estado actual de UI
Una herramienta inspirada en esta charla es el lenguaje ELM.
ELM declara que :
Entonces, en la raíz del depurador está el diseño de Elm en sí mismo. Si no comienza con las opciones de diseño correctas en el nivel de idioma, la creación de un depurador de viaje en el tiempo se vuelve extremadamente complejo. Incluso los idiomas que cumplen parcialmente los requisitos de diseño necesarios tendrán serios desafíos.
Entonces, lo que realmente tiene que entender es que no es la tecnología lo que es interesante, sino la arquitectura de software subyacente . Una vez que tenga la arquitectura, no es tan difícil agregar tales funciones de depuración.
Muchos en las comunidades de ReactJS / Flux han demostrado que podemos lograr realmente grandes cosas con este tipo de arquitectura. David Nolen de Om ''s ClojureScript es probablemente el disparador, y Dan Abramov ha demostrado recientemente que podemos lograr cosas muy similares que se comparan con la depuración de Bret Victor .
Yo mismo he estado experimentando con la grabación de videos de sesiones de usuarios en JSON , que también es una característica que se aprovecha de este tipo de arquitectura.
Entonces, debes entender que lo que él logra no se logra mediante trucos de código inteligentes o un súper lenguaje, sino patrones arquitectónicos realmente buenos.
Estos patrones no son ni siquiera nuevos, los creadores de bases de datos y algunos desarrolladores de back-end los utilizan durante mucho tiempo bajo diferentes nombres, incluidos el comando / evento, el diario ... Si desea una introducción, el blog Confluent.IO es muy fuente pedagógica .
El problema no es ni siquiera acerca de volver a cargar el código, todo se trata de qué hacer con el estado después de que se haya vuelto a cargar el código.
Lo que realmente necesita comprender es que no hay una respuesta única a esa pregunta: todo depende de lo que quiera lograr.
Por ejemplo, en el ejemplo de Bret Victor con Mario, cuando modifica algún parámetro como la gravedad, puedes ver que puede afectar tanto el pasado (lo que ha grabado) como el futuro (las acciones que hará después de que el código cambie). Esto significa que la intención del usuario se reinterpreta en un contexto diferente, produciendo un nuevo historial de hechos (a menudo llamado origen de comandos).
Si bien esto es realmente interesante para los videojuegos como lo ha demostrado, esto es absolutamente inútil para muchas otras aplicaciones. Tomemos el ejemplo de una aplicación de responsabilidad, donde el% de impuestos puede aumentar o disminuir cada año. ¿De verdad crees que modificar el% de impuestos del año actual debería tener algún efecto en el balance de hace 10 años? Obviamente no, pero aún puede tener efectos en el año actual.
También Mario coloca la bandeja al ajustar el parámetro de salto, la herramienta no puede saber por sí misma que tiene que mostrarla para el elemento Mario. Tienes que ser explícito al respecto, de lo contrario podría hacer lo mismo con las nubes o la tortuga. ¿Y tiene sentido hacer lo mismo con la aplicación de rendición de cuentas?
Lo que quiero decir aquí es que esta es una demo genial, que ha sido bien producida. No se puede obtener un entorno de desarrollo similar que funcione tan bien fuera de la caja. Pero puedes aprender los patrones arquitectónicos que permiten hacerlo fácilmente, y usar herramientas como ELM / Om / Redux / Flux / ReactJS (¡y algunas Haskell / Scala / Erlang también pueden ser útiles!), Que te ayudarán enormemente a implementarlas correctamente y le proporcione lo más que pueda para la recarga en caliente.
Chris Granger está construyendo algo llamado Mesa de luz que parece un movimiento prometedor en esta dirección. Inicialmente solo es compatible con Clojure, pero promete apoyar otros idiomas en el futuro.
Code orchestra guys lanzó recientemente su herramienta de codificación en vivo denominada COLT. Es compatible con JavaScript y ActionScript y se ve muy prometedor. Muy recomendado para probarlo.
Creé un complemento de Eclipse llamado Live Coding en Python que cubre dos de las tres características que preguntaste. Al instante actualiza el resultado de un algoritmo de gráficos de tortuga mientras escribe el código.
También muestra el estado de las variables locales al lado de cada asignación. Aquí hay una pantalla de ejemplo de un algoritmo de búsqueda binario:
def search(n, a): | n = 3 a = [1, 2, 4]
low = 0 | low = 0
high = len(a) - 1 | high = 2
while low <= high: | |
mid = (low + high) / 2 | mid = 1 | mid = 2
v = a[mid] | v = 2 | v = 4
if n == v: | |
return mid | |
if n < v: | |
high = mid - 1 | | high = 1
else: | |
low = mid + 1 | low = 2 |
return -1 | return -1
|
i = search(3, [1, 2, 4]) | i = -1
Creo que los siguientes permiten cambiar una línea en la fuente (y ver los efectos inmediatos):
- Codea Air Code : Código en su navegador (en Lua), vea la salida en un iPad conectado a wifi.
- Agua de Gabriel Florit. HTML, CSS, se ejecuta en un navegador.
- Live Scratchpad por Neonux. Extensión Mozilla.
- Swift Interactive Playgrounds: viene con Xcode 6, para la codificación en el lenguaje de programación Swift.
- JS Bin : HTML, CSS, Javascript, se ejecuta en un navegador.
- Tabla de luz : ejemplo en Youtube .
- Atom : con el complemento html de vista previa.
Nota: Tengo experiencia solo con 1, 5-7. Para muchos de estos, no creo que pueda colocar el cursor sobre una parte determinada del código y resaltar las partes relevantes de la imagen.
Editar: elementos añadidos no. 4 (2014.10.27), 5 (2014.10.31) y 6-7 (2015.03.12).
Edit 2 (2015.06.25): de http://sixrevisions.com/tools/code-demo-sites/ (la mayoría de estos son HTML / CSS / Javascript).
El cuaderno de IPython es un paso en esa dirección. Aunque está más orientado al Análisis Exploratorio Interactivo por problemas científicos, creo que es muy interactivo y divertido de desarrollar.
También descubrí Live Code. Después de algunos experimentos que encontré, no abarca todos los principios de la filosofía de Bret Victor. Tiene una sintaxis directa, pero la interfaz de usuario no facilita el desarrollo interactivo. Todavía tienen mucho camino por recorrer.
Luego también hay R. Desde los nuevos desarrollos con Shiny y Knitr se están produciendo algunas innovaciones interesantes que están en línea con la filosofía de Bret.
Hay COLT , una herramienta de codificación en vivo para Flash (ActionScript3). Permite actualizaciones de métodos, agregar nuevos campos / métodos / clases, actualizar activos incorporados, etc. en tiempo de ejecución mientras se preserva el estado de la aplicación, como en el video de Bret Victor. Hay algunos videos de demostración en acción, siendo this el más impresionante hasta el momento.
No te obliga a ningún IDE nuevo, es una herramienta separada que envía las actualizaciones incrementales a la aplicación en ejecución cuando presionas ''guardar'' en tu IDE.
También se anuncia compatibilidad con JavaScript.
Haskell para Mac puede tener una audiencia limitada ya que es (a) específica de la plataforma, como puede haber adivinado a partir del nombre, y (b) software comercial ($ 20 en la actualidad). Pero está muy explícitamente basado en las ideas de Brett Victor, como se discutió en una publicación anterior del blog .
Ciertamente merece ser agregado a cualquier lista exhaustiva de entornos de programación que implementen la "Programación Learnable".