¿Cuál es un buen IDE para desarrollar JavaScript front-end?

Yo personalmente iría por Webstorm:

1. Te ayuda a aumentar la calidad del código
En primer lugar, incorpora JsTestDriver de Google. Este es un probador que ahorra tiempo para Javascript. En lugar de activar el servidor Js TestDriver y luego abrir cada navegador que desea probar, prefiere usar JsTestDriver, que opera el código en uno o más navegadores. Tomemos este caso. Supongamos que hay varios escenarios escritos en formato JsTestDriver. Todo lo que tiene que hacer es ir al “Caso de prueba”. Al hacer clic en él y elegir “Agregar soporte de marco de aserción JsTestDriver”, agregará la estructura de soporte para el marco a su proyecto. Al hacer clic en la pestaña “JsTestDriver” que se encuentra en la parte inferior del IDE, podrá ver su panel de control. Si hace clic en cualquiera de los iconos del navegador, el navegador se iniciará y apuntará al servidor JsTestDriver. Al final, después de abrir todos los navegadores, todo lo que tiene que hacer es hacer clic en la flecha verde para ejecutar sus pruebas en cada navegador.
WebStorm también incorpora JsLint, una herramienta utilizada para verificar si el código fuente de JavaScript cumple con las reglas de codificación. Es más una herramienta de detección de errores. Le ayuda a encontrar posibles problemas en su código JavaScript. Al usarlo, aumentará tanto la productividad como la calidad del código.
2. Reduce tus errores
WebStorm analiza su código mientras escribe y, si aparece un error, se lo notificará.
3. Te permite escribir código más rápido
WebStorm tiene la capacidad de analizar todos sus archivos de proyecto HTML y JavaScript. Además, le ofrece la posibilidad de cambiar el nombre de cualquier función de JavaScript. Al recorrer su código, corrige todas las referencias. Lo mismo sucede cuando decides mover algunos archivos.

Si tuviera que usar un IDE, sería WebStorm. Dicho esto, JavaScript es un lenguaje simple y conciso con pocas construcciones, por lo que un IDE tiende a no ayudarte lo suficiente como para validar que está lleno. Uso Sublime Text en mi trabajo diario en Spotify, y casi todos los desarrolladores de JavaScript profesionales que conozco usan eso, Vim o Emacs.

Plug descarado: si te gustan mis divagaciones sobre la programación en Quora, puedes disfrutar de mi programa de YouTube: Fun Fun Function

IDE de tormentas web

WebStorm es un IDE de JavaScript ligero pero potente, perfectamente equipado para el desarrollo del lado del cliente y del lado del servidor con Node.js.

El IDE proporciona soporte de primera clase para JavaScript, Node.js, HTML y CSS, así como a sus sucesores modernos. Los marcos admitidos incluyen AngularJS, React, Meteor y más.

Sistema de control de versiones

Una interfaz de usuario unificada para trabajar con Git, SVN, Mercurial u otro VCS es un verdadero ahorro de tiempo.

Integración perfecta de herramientas

Gracias a la integración con herramientas como Grunt task runner, linters, npm, puede minimizar el uso de la línea de comandos. Pero cada vez que necesite Terminal, también está disponible como una ventana de herramientas IDE.

Depuración, seguimiento y prueba

Utilice un depurador potente para JavaScript y Node.js. Traza y perfila eficientemente tu código con spy-js. Ejecute pruebas unitarias con Karma o Mocha. Todo eso en el IDE!

Puedo llamarme un codificador feliz. Aprendí una cosa que es crucial para cualquier desarrollador de software: debes invertir en ti mismo. El producto que está creando es importante, pero pasar tiempo para mejorar su propia productividad es igualmente importante. Si te encuentras haciendo lo mismo más que unos, tienes que preguntar: “¿hay una manera más eficiente de hacer esto?”. No se preocupe si sus continuos esfuerzos para ser más productivo al principio en realidad disminuyen su productividad e interrumpen su flujo de trabajo. Después de todo, no es un sprint, es un maratón, verás los beneficios a largo plazo.

