Kodokon kodokon.com

Instalar y configurar un editor de código

Elige un editor que te vaya bien, instálalo y aplica el puñado de ajustes que lo cambian todo.

6 min · 3 preguntas

Abrir esta lección en Kodokon

Como el código es texto, técnicamente el Bloc de notas serviría. En la práctica, un editor de código te ahorrará muchísimo tiempo y te evitará decenas de errores. No es una herramienta de profesionales reservada a los iniciados: en realidad es cuando empiezas cuando más ayuda, porque señala los descuidos que tu ojo todavía no sabe cazar.

Cuatro funciones justifican por sí solas la instalación. El resaltado de sintaxis muestra las palabras clave, los textos y los números en colores distintos: un texto que olvidaste cerrar salta entonces a la vista. La indentación automática alinea tu código para que la estructura siga siendo legible. El autocompletado sugiere la continuación mientras escribes, lo que acaba con las erratas. Y el subrayado de errores resalta los problemas incluso antes de que hayas ejecutado el programa.

¿Cuál elegir? Para empezar, ve a por Visual Studio Code, que se suele abreviar como VS Code. Es gratuito, funciona en Windows, macOS y Linux, y es con diferencia el más utilizado: todos los tutoriales que leas darán por hecho que lo usas. Descárgalo únicamente desde su sitio oficial, code.visualstudio.com. Dos alternativas por si prefieres otra cosa: Zed y Sublime Text, ambos más ligeros. No te pases tres días comparándolos: tu editor es solo una herramienta, y siempre podrás cambiar más adelante.

La instalación no depara ninguna sorpresa: descarga el archivo, ejecútalo y acepta las opciones predeterminadas. En Windows, una casilla te ofrece añadir la entrada "Abrir con Code" al menú del clic derecho: márcala, es realmente práctica. Al abrirlo por primera vez, el editor te propone un tema claro o uno oscuro. Elige el que más descanse tu vista, no tiene ninguna otra consecuencia.

Este es el hábito más importante de la lección: abre siempre una carpeta, nunca un archivo suelto. Usa Archivo y luego Abrir carpeta, y señala la carpeta de tu proyecto. El editor muestra entonces todo el árbol de archivos en un panel lateral, puede buscar en todos tus archivos a la vez y entiende cómo se relacionan entre sí. Abrir un archivo suelto es como leer una página arrancada de un libro.

JSON
{
  "files.encoding": "utf8",
  "files.eol": "\n",
  "files.autoSave": "afterDelay",
  "editor.tabSize": 2,
  "editor.renderWhitespace": "boundary"
}
Ajustes recomendados de VS Code: UTF-8, finales de línea LF e indentación de 2 espacios.

Prueba de conocimientos

Comprueba que has retenido los puntos clave de esta lección.

  1. ¿Por qué le ayuda el resaltado de sintaxis a un principiante?
    • Hace visibles los errores, como un texto que se ha quedado sin cerrar
    • Hace que el programa se ejecute más rápido
    • Guarda el archivo automáticamente
    • Traduce el código a lenguaje corriente
  2. ¿Qué deberías abrir en tu editor para trabajar en un proyecto?
    • La carpeta del proyecto entera
    • Un solo archivo cada vez
    • El disco completo
  3. ¿Qué actitud hay que tener con las extensiones al principio?
    • No instalar ninguna y luego añadirlas según surja la necesidad
    • Instalar las veinte más populares de entrada
    • Instalarlas todas para no perderse nada