REACT Y ATOM
-
Ve a ‘File’ o ‘Archivo’ y selecciona la opción ‘Setting’ o ‘Configuraciones’
-
En la sección que se abre de ‘Settings’, selecciona la opción ‘Install’ o ‘Instalar’
-
En la barra de búsqueda de paquetes ingresa los términos que deseas buscar. En este caso ‘react’
-
A medida que digitas, aparecerán los resultados. Puedes dar clic en el nombre para visitar el sitio web y cuando estés decidido por alguno solo debes dar clic en el botón ‘Install’.
Encontrarás que existen muchas opciones, sin embargo, el que yo recomiendo es el que dice simplemente ‘react’ (La versión que encuentres puede variar).
Este paquete cuenta con
- Resaltado de sintaxis
- Snippets
- Identación automático.
- Conversión de HTML a JSX
- Opciones de autocompletado
- Muchas más.
-
Espera que la instalación se complete, está puede tardar algunos minutos.
-
Una vez instalado, puedes empezar a usarlo en tus proyectos. Recuerda que puedes inhabilitarlo en cualquier momento seleccionando la opción ‘Disable’
Nota:
El uso de paquetes puede facilitarte mucho la tarea de desarrollo en múltiples lenguajes. Algunos de los que recomiendo en atom son:
- atom-beautify
Para esas veces que por pequeños descuidos escribes tu código un poco desordenado. Puedes arreglarlo usando atom-beauty. Simplemente lo instalas y cuando lo quieras ordenar tu código presionas las teclas Ctrl+Alt+B, la identación del código se hará correctamente para que lo leas más fácil.
- color-picker
Este paquete te permite un color gráficamente para que no te compliques la vida con el código de colores, solo das clic derecho sobre en donde deseas ingresar el color y seleccionas Color Picker.
- pigments
Para que no te compliques a la hora de leer código relacionado con colores. Pigmants te resalta el código de un color justamente con el color al que corresponde.
- file-icons:
muestra iconos diferentes según tipo de archivo
- minimap:
mapa de código a la derecha
- highlight-selected:
Resalta palabras iguales al seleccionar una
- Otros
Te recomiendo que explores estos paquetes
o goto-definition: ir a la definición de una función
o linter: ayuda a resaltar errores
o atom-ternjs: autocompletado JavaScript
Recuerda que:
Según el framework o lenguaje que estés usando, existen montones de paquetes en atom que te ayudarán a agilizar tu desarrollo, solo debes buscar la que más se adapte a tus necesidades.
Gracias por leer este tutorial. Te invito a que compartas con la comunidad que paquetes usas y probar otros para encontrar tu combinación perfecta.
Curso de React.js 2017