¿Sabes que Vim significa Vi IMproved? Hace mucho tiempo probé Vim y nunca me gustó. Me volvió loco. Simplemente no podía acostumbrarme a eso. Lo intenté de nuevo. Y lo seguí odiando. Por varios meses. Hasta que un día me di cuenta: ya no puedo vivir sin movimientos Vi. Ahora uso la navegación al estilo Vi en todas partes. En cada aplicación que uso. Incluyendo, por supuesto, IDE y navegadores donde paso la mayor parte de mi tiempo.

Durante años he usado muchos IDEs y editores diferentes. Irónicamente, nunca encuentro a Vim un IDE bueno y sólido. Es un buen editor, no, es un editor increíble, sí, pero convertirlo en un IDE completo no es fácil. Así que mi búsqueda del mejor IDE donde su editor admitiría la navegación al estilo Vi ha comenzado.

He usado Visual Studio, Notepad ++, NetBeans, Xcode, MonoDevelop, Sublime Text, Atom, Eclipse, LightTable, RubyMine, PyCharm y WebStorm. El último me mantuvo feliz por más tiempo que ninguno de ellos. Es un IDE serio. Y tiene un excelente complemento Vi: IdeaVim. Desafortunadamente, no parece ser importante para Jetbrains, el creador de WebStorm. La integración de Vim no es un punto de venta, lo entiendo. IdeaVim solo admite movimientos Vi básicos, muchos de ellos tienen errores y solo se integra con el editor. Lo que significa que no puede controlar efectivamente otros aspectos del IDE aparte del editor simplemente usando el teclado. También WebStorm es propietario. Es decir, si no tiene una función que necesita allí, lo más probable es que no la obtenga pronto.

Y un día encontré Spacemacs. Es la mejor distribución de Emacs que he visto. No solo es sorprendente, es alucinante. Y la navegación al estilo Vi (si así lo elige) es un ciudadano de primera clase. Debo enfatizar que si no le gustan las combinaciones de teclas de Vim, sí tiene la opción de desactivarlas. Durante mucho tiempo dudé y no quise cambiar de WebStorm a Emacs. Tenía miedo de no encontrar pequeñas cosas agradables que proporciona WebStorm. Oh, estaba tan equivocado. Emacs resultó ser extremadamente poderoso. Y su poder radica en su extensibilidad. Confía en mí: la diferencia en la calidad y cantidad de complementos disponibles para Sublime, WebStorm y Emacs haría reír a cualquier usuario de Emacs.

Sí, Emacs probablemente no solo para todos. Algunos dirían: “Emacs tiene un ego que no cabe en mi computadora”. Sin embargo, si uno quiere convertirse en un programador verdaderamente hardcore, tarde o temprano descubrirá Emacs. Y confía en mí: es un entorno que cambia la vida y está lleno de “momentos ajenos”

Si está interesado en Spacemacs, o quiere ver algunas de sus características, le recomiendo ver los videos de Eivind Fonn. O simplemente pruébelo usted mismo, es fácil de instalar y es completamente gratuito https://github.com/syl20bnr/spac …

Código visual de estudio
Lo sé, lo sé, no es un IDE real, ¡pero está cerca!
Como está desarrollando JS, eventualmente irá a TypeScript, desarrollado por Microsoft.
El código de Visual Studio es para TypeScript y todo lo demás. Incluye “características de depuración, Git integrado, resaltado de sintaxis, finalización inteligente de código, fragmentos y refactorización de código”. También puede personalizar su tema y accesos directos.

Acabo de publicar comentarios, pero como Sam pidió una respuesta, ¿por qué no?

Curiosamente, mi respuesta hoy difiere de la que habría dado hace unos días …

Primero, sobre lo que la gente dice aquí: no estoy de acuerdo con la frontera entre IDE y los editores de texto. “No use IDEs, use Sublime o Atom”. Bueno, a pesar de lo que dice Atom, es más que un editor de texto, es, en mi opinión, un IDE completo. (Idem para Sublime (probablemente), pero como nunca lo usé, no haré comentarios).

Atom (y Brackets) tienen resaltado de sintaxis y buenas capacidades de edición, pero, dados los complementos / paquetes correctos, también pueden enlazar el código que escribimos, en tiempo real: si cometemos un error, de sintaxis o de estilo (malo sangría, mala cita, etc.), se nos advierte de inmediato. Hay un análisis de código real allí.

