Ejercicio: Personalización de la configuración del editor y del proyecto

Completado

El archivo devcontainer.json le ayuda a configurar varias opciones de la configuración de Visual Studio Code en contenedores. Hasta ahora, ha configurado un contenedor de desarrollo para un proyecto de Python. Sin embargo, todavía hay algunas cuestiones y tareas de configuración que se pueden automatizar aún más.

En este ejercicio, usará el archivo devcontainer.json para facilitar estas cuestiones y hacer que el proyecto funcione sin ningún paso de instalación del desarrollador.

Instalación de extensiones de Visual Studio Code

El contenedor incluye la extensión de Microsoft Python (como puede ver en su imagen base). La extensión Python habilita fragmentos de código, linting e IntelliSense en los archivos de Python. Pero el archivo index.html de la carpeta templates es una plantilla de Jinja y debe instalar otra extensión para obtener el resaltado de sintaxis en ese archivo.

  1. Presione F1 para abrir la paleta de comandos.
  2. Escriba extension y seleccione Extensiones: Instalar extensiones.
  3. En el explorador de extensiones de la derecha, busque jinja.
  4. Seleccione Instalar.
  5. Haga clic con el botón derecho en la extensión Jinja de wholroyd y seleccione Agregar a devcontainer.json.
  6. Vuelva al archivo devcontainer.json y observe que la extensión Jinja se ha agregado a la sección extensions.
  7. Guarde el archivo devcontainer.json.

Automatización de la instalación de dependencias

En este momento, un desarrollador que configure el proyecto por primera vez tiene que saber cómo ejecutar pip3 install --user -r requirements.txt para instalar las dependencias. Sin estas dependencias, el proyecto no se ejecutará y otros desarrolladores podrían no saber por qué.

  1. Quite la marca de comentario de la opción postCreateCommand.

    "postCreateCommand": "pip3 install --user -r requirements.txt"
    
  2. Guarde el archivo devcontainer.json.

El contenedor instalará automáticamente las dependencias cada vez que se cree un contenedor.

Recompilación del nuevo contenedor

  1. Presione F1 para abrir la paleta de comandos.
  2. Escriba rebuild y seleccione Dev Containers: Rebuild Container (Contenedores de desarrollo: Recompilar contenedor).

El contenedor se recompilará con los cambios que haya especificado en el archivo devcontainer.json.

Nota:

Cada vez que se vuelva a generar un contenedor, se quita y se vuelve a crear completamente. El historial de terminales no se conserva cuando se recompila un contenedor.

Examen del resaltado de sintaxis proporcionado por la extensión Jinja

  1. Abra el archivo templates/index.html .

  2. Desplácese hacia abajo hasta la línea 33 y observe que hay resaltado de sintaxis en el bucle for. La extensión Jinja habilita este resaltado de sintaxis.

    Screenshot of a Jinja template, emphasizing a for loop with syntax highlighting.

Ejecución de la aplicación

  1. Presione Ctrl + ` para abrir el terminal integrado de Visual Studio Code.

  2. Ejecute la aplicación mediante el comando siguiente:

    python app.py
    
  3. Tenga en cuenta que no tiene que instalar ninguna dependencia. La aplicación simplemente se ejecuta.

El contenedor se ha personalizado y automatizado para su agencia. Cualquier desarrollador que abra este proyecto mediante Dev Containers puede ejecutarlo inmediatamente y ponerse a trabajar en escribir código.

En la unidad siguiente, aprenderá a instalar software en el contenedor de desarrollo.