Plugins para Atom imprescindibles para todo desarrollador web

¿Eres un fan de WordPress? Apuesto a que sí, por lo que tienes que probar nuestro nuevo plugin: Nelio Content. Hay tantas cosas que podrás hacer sin salir de WordPress… ¡Descúbrelas todas!

Escoger el editor que vas a usar para programar no es una decisión sencilla. Afortunadamente, hoy en día tienes muchas alternativas disponibles para elegir.

He de decir que en mis inicios como desarrollador en Java siempre fui un fan de Eclipse como entorno de desarrollo (lo sé, muchos lo odiáis). Y es que aunque es una herramienta bastante pesada y consume muchos recursos del sistema, todo lo que te proporciona en cuanto a ayudas a la programación para mí claramente compensa.

Al dar el salto al desarrollo web en general y de plugins para WordPress en particular pasé un tiempo buscando alternativas a Eclipse. Estuve probando Sublime, pero tuve muchos problemas para mantener una configuración que funcionara sin problemas cada vez que había una actualización. También usé PHPStorm y la verdad es que la experiencia fue buena, pero su interfaz en Mac OS X no acababa de convencerme (aunque he de decir que es lo más parecido a Eclipse que encontré).

Finalmente di el salto a Atom, con el que estoy bastante contento. De hecho, todas mis aportaciones al desarrollo de nuestro plugin Nelio Content las he hecho desde este editor, incluyendo todo el código en Node.js de la parte servidor de Nelio Content que corre en el cloud de Amazon.

Captura de pantalla de Atom.
Captura de pantalla de Atom.

Si no conoces Atom, te recomiendo que entres en su web y le eches un ojo. Bajo mi punto de vista, tiene el mejor gestor de plugins o extensiones que puedes encontrar hoy en día. Y hasta el día de hoy no me ha dado grandes quebraderos de cabeza. Simplemente funciona.

Y hablando de plugins, os dejo una lista de los más interesantes que tengo instalados y uso habitualmente para mis desarrollos. ¡Tomad nota!

Los plugins para Atom más recomendables

Recuerda, estos son los más útiles para mí, pero quizás tú encuentres otros que te gusten más o te vayan mejor. De todas formas, seguro que la mayoría te sirven.

file-icons

Este simple plugin añade iconos y colores a los archivos que tenemos en Atom según su tipo concreto para que nos sea más sencillo identificarlos.

Gama de iconos que file-icons gestiona para identificar tipos de archivo.
Gama de iconos que file-icons gestiona para identificar tipos de archivo.

De un simple vistazo sabrás el tipo de archivo que tienes delante. Parece una tontería, pero una vez lo pruebas ya no puedes dejar de usarlo.

minimap

Si eres programador, seguro que muchas veces te encuentras con archivos bastante largos. Pues con minimap podrás ver una representación de los contenidos del archivo en la parte derecha del código. De este modo te resultará más sencillo ver si en un momento dado te encuentras más arriba o más abajo del archivo y así no perderte.

Puedes ver el mini mapa en la parte derecha, con los cambios en el código marcados.
Puedes ver el mini mapa en la parte derecha, con los cambios en el código marcados.

Y lo mejor de todo es que lo puedes complementar con el plugin minimap-git-diff, que lo que hace es marcar en el mini mapa los lugares donde has hecho cambios con otro color.

pigments

Este plugin te muestra los colores que encuentra en tus archivos. Especialmente útil cuando estás editando CSS.

Ejemplo de uso de pigments para Atom.
Ejemplo de uso de pigments para Atom.

color-picker

Con este plugin seleccionar el color que quieres incluir en tus estilos CSS es muy sencillo. Tan solo has de hacer clic derecho y seleccionar la opción “Color Picker” para que se abra un selector de color donde visualmente escoger el color que mejor se adapte a tus necesidades. El mejor compañero del plugin pigments.

Selector de color de colorpicker.
Selector de color de color-picker.

highlight-selected

Este plugin añade una funcionalidad que parece increíble que no venga ya por defecto en el propio core de Atom. Simplemente con hacer doble clic en una palabra en el editor nos resaltará esa palabra y todas las ocurrencias adicionales de la palabra en el resto del archivo que tengamos abierto.

Funcionamiento del plugin highlight-selected.
Funcionamiento del plugin highlight-selected.

Si eres programador, te irá genial instalarlo para ver dónde aparecen variables o funciones.

goto-definition

Otra de las funcionalidades de Eclipse que más hecho en falta es el típico CTRL+click que encima de una función, objeto o clase te lleva directamente a su definición. Aunque no es perfecto, lo mejor que he encontrado y que uso a diario para moverme por el código es este plugin.

Navegación entre archivos mediante el plugin goto-definition.
Navegación entre archivos mediante el plugin goto-definition.

Tienes que poner el cursor encima de lo que quieras buscar (el nombre de una función, por ejemplo) y hacer Alt+Cmd+Enter. Esto te lleva a la definición o bien abre un diálogo flotante en caso de que el plugin encuentra varias ocurrencias y no tiene claro cuál es la que estás buscando. Una vez la seleccionas, vas a la definición.

git-plus