También son capaces de autocompletar, aunque dada la naturaleza dinámica de JS, nunca alcanzarán el nivel de IDE de Java, por desgracia.

Lo único que falta es probablemente la depuración, porque debe hacerse en el navegador. Aunque creo que vi un paquete Atom para depurar aplicaciones Node.js …

Otro comentario: creo que no hay un “mejor” editor de texto, IDE u otras herramientas. Existen diferentes herramientas, con diferentes formas de trabajar, que se adaptan más o menos a los gustos, hábitos y necesidades de varios desarrolladores. En general, puede probar de forma gratuita todos estos editores, por lo que es “mejor” darles una vuelta, para ver cuál prefiere.

Eso es lo que hice para JavaScript: ¡utilicé Eclipse por primera vez y descubrí que era horrible para la codificación JS! Luego, probé con WebStorm y me impresionó positivamente. Al menos mientras persistiera el período de prueba … Luego fui a Brackets y descubrí que también era excelente. ¡Y mucho más ligero! WebStorm comienza como Eclipse, después de varios minutos. Los corchetes comienzan casi al instante. Me gustan los Brackets, pero descubrí que le faltaban algunas características y otras no estaban tan bien implementadas. Así que probé Visual Studio Code. Pero actualmente faltan dos características que uso ampliamente cuando codifico: arrastrar y soltar texto y selección de columna (rectangular). Entonces, busqué en otro lado, y solo quedaba Atom … Tenía un prejuicio contra él, pero descubrí que la mayoría de mis temores eran nulos hoy (velocidad mejorada, consumo de memoria reducido, todas las características básicas están aquí fuera de la caja).

Escribí algunas reseñas rápidas de mis experiencias en algunos artículos: si desea una opinión más detallada, puede consultarlas en el Blog técnico de PhiLhoSoft (sitio recién respaldado, en evolución …).

Aunque no es realmente un IDE, SublimeText ha permitido la creación de un poderoso ecosistema de complementos: el administrador de paquetes de Sublime Text. Elegir el conjunto correcto de complementos y extensiones también podría evitar que tenga que buscar un IDE. Hay complementos para casi cualquier cosa que se te ocurra, incluida la finalización del código, el resaltado de sintaxis, las compilaciones programables, etc. Por supuesto, como suele suceder con las herramientas de código abierto, tendrás que invertir una cierta cantidad de tiempo, tamizando y encontrar los mejores, pero te garantizo que valdrá la pena. Una vez que personalice Sublime de una manera que funcione para usted, no podrá pasar a otro editor.

Cuando se trata de IDEs para JavaScript, Webstorm es el final de todo. No me malinterpreten, hay varios otros jugadores en el espacio, pero muchos IDE ofrecen lo que yo considero que son “demasiadas” características a expensas de la facilidad de desarrollo.

Dicho esto, para el desarrollo en JavaScript, recomendaría contra IDE por dos razones:

JavaScript no está compilado.
De acuerdo, esto es un poco inapropiado dependiendo del navegador que estés usando, pero estoy divagando. Una de las características más poderosas de un IDE es la capacidad de compilar y ejecutar su código, devolviendo los resultados en consecuencia. Este es un beneficio que se omite principalmente en JavaScript, ya que la mayoría del trabajo que querrá ver está en el navegador o en la interacción con el servidor, que es algo que no veo con frecuencia en los IDE.

Administrar dependencias es una bestia diferente en JavaScript
Una de las otras características que proporcionan la mayoría de los IDE es la administración de bibliotecas; ser capaz de convocar rápidamente las bibliotecas que usa mientras desarrolla software. Sin embargo, el panorama de JavaScript está cambiando rápidamente y, en lugar de depender de las herramientas de administración de un IDE, es probable que elija varios administradores de paquetes.

Sin duda, hay muchas otras características que ofrecen los IDE, pero muchos de esos mismos beneficios se pueden encontrar en editores de texto más livianos, que tienden a ser menos obstinados que los IDE (y, admitámoslo, no demore 2 minutos en cargar al comienzo de tu día).

Si bien aprecio lo que ofrecen los IDE (y siempre me encantará lo mucho más placentera que fue la experiencia de Java en Eclipse), JavaScript sería un caso de uso particular en el que descubrí que simplemente no funciona.

