3 Herramientas para para editar código en linea

Ultimamente en la web han surgido varios proyectos que nos permiten editar código en linea, si bien estas herramientas no son lo mejor para usar en producción, si que son muy buenos para mostrar código a una audiencia, probar algunas propiedades nuevas de HTML5 o CSS3, y también compartir código con los demás.

En su gran mayoría estas herramientas nos permiten jugar con código HTML, CSS y Javascript en una sola interfaz gráfica, permitiendo codificar y ver resultados en tiempo real.

Hoy daremos un breve repaso a 3 herramientas gratuitas para estos menesteres.

CSSIZER

cssizer

 

Comencemos con la más sencilla de las 3, Cssizer es una herramienta bastante sencilla que solo nos permite editar código CSS y HTML, si hablamos de sus opciones podríamos decir que son algo limitadas, ya que en el apartado HTML solo nos permite elegir el tipo de Doctype para nuestro documento HTML los cuales son:

  • HTML 5
  • HTML 4.01 Strict
  • HTML 4.01
  • XHTML 1.01 Strict
  • XHTML 1.01
  • XHTML 1.1

Cssizer nos permite compartir el código para que los demás puedan ver lo que se realizo, una de las cosas que más me gusta es que al momento que uno esta metiendo código instantáneamente se va mostrando el resultado, así que para cosas sencillas de HTML y CSS esta perfecto, a demás soporta HTML5 y CSS3.

Sitio Web de Cssizer

TINKERBIN

Toca el turno de una herramienta más completa que la anterior, basta ver su interfaz para darnos cuenta de que ya nos encontramos con una aplicación web mucho más completa, a diferencia de Cssizer donde solo podemos editar código HTML y CSS, en esta podemos usar también Javascript lo cual amplia su uso.

TINKERBIN

 

Por otro lado permite hacer uso de otras tecnologías para escribir código más rápido, HAML, Sass CSS , Less CoffeeScript, al igual que cssizer todo lo que realizamos en código se va mostrando al instante. Finalmente, también nos permite compartir el código con los demás. Sin duda una herramienta mas completa y funcional, ideal para mostrar cosas un tanto más elaboradas con CSS, HTML y Javascript.

Sitio web de Tinkerbin

JSFIDDLE

Llegamos a la ultima y para mi gusto la herramienta más completa de las 3, si bien en esencia es igual a Tinkerbin, ya en funcionamiento es mucho más completa ya que viene cargada de un sin fin de herramientas y ejemplos para empezar codear.

Como ya comente Jsfiddle tiene varios complementos interesantes si nos fijamos en el apartado Javascript nos encontraremos que podemos utilizar los Frameworks más populares: Jquery, Dojo, Prototype, YUI, por mencionar algunos.

JSFIDDLE

Sitio web de Jsfiddle

En el apartado Doctype podemos encontrar los diferentes Doctypes existentes, así como agregar algunos datos extras a nuestro documento HTML, como pueden ser el titulo y una breve descripción .

Y las opciones no se detienen, Jsfiddle también nos permite manejar eventos en Ajax, si esto no te es suficiente, la aplicación también cuenta con un apartado de ejemplos, en el podemos encontrar varios usos de los diferentes Frameworks javascript, como por ejemplo un proyecto totalmente funcional que hace uso del API de twitter y nos muestra una pila de Twitts.

Finalmente mencionar que al igual que las anteriores aquí también podemos compartir código. Pero a diferencia de los anteriores en los que solo dan un link al proyecto que queremos compartir, en Jsfiddle tambien se nos permite embeber nuestro código en nuestro sitio web lo cual puede ser un excelente recurso para los que se dedican a escribir tutoriales.

Deja un comentario

Tu dirección de correo electrónico no será publicada.

Responsable: Agustín Ruiz | Finalidad: Solo la de administrar estos comentarios | Legitimación: Tu consentimiento | Destinatario: Bajo ningn concepto comunicaremos tus datos a terceros | Derechos: Acceso, portabilidad, rectificado, supresión, limitación y olvido de tus datos | Plazo de conservación: Hasta que nos solicites que los eliminemos +info.