Este plugin integra el control de versiones con Git dentro de tu editor Atom. De esta forma podrás hacer todo lo que haces con Git habitualmente sin tener que ir al terminal.

Funcionamiento de git-plus en Atom.
Funcionamiento de git-plus en Atom.

He de decir que aunque al principio sí que lo usaba más, últimamente acabo tirando del terminal para gestionar los cambios con Git en vez de usar el plugin en Atom. Tengo pendiente volver a darle una oportunidad porque funcionaba muy bien.

git-time-machine

Otro plugin que he ido dejando de usar aunque sigo teniendo instalado es git-time-machine. Tengo también pendiente recuperarlo y usarlo con más frecuencia.

Funcionamiento de git-time-machine.
Funcionamiento de git-time-machine.

Dado un archivo cualquiera dentro de un proyecto controlado por Git, podrás ir hacia atrás en el tiempo para ver los cambios que ha ido teniendo. Incluye una barra horizontal con la linea de tiempo y los cambios. Muy útil cuando quieres ver modificaciones pasadas en tu código.

merge-conflicts

Si utilizas Git habitualmente y trabajas con otros desarrolladores, seguro que te has encontrado en situaciones en las que tu código tiene conflictos con la versión más actualizada en el servidor compartido.

Funcionamiento de merge-conflicts en Atom.
Funcionamiento de merge-conflicts en Atom.

Arreglar estos conflictos es un rollo, y no podrás subir tus cambios hasta que no los resuelvas. Por suerte, merge-conflicts te proporciona asistencia en esta labor haciendo que el proceso sea mucho más visual y sencillo. No dudes en probarlo.

todo-show

Muchas veces dejas en tu código ciertos comentarios para tu yo del futuro. Y claro, es posible que te olvides de ellos. Por suerte, podrás instalar el plugin todo-show que abre un panel en Atom con todos los comentarios que encuentra y contienen las palabras TODO, FIXME, etc.

Vista del panel que incluye el plugin todo-show.
Vista del panel que incluye el plugin todo-show.

De esta forma, antes de lanzar tu código al público siempre puedes hacer un repaso y ver si te dejaste algo pendiente de arreglar.

linter

Como desarrollador Java en Eclipse, me encantaba cada vez que el editor era más inteligente que yo y me marcaba los errores que iba detectando a la vez que yo programaba código. Es una funcionalidad increíble que, además, reduce los errores a la mínima expresión.

En Atom, el equivalente que mejor me funciona es linter. Se trata de un plugin que añade control y visualización de errores en el propio editor. Y aunque no lo detecta todo, nos ayuda bastante.

Resaltado y control de errores con linter en Atom.
Resaltado y control de errores con linter en Atom.

Además del plugin linter básico, en mi instalación tengo las siguientes extensiones de linter para Atom:

atom-beautify

Este plugin hará que tus archivos se vean más bonitos y sean más legibles ya que se encarga de controlar que su indentación sea correcta. Es decir, que las líneas de código estén bien ordenadas y que empiecen en el lugar que toca. Es especialmente útil para seguir las guías de estilo en archivos que tienen múltiples bucles o funciones que llaman a funciones. Además, soporta la mayoría de lenguajes que puedes usar hoy en día para programar.

atom-ternjs

Por último, otra funcionalidad que hoy en día queda por resolver bien en editores como Atom es el tema del autocompletado mientras programas. Además de hacer que seas más eficiente como programador, si dispones de autocompletado mientras escribes tu código es más fácil evitar errores.

En mi caso, la mayoría del código que suelo escribir en Atom es JavaScript, por lo que instalé el plugin atom-ternjs que se encarga del autocompletado. No es perfecto, pero es mejor que nada 😉

Bonus: atom-2048

Si te quieres distraer un rato del trabajo, aquí tienes un plugin que te permite jugar al popular juego 2048 dentro del editor Atom. Ten cuidado que engancha 😉

Jugando al 2048 desde el propio Atom. ¡Que no te pille tu jefe!
Jugando al 2048 desde el propio Atom. ¡Que no te pille tu jefe!

Resumen final

El editor Atom es mi editor de texto para programar favorito a día de hoy. Tienes un montón de plugins disponibles y es bastante estable. Sin embargo, siempre hay cosas que podrían mejorar. En concreto, me sigue faltando la posibilidad de tener un panel con el listado de funciones que hay definidas dentro de un archivo. Esto es algo que hecho de menos desde que dejé Eclipse, y aún no he encontrado un editor que lo solucione bien. Recientemente encontré un plugin para Atom que lo hace, pero su calidad es pésima.

Si tú también usas Atom y crees que me he dejado algún plugin más que para ti es imprescindible, déjame un comentario. Estoy seguro de que así completaremos la lista con cosas muy interesantes.

Imagen destacada de Atom.

por

Doctor en Computación por la UPC, con publicaciones en el campo de la minería de datos y de la explotación de información relevante de grandes volúmenes de datos en el campo de la salud. Especializado en el diseño, desarrollo e integración de servicios y aplicaciones web en el cloud. Contribuye muy activamente en la comunidad WordPress participando en meetups, seminarios y WordCamps.

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *