¿Cuál es la mejor alternativa a la codificación? ¡El editor de código, por supuesto!
Los editores de código son la segunda razón más importante de las guerras de llama de los programadores (la primera es el formato de código).
Para algunos, Vim es el único editor sensato que se haya creado, mientras que para otros todo lo que no encaja en el mundo de Emacs que gira en forma de espiral, como el de Inception, solo es digno de burla. Si está buscando atención, todo lo que necesita hacer es ir a una comunidad de programación y comenzar un hilo como "Por qué creo que X (elija cualquier editor de código popular) apesta / es el mejor", tome un poco de cerveza y relájese.
Argumentos, contraargumentos e insultos seguirán entrando y saliendo de la discusión durante toda la noche, y pasarán muchos meses antes de que el veneno del hilo se enfríe.
La pregunta es: ¿por qué?
Claro, los seres humanos se las arreglan para hacer un gran problema con todo, pero creo que los editores de código son particulares cuando se trata de programadores. Un programador típico pasa casi todo su tiempo (más del 98%, si tuviera que apostar) en el editor de código de su elección. Conocen su camino alrededor del editor: sus fortalezas, debilidades, límites, peculiaridades y gemas ocultas.
Nada es más frustrante que tener que luchar con el editor cuando está escribiendo código (¡piense en lo molesto que es cuando tiene que enviar un correo electrónico extenso y urgente en un teclado nuevo!). Los editores de código reducen la fricción mental y le permiten ser más productivo, por eso son tan importantes y reciben tanta atención.
Entonces, ¿cuál es el mejor editor de código?
Honestamente, ¡ni siquiera me atreveré a ir allí! 😀 😀
Sin embargo, si te gusta el desarrollo web, quiero que pienses en una alternativa: editores de código en línea! También puede llamarlos editores de código basados en la nube.
No confunda el editor de código con un entorno de desarrollo integrado (IDE). Ambos son dos cosas diferentes y, como desarrollador, debe estar familiarizado con estos IDE multilingüe.
En pocas palabras, estos son editores que residen completamente en un servidor remoto y son accesibles a través del navegador.
Suena raro, ¿verdad?
Yo también lo sentí cuando los encontré hace 3-4 años. ¿Por qué demonios alguien querría entregar todo a un estúpido navegador?
¿Puede incluso competir con un editor de código instalado de forma nativa?
Resulta que en la mayoría de los casos, y especialmente para el desarrollo web, la respuesta es sí. Ahora, aunque no he adoptado a los editores en línea como mi medio principal, me encuentro usándolos cada vez más en escenarios específicos.
Antes de sumergirnos en los editores de código que se pueden usar, hagamos una pausa y pensemos en cuándo pueden tener sentido los editores de código en línea.
Configuración cero
No sé ustedes, pero configurar mi editor favorito a mi gusto en un nuevo sistema no es algo que espero con ansias. Complementos, temas, fuentes, accesos directos, fragmentos, configuraciones. . . Hay una lista interminable de cosas que deben equilibrarse antes de que todo se vuelva utilizable. Es fácil pasar por alto algo, solo para molestarse más adelante cuando se interrumpe su flujo de trabajo.
Por el contrario, no hay nada que ver con un editor en línea una vez que finaliza la primera configuración. Compilaciones oficiales, actualizaciones, compilaciones nocturnas, plataformas compatibles, arquitectura del sistema, sincronización de FTP, Tuberías de CI / CD - ¡nada de eso importa mientras tengas un navegador!
Colaboración
La mayoría de las veces, es necesario colaborar con otros desarrolladores al resolver problemas o depurar algo.
El editor de código tradicional no está diseñado para esto: no hay posibilidad de editar, comentar o resaltar código simultáneamente, y es un desafío agregar soporte para él.
Seguridad de los datos
Ahora, es un hecho que ningún proyecto hoy en día carece de control de versiones, lo que significa que existe una copia del código en el repositorio en todo momento. Dicho esto, hay ocasiones en las que el control de versiones no es suficiente:
- Olvidas enviar confirmaciones recién creadas y tu computadora portátil se incendia.
- Tiene otros archivos importantes y volcados de datos con los que interactúa su código, aunque estos no son parte de la aplicación en vivo. ¿Qué les sucede si su computadora portátil se incendia?
(Está bien, parece que estoy obsesionado con los cuadernos en llamas, pero entiendes el punto, ¿verdad?)
Hacer cumplir la disciplina
Esto también podría discutirse en el tribunal de derechos de los desarrolladores (si tal cosa existe), pero la verdad es que los desarrolladores rara vez sacrifican sus caprichos por el bien común.
Por ejemplo, un entusiasta incondicional de Sublime Text siempre aceptará por completo a cualquiera de los excelentes editores de JetBrains y encontrará todas las oportunidades para señalar su naturaleza ávida de memoria y su rendimiento más lento.
Lo mismo ocurre con las pestañas frente a los espacios (o incluso las pestañas de dos espacios frente a las pestañas de cuatro espacios): eres ingenuo si crees que los programadores de tu equipo no se bloquearán.
En tales casos, un editor en línea es una bendición: usted decide la configuración de los proyectos (incluso cómo se debe formatear el código) y simplemente se negará a aceptar el trabajo hasta que se adhiera a todos los estándares. Duro para el individuo, quizás, ¡pero genial para el proyecto!
A estas alturas, me estoy quedando sin casos de uso, así que vayamos a ver qué opción tenemos cuando se trata de editores de código en línea, especialmente para el desarrollo web.
JSFiddle
Aunque la JSFiddle no puede reemplazar un editor de texto completo, hace un muy buen trabajo manejando scripts de frontend únicos.
Es tan popular que los sitios de preguntas y respuestas como StackOverflow ya admiten la incorporación de enlaces JSFiddle directamente en su plataforma.
Para que las cosas comiencen rápidamente, JSFiddle ofrece algunos modelos estándar al principio; lo que significa que si desea obtener una demostración de, digamos, React, iniciado, todo lo que necesita hacer es hacer clic en el botón correspondiente y comenzar a escribir el código. Una vez que presionas Guardar, el "violín" se guarda y obtienes una URL permanente (Mira este tonto violín que creé: https://jsfiddle.net/tuqd76c4/ y ten en cuenta que puedes hacer tus cambios y presionar Guardar para crear un nuevo versión de esta URL).
Esto es lo que hace que JSFiddle sea una plataforma viable para el desarrollo web front-end:
- De uso gratuito (sin tarifas ocultas ni funciones freemium). JSFiddle se soporta a sí mismo a través de anuncios (al menos en el momento de la redacción), y puede ver un anuncio de Adobe en la parte inferior izquierda de la captura de pantalla anterior.
- Funciones de colaboración de código: ideales para crear conceptos juntos, entrevistas, etc.
- Múltiples diseños, tamaños de fuente, temas claros / oscuros, etc.
- Formateo de código (ordenación), próxima compatibilidad con linters (CSS y JS) y más.
Y ahora, sollozo, sollozo, por las cosas malas:
- JSFiddle es un editor puramente front-end. No hay forma de codificar y ejecutar su lenguaje de backend favorito.
- No hay ningún concepto de archivos y carpetas aquí (o cargas, para el caso). Todo lo que tiene es un solo espacio para el código, sin importar cuánto haya.
- JSFiddle no se puede utilizar para alojar código en su servidor. El código debe estar en JSFiddle y es público todo el tiempo.
- No hay forma de construir una canalización de CI / CD, usar Git, etc.
Dicho esto, JSFiddle tiene su punto óptimo y brilla cuando necesitas realizar pruebas de concepto y colaborar a la velocidad de la luz. Es y seguirá siendo una identidad importante entre los editores en línea.
Codeanywhere
Un problema con la mayoría de los editores de código de esta lista (al menos hasta ahora) es que esperan que usted mantenga el código en sus servidores en todo momento o que le soliciten que sincronice el código a través de la línea de comandos con regularidad.
No es así con Codificar en cualquier lugar.
En su punto más fuerte, CodeAnywhere tiene dos características que se destacan para mí:
- Imágenes de contenedor prediseñadas para más de 72 lenguajes de programación y marcos. ¡Esto significa que puede proporcionar un nuevo entorno de desarrollo directamente desde el editor! Por supuesto, el código se aloja automáticamente en el contenedor recién creado y los archivos se sirven directamente desde allí.
- Conéctese a cualquier cosa. Sí, literalmente cualquier cosa. No está obligado a almacenar su código en los servidores de CodeAnywhere. Ya sea que su código resida en FTP, plataformas de intercambio de archivos como Dropbox, Amazon S3 o en plataformas sofisticadas de control de versiones como GitHub, puede configurar fácilmente CodeAnywhere para leer y escribir en esa fuente, utilizando el editor de código únicamente para. . . Bueno, edición de código. 😛
Una cosa más que quiero señalar: si no se siente cómodo con Git cuando se trata de ver el historial y las diferencias, CodeAnywhere puede sentirse como un suspiro de alivio. El editor utiliza su sistema de diferencias para comparar archivos, que le permite comparar dos archivos en dos revisiones (se crea una revisión cada vez que guarda un archivo).
Sin embargo, hay un pequeño inconveniente con las revisiones: la versión gratuita le permite mantener solo una revisión, mientras que el plan de pago más pequeño permite 20 revisiones como máximo. En términos generales, no es un problema, ya que rara vez desea ver más allá de la última revisión número 20, pero como la mayoría de los programadores tienen la costumbre de presionar Guardar varias veces por minuto, puede resultar doloroso.
Todo dicho y hecho, CodeAnywhere es una oferta sólida y agradable para aquellos que quieren pasar a la nube y permanecer allí. 🙂 Dado que sus poderes van más allá del código de front-end, en mi opinión, ¡es muy recomendable!
CodeSandbox
Código Caja de arena puede considerarse como una versión mucho más potente y completa de JSFiddle. Fiel a su nombre, CodeSandbox proporciona una experiencia completa de editor de código y un entorno de espacio aislado para el desarrollo de aplicaciones para el usuario.
CodeSandbox es una auténtica potencia y un producto dulce y dulce. Me quedaría sin papel si trato de enumerar todas sus ventajas, pero aquí hay algunas características increíbles:
- Soporte Npm: Sí, puede agregar prácticamente cualquier paquete que esté disponible en npm.
- Archivos, carpetas, módulos: Puede dividir su código en varios archivos, agregar / eliminar imágenes de la carpeta pública y crear / importar módulos como mejor le parezca. El flujo de trabajo refleja el de un paquete de módulos moderno, por lo que no es necesario configurar (casi) nada.
- Soporte para TypeScript, recarga en caliente, exportación de GitHub, alojamiento de archivos estáticos, etc.
- Está construido sobre Editor de Mónaco, la misma bestia que alimenta al favorito VSCode editor. ¡Esto trae poderosas funciones como "Ir a", "Buscar referencias" y la refactorización necesaria a su alcance!
- Soporte de fragmentos para Hormiga
- DevTools integrados, linting, superposiciones de errores, marcos de prueba (Jest), combinaciones de teclas y más.
- Potente CLI para importar directamente proyectos locales a CodeSandbox.
Si bien la versión gratuita de CodeSandbox no admite código privado, puede obtener esa función (y aumentar los límites de tamaño en general) ayudándolos a Patreon por tan solo $ 5 al mes (pague lo que quiera, hasta $ 50 al mes).
StackBlitz
Si está en el front-end principalmente y no puede alejarse de la interfaz VSCode, ApilarBlitz fue creado solo para ti.
¿No ves nada especial?
Yo tampoco lo hice hasta que me desplacé un poco hacia abajo y hice clic en el botón Angular. ¡Auge!
Adivina qué, eso no se creó deliberadamente para parecerse a VSCode, ¡está construido en el editor de VSCode! Tanto es así, que puede instalar extensiones, buscar en las carpetas y organizar archivos de la manera que esperaría de una instancia de VSCode normal.
¡Pero espera hay mas!
Es posible que haya notado o no que:
- ¡Todas las aplicaciones creadas en StackBlitz también se implementan automáticamente en sus servidores! Entonces, esta aplicación de juguete Angular que acabo de crear se aloja automáticamente en https://angular-yvyi2j.stackblitz.io/. Lo más probable es que la URL siga funcionando (aunque se cargará lentamente, como es de esperar cuando se aloje de forma gratuita).
- Puede bifurcar y compartir el proyecto. Mientras comparte, obtiene un control más preciso sobre lo que pueden hacer los demás.
- Puede conectarse a un repositorio de GitHub y también permitir que el código se extraiga / envíe directamente desde allí. O simplemente puede descargar el proyecto como un archivo zip de la manera acostumbrada.
¡Pero espera hay mas!
¡Seriamente! 😀
Aquí está la lista de características oficiales que ofrece StackBlitz:
- Soporte nativo para Firebase (que es algo que no uso personalmente, pero bueno, es una bendición para aquellos que no quieren sumergirse en las oscuras profundidades del backend)
- Intellisense, búsqueda de proyectos
- Recarga en caliente a medida que escribe
- Importar paquetes npm
- ¡Edite sin conexión cuando no esté conectado!
StackBlitz está lleno de (hermosas) sorpresas cuando se trata de eliminar los obstáculos del desarrollo y la implementación web. ¡Incrustar VSCode en su sitio web ya no es cosa de sueños!
AWS Cloud9
Cloud9 fue posiblemente el primer IDE basado en navegador que ofreció características serias y tomó la idea del navegador como editor de la corriente principal. No es de extrañar que Amazon lo adquiriera más tarde, y hoy, Cloud9 es parte de las ofertas de AWS.
Si está conectado de forma remota (o está interesado en) la plataforma AWS, Cloud9 es donde termina su búsqueda de un editor perfecto (bueno, casi perfecto).
Veamos por qué:
- No hay cargos adicionales por usar Cloud9. Puede conectar Cloud9 a una instancia informática de AWS nueva o existente, y paga solo por esa instancia. También es posible conectarse a un servidor de terceros a través de SSH, ¡exactamente sin cargo! 🙂
- Soporte de primera clase para aplicaciones AWS Serverless (depuración, etc.)
- Acceso directo de terminal a AWS desde el editor (honestamente, un editor interno decente, el terminal con pestañas es lo que todavía extraño en VSCode)
- Soporta más de 40 lenguajes de programación (Go, C ++, Ruby, Node, Python, PHP, Java... Elija)
Las funciones de colaboración en Cloud9 también son deseables, lo que permite que las revisiones / entrevistas se realicen sin problemas.
Otra característica excelente es la reproducción en video de los cambios realizados en un archivo, lo que hace que el proceso de revisión sea un placer:
¿Mi consejo?
Si le gusta AWS, no espere y obtenga Cloud9 ahora mismo. Y si aún no está en la nube pero ha estado pensando en hacer un movimiento, adopte AWS e integre Cloud9 en su flujo de trabajo. ¡No puedes tomar una mejor decisión de cualquier manera!
Gitpod
Gitpod es una versión refrescante de los editores de código en la nube (o IDE, si lo desea) que tiene como objetivo mantener su código siempre probado y actualizado. En otras palabras, está profundamente integrado con GitHub, y cada vez que agrega código, ejecuta sus pruebas y canalizaciones de CI / CD para asegurarse de que el código esté siempre al 100%.
Vale la pena echarle un vistazo si te encanta la experiencia VSCode y quieres algo que admita todos los principales lenguajes y marcos de back-end / front-end (Django, Rails, Revel, lo que sea).
Theia
Si eres un fanático de SOLID y un arquitecto de software quisquilloso, el IDE cosquilleará su hueso de separación de preocupaciones. Es un código IDE codificado en TypeScript (¡cinco puntos para el estilo directamente!) Que tiene un front-end y un backend perfectamente separados. El front-end se ejecuta en un navegador, mientras que el backend puede estar en cualquier lugar: ¡la máquina local o la nube!
Pero eso no es todo: el front-end se puede ejecutar como una aplicación Electron con un entorno de navegador aislado y completamente funcional, lo que le brinda la apariencia de una aplicación de escritorio nativa en caso de que la desee.
GitHub Codespaces
Espacios de código de GitHub proporciona máquinas virtuales de alto rendimiento para ejecutar códigos con el fin de desarrollar aplicaciones web. Usando Visual Studio Code que incluye un editor y un ecosistema completo, encontrará que trabajar en el navegador es más fácil.
Pruebe el entorno de desarrollo más reciente para los proyectos, junto con imágenes prediseñadas. Experimentará una baja latencia en varias regiones al escalar sus máquinas virtuales hasta 64 GB de RAM y 32 núcleos. Comience a codificar con los entornos estandarizados, las especificaciones de hardware, la configuración del editor, las extensiones y los requisitos de tiempo de ejecución.
Puede aislar las dependencias entre los proyectos con docker-compose y contenedores. Además, obtenga una vista previa de los cambios que ha realizado fácilmente en el navegador y comparta puertos públicos y privados con sus compañeros de equipo. También puede editar o agregar incluso detalles nerds como espacios, pestañas, claro, oscuro, embellecer, más bonito, solarizado, Monokai y muchos más.
Los principiantes que quieran probar suerte pueden usar GitHub Codespaces de forma gratuita con beneficios limitados, pero tendrá suficientes funciones para continuar. Si es un equipo o una empresa, puede comenzar a usar GitHub Codespaces a $40/usuario/año.
JetBrains
Obtenga entornos de desarrollo de nube espacial nuevos, reproducibles, listos para usar y automatizados en segundos y comience a codificar con JetBrains IDE – Espacio. Es la solución única para proyectos y equipos de software al asumir la responsabilidad del ciclo de vida completo del desarrollo, desde las canalizaciones de CI/CD y el alojamiento de los repositorios de Git hasta los paquetes de publicación.
Space es la máquina virtual dedicada con el contenedor Docker. Puede instalar todas las bibliotecas y herramientas esenciales que necesita en el proyecto. Agiliza y acelera la onboarding experiencia compartiendo y reproduciendo los espacios de trabajo de codificación cuando lo desee.
Permita que los recién llegados comiencen a desarrollar un código al instante sin perder tiempo desarrollando una máquina local. Obtendrá un IDE completo listo para usar cada vez que necesite comenzar a escribir el código, depurarlo y ejecutarlo en segundos para probar el resultado. JetBrains ofrece una plataforma centralizada para administrar los entornos de desarrollo.
Todo lo que haces y cada recurso que usas se rastrea en un solo lugar. También puede integrar los recursos en la canalización de desarrollo con bastante facilidad. De acuerdo con su proyecto, puede elegir el tipo de máquina virtual que prefiera para adaptarse al tamaño del proyecto. Space ahorrará sus recursos al hibernar el espacio de trabajo de codificación para que pueda comenzar a trabajar en el mismo después del descanso.
Comience su viaje hoy y experimente la belleza de esta bestia de forma gratuita.
CodeTasty
CódigoSabroso es un IDE en la nube extensible, inteligente y moderno con muchas características adicionales que le encantarán. Le ayuda a escribir código limpio y legible de forma más inteligente en tiempo real en su idioma preferido.
Obtenga el editor de código para tener una experiencia fluida con compilación integrada, finalización de código, herramientas de detección de errores y mucho más. No se preocupe por la configuración; levántate y empieza a trabajar en los proyectos que tienes delante.
Tendrás la misma sensación que trabajar con tu escritorio cuando edites tus códigos en la nube mientras disfrutas del mismo rendimiento y velocidad. CodeTasty entiende las necesidades de cada desarrollador; y por lo tanto, le permite instalar tantas extensiones como desee para aumentar su productividad. Además, admite más de 40 idiomas y cien líneas de código en un solo archivo.
Pruebe CodeTasty gratis para obtener un espacio de trabajo sandbox, 2 espacios de trabajo FTP/SSH, colaboración, opción de terminal y 2 colaboradores. También puede comenzar con un plan pago de $ 4 / mes y tener la oportunidad de revisar sus códigos antes de ejecutar.
Replit
Aprenda, escriba y cree código con RepitaEl IDE gratuito, integrado en el navegador y colaborativo que admite más de 50 idiomas sin perder mucho tiempo en las configuraciones. Puede comenzar a codificar en su idioma en cualquier dispositivo, sistema operativo y plataforma.
Invite a sus compañeros de equipo, colegas o amigos a editar el código en los documentos de Google. Puede importar su código a GitHub para ejecutar y colaborar con repositorios de GitHub sin configuraciones. Ya sea que se sienta cómodo con C++, Python, CSS o HTML, puede escribir el código y editarlo en una sola plataforma.
Además, en el momento en que esté listo con el código, instantáneamente se activará en todo el mundo. Si también quieres aprender sobre código, Replit tiene más de tres millones de tecnólogos, creativos, programadores apasionados y más. Con la colaboración en tiempo real con sus equipos, su equipo será más productivo. Además, puede crear aplicaciones, bots, etc., con la ayuda de complementos mientras codifica. La herramienta también te ayuda a desarrollar tus proyectos directamente desde tu navegador.
Regístrese para obtener una cuenta y comience a codificar ahora.
PaizaCloud
Cree aplicaciones web en su navegador con PaizaCloud IDE. Es un entorno de desarrollo web para Node.Js, MySQL, Django, Java, PHP, Jupyter Notebook, Laravel, WordPress y más.
PaizaCloud le permite escribir sus códigos sin problemas sin preocuparse por configurar el entorno. Simplemente abra el navegador y su entorno estará listo en tres segundos. Ya sea que esté utilizando la versión Mac, iPad, OS o Windows, puede operar el mismo entorno en todos los navegadores.
Además, puede usar shells de Linux para configurar entornos de desarrollo basados en web de manera más fácil y flexible. También puede publicar los servicios ideales para su cartera, como servicios de alojamiento, actualizando al plan básico.
Ejecute comandos, administre archivos, edite códigos y más en el mismo navegador. PaizaCloud elimina la necesidad de agregar comandos como vim, ssh, etc., para editar archivos o iniciar sesión. En cambio, puede operar los servidores de manera fácil y eficiente como si estuviera ejecutando una computadora de escritorio.
Realice una prueba de manejo con el plan gratuito con 2 núcleos y 2 GB de memoria. O aproveche la vida útil ilimitada del servidor con $ 9.80 / mes y obtenga 1 GB de espacio en disco adicional.
Conclusión
Esto cubre más o menos todos los IDE y editores de código que existen en el momento de la escritura. He omitido dos tipos de ofertas en esta lista: las que se centran exclusivamente en entrevistas y no tienen entornos completos (excepto nuestro querido clásico JSFiddle, por supuesto), y aquellos que no parecían ofrecer algo sustancial y tenían poco más que una elegante página de inicio.
Si necesita algo ligero para el desarrollo web, puede explorar estos editores de código.
