2012-06-04 15 views
14

He estado buscando. Esto es quizás más un matiz que nada. Cuando hago jQuery u otro trabajo de UI, me gusta ver mis cambios de inmediato. El puerto de visualización en vivo de Adobe Dreamweavers hace esto, no extremadamente bien, pero lo hace. Kompozer tiene un puerto de visualización, pero no es en vivo ni hay JS o acciones. ¿Alguien sabe de un IDE por ahí además de DW que tiene esta característica? Se prefiere Linux, pero me gustaría saber algo.IDE para HTML/CSS/Java Script w/Live View Port

Como nota de interés recientemente he descubierto Wakanda http://wakanda.org

+3

+1 para wakanda! –

+2

¿Has probado [Aptana Studio] (http://www.aptana.com/)? +1 para wakanda –

+0

Si usa Windows, [e-texteditor] (http://www.e-texteditor.com) es una buena opción. La vista en vivo muestra la página representada en IE. No es un IDE pero poderoso :) –

Respuesta

1

Stylizer es una buena aplicación para la edición de CSS en vivo.

2

Puede que no sea exactamente lo que está buscando (no es compatible con javascript), pero dabblet es una gran herramienta para escribir html + css y ver la vista previa en vivo en el navegador.

dabblet live editor

2

Recientemente he estado pegada amor por Sublime Text 2. Después de probar muchos de IDE que es la que más me impresiona.

Estaba viendo un tutorial de Paul Irish sobre flujos de trabajo de Desarrollo Web para 2013 (video solo parcialmente relevante), donde describe un complemento que usa para evitar tener que presionar F5 para actualizar el navegador. En cambio, se actualiza cada vez que guarda un archivo.

Sublime Text 2 ha ido creciendo en popularidad y tengo entendido que funcionará muy bien en Linux. El complemento se llama LiveReload ($ 10).

Requerirá investigación, pero probablemente valga la pena. Link

+0

Sublime es la mejor, más fácil de usar, ligera, bonita y útil ide para html developing – jscripter

2

Sé que esta publicación tiene más de un año de antigüedad, pero pensé que la echaría si estuviera interesado. Adobe está desarrollando un producto que puede adaptarse a lo que está buscando. Si tiene la nube creativa, hay una vista previa del programa. Se llama Código Edge en la nube creativa, pero también se está desarrollando como un editor de código autónomo autónomo, de fuente abierta e independiente de la plataforma. No estoy seguro de por qué, pero fuera de la nube creativa, se llama Brackets. No hace una vista en vivo en el programa en sí, pero abre automáticamente el documento en Chrome y se actualiza a medida que realiza cambios. Lo realmente interesante es que el programa en sí está escrito en html, css y JS, por lo que debería ser fácil personalizarlo a su gusto. Actualmente está en versión beta, y se puede descargar en

+0

Acabo de probar Edge Code, y estoy un poco sorprendido por la practicidad de sus funciones como Ctrl + E y abrir un editor de css o color rápido o insertar fuentes de adobe gratis – jscripter

1

Hice mi propio patio de juegos de codificación open source llamado kodeWeave (que guarda y recupera sus tejidos como Github Gist). Está disponible para Windows, Linux, Mac OS X, Android y en línea (también planeo liberarlo para iOS y Windows Phone también).

enter image description here enter image description here

Algunos otros campos de juego de codificación de buenas a prueba de audición son CodePen, CSSDeck, Plunker, JSBin, jsFiddle, Liveweave. También hay Brackets que es un proyecto de código abierto creado por Adobe (Básicamente es la versión de código abierto de Edge Code). Lo bueno de Brackets es que se ejecuta localmente desde su propio servidor en su dispositivo, por lo que si está utilizando una biblioteca como JSZip, funciona de inmediato.Además, cada vez que guarde un cambio realizado en un archivo en Brackets, su aplicación se volverá a cargar en el Depurador de Chrome (lanzado desde Brackets). La depuración es muy rápida y sencilla, sin mencionar que hay muchos complementos para aumentar la productividad. ¡Es realmente tremendo!

Brackets App

También existe la Cloud9IDE.

enter image description here

estoy seguro de que ya lo sabe, pero las herramientas de desarrollo de Chrome tiene esta capacidad también.

+0

Han pasado unos años desde que se hizo esta publicación, así que acabo de revisar y espero que su pregunta haya sido respondida. –