Atom.io todo el camino! Es gratis, de código abierto y funciona en la mayoría de las computadoras. (También está desarrollado por GitHub)

Las características incluyen:

• Autocompletado inteligente para muchos lenguajes de programación diferentes (¡incluido JS!)
• Búsqueda inteligente y reemplazo
• Administrador de paquetes incorporado que le permite personalizar su tema o agregar complementos
• Navegador inteligente del sistema de archivos que le permite administrar sus proyectos de manera súper fácil

¡Aprenda más sobre esto + descargue gratis en https://atom.io !

Mi favorito más reciente es:

Atom.io

Atom funciona en todos los sistemas operativos. Puede usarlo en OS X, Windows o Linux.

Explore y abra fácilmente un solo archivo, un proyecto completo o varios proyectos en una ventana.
Divida su interfaz Atom en múltiples paneles para comparar y editar código entre archivos.

Otros buenos editores de texto incluyen: Sublime y Brackets

Mi elección es Atom. Fuera de la caja es rápido y ligero. Hay muchos temas para que se vea como lo desee, y edítelo fácilmente desde allí para perfeccionar el aspecto. Tiene muchas extensiones disponibles. Básicamente, puede convertir Atom en un IDE ajustado para los idiomas en los que trabaja. Es bastante fácil personalizar y crear sus propias extensiones (una vez que aprenda cómo).

He utilizado casi todas las recomendaciones aquí, incluidas Netbeans, Sublime, Notepad ++, JetBrains, phpStorm, etc. Regresé a Atom.

Sí, dependiendo de qué extensiones y temas use, y cuántas extensiones, puede hacer que Atom se ralentice. Desactivo las extensiones que no uso todo el tiempo.

La única razón por la cual Atom no puede hacer algo, es porque nadie hizo una extensión para hacerlo todavía. Puedes ser esa persona, si quisieras. El cielo es el límite con Atom.

Le recomiendo que se obligue a usarlo durante un mes. Dedique el tiempo para obtener un tema que le guste y una buena configuración de extensión para usted.

GitHub : todo está en GitHub. Los temas, complementos, todo! Si le gusta una extensión, pero desea personalizarla un poco para satisfacer sus necesidades, ¡PUEDE! Solo bifurca el complemento y haz tus cambios 🙂

He probado muchos IDEs diferentes y básicamente he elegido cualquier producto JetBrains que coincida con el idioma del back-end. Nunca solo he usado JavaScript. Tengo para un proyecto o dos, pero también uso algunos otros idiomas. Siempre encontré que Sublime carecía un poco en lo funcional que esperaba, pero podría tener una opinión diferente sin las expectativas creadas por IntelliJ, PHP Storm y PyCharm. Tengo numerosos colegas que no conocen idiomas más allá de JavaScript y están desconcertados por mi elección, ya que prefieren Sublime. Encuentran WebStorm demasiado complicado y difícil de aprender. Cada versión no comunitaria (de pago) de un IDB de JetBrains tiene un soporte similar para JavaSceipt a través del mismo complemento. Pruebe uno de ellos que tenga sentido en una prueba y pruebe Sublime de la misma manera. Decidido por ti mismo. Es la única forma en que realmente estará satisfecho con su decisión.

Yo personalmente cambio de Atom y Sublime. Javascript está bien soportado en todos los editores de código modernos, incluso Node, JSON y otros formatos. Atom es un gran producto de los chicos de Github y tiene soporte completo para Git. Por lo que sé, incluso está escrito en Javascript para que pueda personalizarlo completamente de la manera que desee.

Aunque definitivamente no es un estándar, pero la mayoría de los desarrolladores de JavaScript front-end prefieren los Editores de texto a los IDE. Digo esto porque en Codeanywhere nos preguntamos qué usarían nuestros usuarios (en su mayoría desarrolladores front-end JS) para programar cuando no estaban usando nuestro software.

Así que hicimos una encuesta a fines del año pasado con más de 2000 desarrolladores y obtuvimos esta lista:

28% – Bloc de notas ++
23% – SublimeText
17% – Eclipse
8% – NetBeans
4% IntelliJ

