Atom.io: ¿Editor HTML (gratuito) para el siglo XXI o Copy-Cat?

Atom es un editor HTML de código abierto multiplataforma relativamente nuevo. Según sus desarrolladores, Atom es un «editor de texto pirateable para el siglo XXI». Probaremos si hay algo de verdad en esta afirmación. Atom y Sublime Text 2 tienen, a primera vista, mucho en común; sin embargo, se promueve explícitamente la alta capacidad de personalización de Atom. Este artículo muestra si el editor es realmente tan especial y, de ser así, qué lo hace destacar del resto. ¿Es probablemente EL editor del siglo XXI o simplemente otro imitador?

Instalación de átomo

Este editor funciona en todas las plataformas: Windows, Mac OS X y también Linux. Si usa Windows o Linux, vaya a la página del proyecto en GitHub y desplácese hacia abajo hasta «Instalación» para descargar el archivo de instalación. Una vez que lo haya instalado correctamente, el editor le da la bienvenida informándole sobre los recursos y pulsaciones de teclas más importantes.

Lo primero que debe hacer después de haberlo instalado es ajustar configuraciones importantes como la fuente y el tamaño de la fuente en «Atom => Preferencias». Es posible que también desee cambiar el tema, ya que los temas oscuros no son del agrado de todos. Hay seis temas para elegir, pero puedes encontrar más en la comunidad. Tenga en cuenta que hay temas para el diseño del editor y temas para la sintaxis. Entonces, un tema de editor no incluye la sintaxis. Si también desea cambiar el resaltado de sintaxis, deberá instalarlo por separado. No debe olvidar verificar los paquetes preinstalados, también conocidos como complementos, para ver qué paquetes adicionales puede necesitar instalar. Encontrarás mucho aquí. Y encontrará más con la función de búsqueda del editor que en el sitio web de Atom. Como ves, no es gran cosa ajustar el editor a tus necesidades.

Instalación de paquetes y temas

Instalar paquetes es bastante fácil utilizando el elemento de menú «+ Instalar». A diferencia de Sublime Text 2, no tiene que instalar un complemento antes de poder instalar nuevos complementos. Lo encuentro más fácil de usar, ya que le ahorra un tiempo valioso.

Los temas se pueden instalar de la misma manera. Para instalar un tema o paquete, simplemente ingrese, si lo conoce, el nombre del tema o paquete y presione «enter». Pero también puedes buscar “temas” o palabras clave generales para llegar al objetivo.

Sin embargo, cuando traté de instalar (en Mac OS X) el paquete «Emmet» (anteriormente conocido como «Zen-Coding»), recibí un mensaje de error que decía que faltaban las «Herramientas de desarrollo de línea de comandos» de Apple y Emmet por lo tanto, no se pudo instalar.

Después de instalar Command Line Developer Tools de Apple, la instalación de paquetes y temas funcionó perfectamente y fue rápida.

Paquetes recomendados para comenzar

• Emmet (anteriormente Codificación Zen) – Hace que su flujo de trabajo sea más rápido
• barra-más cerca – Cierra las etiquetas HTML después de ingresar
• Compatibilidad con la API principal de WordPress – Extiende el editor Atom por etiquetas de WordPress
• lenguaje-php – Extensión para una mejor experiencia de trabajo con PHP
• bloqueador de documentos – Hace que sea más fácil escribir comentarios sobre, por ejemplo, funciones de PHP
• autocompletar-más – Muestra posibles terminaciones mientras escribe

Personalización de Atom a través de CSS

Puede modificar el aspecto del editor Atom a través de la hoja de estilo. No me gustó la salida de color y el etiquetado del «Bracket Matcher». Solo usó una línea de puntos de 1 píxel para resaltar corchetes y divs coincidentes que eran muy difíciles de ver para mí. Entonces, agregué a la hoja de estilo. Puede acceder a la hoja de estilo a través de «Atom => Abrir su hoja de estilo».

Estas pocas líneas CSS conducen a una marca significativamente más clara del Bracket Matcher.

Los desarrolladores experimentados pueden ajustar todo, ya que también se puede acceder al código fuente de Atom a través de la página de GitHub para el proyecto. Los usuarios menos experimentados pueden usar paquetes, temas y tal vez el ajuste de CSS para personalizar el editor.

Funciones especiales del editor HTML de Atom

Soporte de Node.js

La compatibilidad con Node.js facilita el acceso al sistema de archivos y genera subprocesos. Incluso puede iniciar un servidor desde el editor. Si necesita una biblioteca, puede elegir entre más de 50 000 en el repositorio de paquetes de Node. La perfecta integración permite una combinación gratuita de API de nodo y navegador. Obtendrá esto y mucho más al integrar Node.js.

Diseño modular

Atom se compone de más de 50 paquetes de código abierto que se integran en torno a un código central mínimo. Los desarrolladores querían crear un sistema profundamente extensible que desdibujara la distinción entre usuario y desarrollador. Si no le gustan partes de Atom o quiere ampliarlas, (teóricamente) crea su propio paquete. Al cargarlo en el directorio del paquete, será accesible para todos.

Funciones básicas del editor Atom

Atom ofrece funciones útiles listas para usar. Como los hay:

• Un navegador de sistema de archivos
• Un buscador difuso para abrir archivos rápidamente
• Búsqueda y reemplazo rápidos en todo el proyecto
• Múltiples cursores y selecciones
• Múltiples ventanas (paneles)
• Compatibilidad con fragmentos
• plegado de código
• Una superficie de fraguado limpia y clara
• Funciones de importación para TextMate (gramática y temas)
• Apoyo para el trabajo del proyecto.
• Buen resaltado de sintaxis
• Diseño limpio y claro
• Un modo de desarrollador
• Comandos de shell
• Una paleta de comandos

Algunas capturas de pantalla adicionales

Vista de desarrollador de Atom

Finalización de código

Configuración del proyecto (barra lateral izquierda: haga clic con el botón derecho en el archivo)

Conclusión

Realmente me gusta el editor Atom HTML porque no solo ofrece varias funciones útiles listas para usar. Además, puede instalar fácilmente extensiones y temas para ajustar y ampliar el editor. a tus necesidades sin ningún problema. Ni siquiera necesitas saber cómo usar Git. Todavía no lo he probado con proyectos grandes. Sin embargo, para proyectos “ordinarios”, es perfecto.

En comparación con Sublime Text, Atom gana con su fondo de código abierto. No hay mucho que perderse cuando cambia de Sublime, pero hay mucho más por lograr. No sé si Atom se inspiró en Sublime o si a los desarrolladores se les ocurrieron todas estas buenas ideas para repensar el concepto de un editor como un todo. Cualquiera que sea el enfoque que tomaron, funcionó muy bien.

enlaces relacionados

• Página de inicio del átomo
• Sitio del proyecto Atom en GitHub
• Documentación del átomo
• Página de inicio del paquete Atom
• Página de inicio de temas Atom

Paquetes Recomendados

• Emmet (anteriormente Zen Coding) – Hace que su flujo de trabajo sea más rápido
• barra-más cerca – Cierra las etiquetas HTML después de ingresar
• Compatibilidad con la API principal de WordPress – Extiende el editor Atom por etiquetas de WordPress
• lenguaje-php – Extensión para una mejor experiencia de trabajo con PHP
• bloqueador de documentos – Hace que sea más fácil escribir comentarios sobre, por ejemplo, funciones de PHP
• autocompletar-plus – Muestra posibles terminaciones mientras escribe

(dpe)