() translation by (you can also view the original English article)
En este video voy a presentarte mi nuevo editor de código favorito: Visual Studio Code. Visual Studio es un producto de Microsoft, lo que puede ser una sorpresa para muchos de ustedes, pero pon tus prejuicios a un lado por un momento y únete a mi mientras te muestro.
Visual Studio Code
A lo largo de los años he usado una cantidad de editores de código diferentes; TextMate, Coda, Sublime Text, Atom, y cada uno tenía sus pros y contras. Visual Studio Code, sin embargo, es absolutamente mi favorito hasta ahora, así que echa un vistazo a algunas de sus características.
Comienza descargando la versión para tu sistema (Windows, MacOS, Linux) en code.visualstudio.com (es gratuito también).
UI
Una de las razones por las que me gusta tanto Visual Studio Code es su interfaz; es realmente simple.
Tiene un par de barras laterales, que pueden ser posicionadas a la izquierda o derecha de acuerdo a tu preferencia. El primero te da algunos iconos para cambiar entre paneles. Elige del Explorador, Búsqueda, Git, Depuración y Extensiones. Ve a Vista para cambiar el tipo de display (pantalla completa, modo zen, etc.)
Pasar sobre las carpetas en el Explorador nos da un par de opciones: Nuevo Archivo, Nueva Carpeta, Refrescar y Colapsar Todo. Dar clic derecho trae un menú contextual.
Paleta de Comando
Presiona Shift-Commando-P para traer la Paleta de Comando.
Dentro de este panel, puedes buscar cualquier cosa que quieras para acción rápida y sencilla. Comandos Git, cambiar temas, instalar extensiones--todo puede ser hecho vía la Paleta de Comando.
De manera similar, Comando-P traerá la paleta Ir a archivo...
Terminal
Mantener presionado Comando-` abrirá la terminal integrada, lo cual me encanta.
Esto abre la terminal directamente en la raíz de tu proyecto, ahorrándote tener que navegar. Dar clic en el icono + abre más ventanas de terminal que pueden ser intercambiadas usando el menú desplegable. Todo esto se junta en una característica realmente útil, especialmente si usas compiladores cuando codificas.
Git
Otra característica de la que soy un gran admirador es la integración Git. Los cambios que hagas en tu archivos son resaltados en varios lugares para que sepas exactamente lo que está pasando:
En la figura de arriba puedes ver la barra lateral de notificación diciéndome de un cambio sin comentar, el cambio listado en el panel Git, y una línea resaltada para mostrarme en donde están los cambios en el archivo mismo.
VSC también mostrará comparaciones de versión lado a lado, solo para claridad extra.
Otros comandos Git estándar como sync, pull, etc., estás disponibles desde el panel Git.
Emmet (Zen Coding)
Grandes noticias: Emmet ya está integrado en VSC. No se requiere instalación o configuración, puedes solo comenzar a usarlo (con Tabulador siendo la tecla predefinida para disparar tus códigos pre-definidos) tan pronto abres el editor por primera vez.
Cursores Múltiples
Cuando resaltas una pieza de código en tu archivo, VSC resaltará automáticamente todas las otras ocurrencias de esa cadena. Puedes después presionar Comando-D para agregar otro cursor a la siguiente instancia, o Shift-Comando-L para agregar un cursor a las otras instancias. Edición en masa, fácilmente.
Ajustes
La página de ajustes en VSC es muy intuitiva. Como Sublime Text, los ajustes están almacenados en un archivo (JSON en este caso) que te permite navegar todos los valores por defecto. Al presionar el icono editar después de cada ajuste, lo copiarás a un archivo personalizado en donde puedes hacer cambios:
Presiona Guardar y mira tus cambios efectuarse inmediatamente.
IntelliSense
IntelliSense es una característica dentro de VSC que estaba muy entusiasmado por probar tan pronto abrí el editor. Es un asistente super-cargado para auto-completar y resalte de sintaxis y va un poco más allá de lo que esperarías de este tipo de característica.
Pasar sobre selectores CSS te dará un ejemplo de cómo podrías usar el HTML correspondiente (muy útil para principiantes):
Pasar sobre las propiedades revela documentación sobre qué hacen, y los valores de color están añadidos con pequeñas muestras para mostrarte como aparecen en pantalla. Las sugerencias de código cuando estás tecleando son extremadamente completas también.
Extensiones
Código > Preferencias > Color de Tema abrirá (adivinaste) la paleta de color de tema. Desliza a través de los ejemplos y verás la UI cambiar acordemente. Presiona Enter para hacer esos cambios permanentes.
Más allá de los temas por defecto, también hay un enorme mercado de otros (actualmente gratuitos) ejemplos disponibles, más extensiones de todo tipo con las qué jugar.
Conclusión
Eso concluye algunas de mis características favoritas en Visual Studio Code, basta decir que hay muchas, muchas otras características disponibles para discutir. En términos de mi experiencia usando VSC hasta ahora, solo puedo decir que ha sido positiva. Previamente estaba usando Atom, y no me arrepiento ni un poco de hacer el cambio. Por supuesto, podrías no estar de acuerdo conmigo, pero en mi opinión personal, no te equivocarás al descargar y probar este editor de código.
Enlaces Útiles
