Busco editor web completo (código y diseño simultaneo).

Archivado
Por ahora voy usando editores webs, en el pc tengo gedit con plugins para algunas cosas (uso Ubuntu), ademas de tener instalado Brackets, Sublime Text y alguna cosilla mas para texto normal que no he usado siquiera.

La cosa es que lo único que quiero ahora es ver lo que escribo como queda en tiempo real, cosa para lo cual ahora uso las herramientas de desarrollador de Firefox, mediante el cual al momento de tocar algo de css ya estoy viendo los cambios.
Bluegriffon (sucesor de NVY y Zompozer) lo tengo instalado, pero ahora mismo solo quiero tocar codigo y ver su resultado mientras, cosa que incluso navegadores webs me permiten pero Bluegriffon me hace cambiar entre pestañas y... digo yo que habrá algo tan simple para poder mostrar ambos a la vez O.o. Por desgracia parece que es un addon de pago: http://www.bluegriffon.com/index.php?pages/ActiveView (y aun asi a simple vista me parece limitado para lo que necesito :/

De paso os presento muchas de las aplicaciones webs para estas tareas que he estado probando que a alguien les puede venir de maravilla :)
No serán los mejores pero si los que he podido probar en estas semanas, espero recomendaciones y sugerencias :)
Bueno, aluvión de enlaces, editores webs:
http://jsbin.com/welcome/1/edit <---Esto deja claro de un minimo que requiero.
https://koding.com/R/blackgem <---Este te deja una VM por SSH donde tienes hasta apt-get
http://www.editey.com/ <--- El que mas uso actualmente al tener sincronizado en la nube
http://jsfiddle.net/
Esos son los que mas me han llamado pero paso también el resto:
https://www.nitrous.io/join/6BeuRAuWbos
http://codepen.io/#
http://codepad.org/
http://htmledit.squarefree.com/
http://www.treeweb.es/WebCode
http://ajaxorg.github.com/ace/build/editor.html
http://www.coderun.com/ide/
http://www.ideone.com/
https://codio.com/#sourcecontrol
https://c9.io/
https://codenvy.com/
http://codev.it/
http://ace.c9.io/build/kitchen-sink.html
http://rendera.heroku.com/
http://www.htmlinstant.com/

Aunque sinceramente, de lejos a simple vista para probar sobre la marcha el propio Firefox me parece lo mejor tanto para retocar CSS en tiempo real como para ver la estructura de las webs mediante vista 3D. Por desgracia no guarda en la nube ni en tiempo real :S (si Chrome hiciera lo mismo sincronizando con google docs... ni os cuento XD).

Espero que los veteranos o alguien que este actualizado en estos temas me pueda poner al día ^^.
Eso lo hace Brackets según tengo entendido. Sincronizas el editor con el navegador y vas escribiendo código mientras ves los cambios en tiempo real.

Yo ando buscando desde hace tiempo un editor estilo Sublime pero libre y no hay manera. Pensé que Brackets podría ser una alternativa viable, pero no me gusta ir cambiando de editor cuando tengo que pasar del frontend al backend. Supongo que de momento seguiré apañándome con la versión de prueba de Sublime y Komodo Edit, aunque iré echando un vistazo al hilo por si alguien recomienda algo decente.
...
Chromium
https://developers.google.com/chrome-de ... #workspace
https://plus.google.com/+GoogleChromeDe ... 44qQuBKZeL
Parece ser que Chrome de por si tiene unas opciones mas avanzadas de las que pensaba preparado incluso para trabajar con archivos locales con autoguardado (o conectados a este mediante alguna carpeta ftp, samba, etc). Aunque no se muy buen como va XD.

Esto son las cosas que deben de saber los que llevan un tiempo con estas cosas XD.

Firefox
matuanime escribió:yo use un addon de firefox que se llama web-developer https://addons.mozilla.org/es/firefox/addon/web-developer/
lo he usado para editar una web de una amiga y darle una apariencia mas personalizada...
Es muy sencillo de usar, yo sin saber mucho de diseño web pude usarlo asique seguro te es útil y cumple lo que pides de diseño en tiempo real [oki]

Según veo algo mas espartana la interfaz que las herramientas de desarrollador que lleva Firefox integradas pero a cambio ofrece otras opciones como editar html, validar codigo y desactivar muchas cosas muy fácilmente. Por desgracia hay que andar guardando a mano tipo "Guardar como" por lo poco que he visto.

Sabia que los navegadores de hoy día tenían integradas muchas herramientas de edición y verificación de código pero lo que estoy descubriendo este mes es impresionante O.o
Todos fallan en algo que yo necesite como integración en gdrive y tal por desgracia XD (que si tuviera cliente para GNU/Linux oficial seguramente estaría mejor solventada :P)

Bracket
También he echado un vistazo a Bracket que es software libre de Adobe y según se dice tiene muy buenas opciones para HTML (y como tratar con subventanas de edición el codigo CSS asociado a este)

El único defecto ahora mismo es una visión algo turbia (con los themes oscuros y aumentar la fuente mucho mejor XD) y que el "desarrollo en vivo" no consigo que me lo haga tan vivo pues no veo como conseguir que me use también el css (que al abrir el directorio con el html y otros debería creo yo verlo bien claro vamos). Espero que eso sea algun fallo mio y que simplemente no sea tan intuitivo en esa parte.
Ademas de por defecto abre su visor con Google Chrome y no en Chromium (y no tengo formad e hacer ello fácilmente).

Otros recomiendan Sublime Text (privativo y se puede usar legalmente sin licencia, solo es algun anuncio y poco mas). Pero según he leído en comparativas, con las extensiones Bracket añade la mayoría de virtudes que ese lleva de serie.
Alecs7k escribió:Eso lo hace Brackets según tengo entendido. Sincronizas el editor con el navegador y vas escribiendo código mientras ves los cambios en tiempo real.

Yo ando buscando desde hace tiempo un editor estilo Sublime pero libre y no hay manera. Pensé que Brackets podría ser una alternativa viable, pero no me gusta ir cambiando de editor cuando tengo que pasar del frontend al backend. Supongo que de momento seguiré apañándome con la versión de prueba de Sublime y Komodo Edit, aunque iré echando un vistazo al hilo por si alguien recomienda algo decente.

Emacs. Libre y le da unas pocas patadas al Sublime Text en todo.
Chrome Dev tools.

Cuando acabo de hacer las cosas, Ctrl+A → fichero → Ctrl+v, guardar y ya. Pocas veces lo hago la verdad (sobretodo css).
En Firefox instala firebug si es que aún no lo tienes.
Brackets está bastante bien, aunque le faltan algunas herramientas que sí tienen otros, pero se puede ampliar a base de plugins.
El desarrollador en vivo, además de ver los cambios, te remarca la sección que vas a editar, por ejemplo, si a un <p> le has puesto una clase, y luego en el css editas esa clase, se remarcará qué parrafos afectará.
Yo use durante un tiempo Aptana Studio, no se si es lo que buscas, pero a mi me fue muy bien.

Link al programa: http://www.aptana.com/
No se si con "código" te refieres a html+css (maquetación sería una palabra mas correcta) o php, asp, js, etc.
Si solo necesitas html+css quiza amaya te sirva. Es el navegador/editor oficial de la w3c.
Yo te recomiendo que le eches otro vistazo a Brackets + Chromium. La edición en tiempo real funciona realmente bien, tanto para el contenido del documento HTML como para el CSS.
Es el que yo uso y es una gozada, pero claro, para gustos...
10 respuestas
Archivado
Volver a Software libre