texto:   A-   A+
eliax

JSFiddle, potente herramienta para Javascript y frameworks como JQuery y Prototype.js
eliax id: 8312 josé elías en dic 1, 2010 a las 01:57 PM (13:57 horas)
Si programas páginas web es muy posible que tengas que tocar a Javascript, y si trabajas con Javascript es muy posible que también utilices uno o más de sus populares frameworks (librerías de marcos de trabajo) como JQuery, Prototype.js, Processing.js, etc, así como quizás te mojes las manos un poco con técnicas de AJAX y HTML5.

Si caes en esa definición de programador, esta herramienta de hoy te caerá no solo como anillo al dedo, sino que será una de tus favoritas...

La herramienta se llama JSFiddle y es una herramienta 100% web, por lo que la utilizas dentro de tu navegador web sin instalar nada con solo visitar la página oficial de la herramienta, la cual a propósito ni siquiera requiere que te registres y es totalmente gratis. Simplemente visitas la página y empiezas a trabajar.

Lo que JSFiddle hace es extremadamente simple, pero altamente poderoso, en particular para los que programan estos frameworks con regularidad: JSFiddle te ofrece un ambiente de varias ventanas dentro de tu navegador web, en donde en una de ellas puedes escribir HTML, y en otra sentencias de Javascript (como por ejemplo, selectores de JQuery), y después en otra ventana ves el resultado.

Esto es algo que todos hacemos, pero con páginas de pruebas: Creamos una nueva página, la inicializamos con código, incluímos las librerías que vamos a utilizar, después escribimos el código, y después accedemos a los resultados por medio de nuestro propio servidor web o un servidor remoto (en cuyo caso, hay que también que subir el código primero antes de probarlo).

Con JSFiddle, todo eso desaparece y puedes ir directo al grano: Eliges la versión de la librería que deseas, copias un pedazo de HTML (o utilizas el que te ofrecen por defecto), lo modificas, y escribes tu Javascript para ver si hace lo que esperas que hagas, y listo. Varios minutos se reducen a segundos.

De paso, esta es una super-excelentísima herramienta para aprender no solo Javascript, sino que JQuery (mi librería favorita) y otros frameworks, pues en esencia lo que JSFiddle hace es proveerte de el equivalente a un linea de comando directa al corazón de Javascript.

Si quieren ver un ejemplo, hagan clic en este enlace que les presentará un trozo de código de HTML arriba, con un selector de JQuery abajo, y después hagan clic en el botón de arriba que dice "Run" y verán el resultado a la derecha (y en el panel de la izquierda notarán que pueden elegir entre otros frameworks y sus varias opciones.

Espero esto les sea tan útil como a mi :)

Página oficial de JSFiddle

Actualización: Otra excelente herramienta y que funciona muy similar a esta, pero para crear código CSS, es CSSDesk (gracias al lector angelbotto por recomendarla en los comentarios)

autor: josé elías

Comentarios

  • Gracias José! me gusta mucho jquery y lo uso para crear scripts en greasemonkey lo mas de potentes y muy livianos. Espero esta herramienta me sirva cuando estoy varado :P

  • Madre mia k inventazo, se acabo el volverse loko cambiando entre las ventanas css, funciones, pagina de pruebas...

    Felicidades por la pagina tio, por cierto no conoceras algun ide especifico para jquery??

  • es una magnifica herramienta al igual que http://www.cssdesk.com/ ;)

    • Gracias angelbotto, esta es otra excelente herramienta y acabo de actualizar la noticia (al final) para el conocimiento de todos :)

  • Se ve excelente !!! la probaré en mi empresa.

  • Genial.... Gracias por el dato

  • Offtopic: Pues yo también espero que Eliax haga un artículo con lo referente a Wikileaks, no sé bien de qué vaya la cosa, seguro Eliax nos lo cuenta con lujo de detalle.

  • no esta mal...aunque se hecha de menos que el editor al menos cierre los tags, como cualquier editor de texto de la actualidad hace...esta bien para toquetear y arreglar algunos codigos de manera casual...la tendre en cuenta...por cierto...la recomendacion del cssdsk tambien esta bastant bien...

  • muy util, gracias!

  • José, la palabra registración suena feísimo, es mejor "Registro" :)

  • Excelentes herramientas! Simplicidad y potencia combinadas en un solo entorno. :-)

  • Qué ventajas tiene este framework en comparación con otras librerías de JS mas completas, versátiles y robustas como ExtJS?

    http://www.sencha.com/products/js/

    ExtJS no solo maneja ventanas, sino se puede crear tablas dinámicas, hojas de calculo, graficas, pestañas... todo con tecnología AJAX y SOA, permitiendo la creación de un sistema operativo incrustado en el navegador.

    • Estás confundido, JSFiddle no es un framework, sino que una herramienta para experimentar con código dinámico dentro del mismo navegador web.

      Nota demás que ExtJS es un producto comercial que no puedes utilizar gratuitamente de forma legal (hasta donde tengo entendido). He aquí los precios: http://www.sencha.com/store/js/

      Y a propósito, vale el precio, pues es uno de los mejores frameworks comerciales que he visto.

Añadir Comentario

tu nombre
tu email
(opcional)
web personal
(opcional)
en respuesta a...
comentario de caracteres máximo
6 + 3 = requerido (control anti-SPAM)
 

"Muchas gracias por todo lo que has invertido, por todo lo que has hecho, por las discusiones que dejan un aprendizaje, muchas gracias por demostrar de que estas hecho, y mas aún sin importar la edad, sin importar la creencia y/o religión, ni el nivel socioeconómico, ni la nacionalidad, pensando en que todos los seres humanos somos similares y todos estamos conectados, tu legado hacia tus hijos de sangre, ha pasado hacia nosotros, que en muchas formas somos tus hijos intelectuales, pues hemos aprendido más de ti que de cualquier escuela, hemos aprendido a entender, a refutar y a meditar, hemos aprendido a ver y ser el mismo universo desde nuestro corazón, sin pedirnos nada a cambio, nos diste todo de ti, nos guiaste y mas importante intentaste entendernos y tolerarnos. Mi pregunta es ¿Quién hace esto por "desconocidos"?, sólo un padre, quien enseña sabiamente a sus hijos, quien aunque no los entienda en algunas ocasiones, está ahí para contestar a todas sus preguntas, quien con toda la paciencia intenta no faltar al respeto y enseñar el buen camino. Muchas gracias por todos estos años, muchas gracias por habernos enseñado como lo harías con tus hijos, muchas gracias por ayudarnos a nacer al conocimiento. Te mando mis mejores deseos y bendiciones para ti y toda tu familia. Muchas gracias por tu Legado."

por "IMEC_LUIS" en feb 10, 2014


en camino a la singularidad...

©2005-2015 josé c. elías
todos los derechos reservados
como compartir los artículos de eliax