Los detalles adicionales de la encuesta se pueden encontrar aquí: IDE de escritorio más populares y editores de código

Espero que esto ayude

En lo que respecta a WebStorm vs. Sublime :

• WebStorm. (Pros) Es un IDE muy poderoso con muchas características realmente útiles, especialmente en lo que respecta a la gestión de proyectos Git, el soporte React Native y la integración de herramientas JS comunes como npm, Grunt y Gulp. (Contras) Es relativamente caro en la memoria de su computadora. Utilicé WebStorm en el último Macbook Pro 2016 y, a veces, congeló mi computadora (especialmente cuando utilicé el terminal en la aplicación del cual recomendaría no usarlo). Un tipo de problema puntual que he encontrado con WebStorm es cuando utilizo los accesos directos de la línea de comandos para abrir archivos / carpetas (subl para Sublime, ws / cualquier otra cosa para WebStorm) que WebStorm solo abre un directorio a la vez (si ya tiene un La instancia de WebStorm abierta no puede usar el acceso directo de línea de comando) mientras que Sublime no lo hace. ¡WebStorm también cuesta dinero (a menos que sea un estudiante)!
• Sublime. (Pros) Tiene una gran interfaz de usuario (totalmente personalizable) que es simple y adaptable para todos los idiomas. Si bien WebStorm está hecho específicamente para JavaScript, Sublime tiene soporte para muchos otros idiomas, por lo que si está trabajando en un proyecto que involucra JS frontend pero también componentes de back-end en Python u otro idioma, Sublime tiene un mejor soporte. Consejo profesional: ¡recomendaría el tema Boxy en Sublime que se ve increíble! Sublime también es gratis (Contras) Sublime está limitado de forma inmediata en términos de funcionalidad. La búsqueda de texto a menudo no funciona (debe escribir la palabra completa y no prefijos por lo general), lo cual es molesto. Si no paga una licencia, Sublime le molesta todo el tiempo para pagar.

El concepto de un IDE es una pregunta difícil, la mayoría de los ingenieros de front-end usan un editor de texto como Sublime Text o Atom en estos días, puedes usar algo de las ofertas de Jetbrains (PAGADO) y hay bastante buen CodeIntel, yo personalmente usé Sublime Text durante algunos años, pero he cambiado a Atom, el soporte para Atom se ha vuelto cada vez más fuerte y ahora está fuera de Beta, el precio tampoco puede ser vencido.

Si está buscando un IDE, WebStrom es bastante bueno y tiene buenos planes de precios. También está Cloud9 (está basado en el navegador), que es increíble, pero no me parece una buena elección (para mí) para nada más que proyectos personales o de código abierto.

¡Me gusta mi espacio de trabajo rápido y un IDE no siempre funciona bien! Si esto también es importante para usted, le recomiendo un editor de texto como: Atom , Sublime Text o Vim . Utilizo Atom y lo he personalizado principalmente con las herramientas que se presentan aquí: desarrollo de JavaScript Supercharge en Atom

Utilice también tool-bar-almighty y consulte este artículo para conocer otras funcionalidades: http://www.sitepoint.com/10-esse …

Nunca he encontrado uno que me encante, pero actualmente trabajo con Webstorm. Los únicos otros que consideraría son Visual Studio Code y Sublime Text (si eso cuenta como un IDE).

Mis características imprescindibles incluyen resaltado de sintaxis, alineación en el editor, múltiples cursores, buenas herramientas de búsqueda / reemplazo, plegado de código, finalización de código, la capacidad de hacer clic a través de definiciones, herramientas de reformateo y un terminal incorporado.

Es esa última característica la que me mantiene usando Webstorm. Tal vez hay un complemento Sublime que te da un terminal, pero nunca he encontrado uno que me haya gustado para hacer clic en el código. La última vez que lo revisé, Visual Studio Code no tenía un complemento de terminal. Si lo hiciera, consideraría cambiar. (Atom tiene uno, pero por lo demás es un poco pobre en funciones para mis gustos).

Uso Eclipse para toda mi programación, pero cuando se trata de Javascript, CSS y HTML, uso lo siguiente:

1. Edición de código de Visual Studio Code. Redefinido (Mi favorito)
2. Sublime Text El editor de texto del que te enamorarás