Inicio rápido: Creación de la primera aplicación web de Python con Visual Studio

En esta introducción a Visual Studio como un IDE de Python, con una duración de entre 5 y 10 minutos, creará una sencilla aplicación web Python basada en el marco Flask. El proyecto se crea mediante discretos pasos que le ayudarán a conocer las características básicas de Visual Studio.

Si todavía no ha instalado Visual Studio, vaya a la página de descargas de Visual Studio para instalarlo de forma gratuita. En el instalador, asegúrese de seleccionar la carga de trabajo Desarrollo de Python.

Si todavía no ha instalado Visual Studio, vaya a la página de descargas de Visual Studio para instalarlo de forma gratuita. En el instalador, asegúrese de seleccionar la carga de trabajo Desarrollo de Python.

Si todavía no ha instalado Visual Studio, vaya a la página de descargas de Visual Studio para instalarlo de forma gratuita. En el Instalador de Visual Studio, seleccione la carga de trabajo Desarrollo de Python y, en los detalles de instalación, seleccione Compatibilidad web con Python.

Captura de pantalla del Instalador de Visual Studio con la carga de trabajo Desarrollo de Python y la opción Compatibilidad web con Python seleccionada.

<a name="create-the-project">Crear el proyecto

Los pasos siguientes crean un proyecto vacío que actúa como un contenedor para la aplicación:

::: moniker range="vs-2017"

  1. Abra Visual Studio 2017.

  2. En la barra de menús superior, elija Archivo > Nuevo > Proyecto.

  3. En el cuadro de diálogo Nuevo proyecto, escriba "Proyecto web de Python" en el campo de búsqueda situado en la parte superior derecha, elija Proyecto Web en la lista del medio, asigne un nombre al proyecto (por ejemplo, "HelloPython") y luego elija Aceptar.

    Cuadro de diálogo Nuevo proyecto con Proyecto web de Python seleccionado

    Si no ve las plantillas de proyecto de Python, ejecute el Instalador de Visual Studio, seleccione Más> Modificar, seleccione la carga de trabajo Desarrollo de Python y, a continuación, elija Modificar.

    Carga de trabajo de desarrollo de Python en el instalador de Visual Studio

  4. El nuevo proyecto se abre en el panel de la derecha del Explorador de soluciones. En este momento el proyecto está vacío porque no contiene ningún otro archivo.

    Explorador de soluciones con el proyecto vacío recién creado ::: moniker-end

  1. Abra Visual Studio 2019.

  2. En la pantalla de inicio, seleccione Crear un nuevo proyecto.

  3. En el cuadro de diálogo Crear un nuevo proyecto, escriba "Web de Python" en el campo de búsqueda en la parte superior, elija Proyecto web en la lista del medio y, a continuación, seleccione Siguiente:

    Creación de una nueva pantalla de proyecto con Proyecto web de Python seleccionado Si no ve las plantillas de proyecto de Python, ejecute el Instalador de Visual Studio, seleccione Más > Modificar, seleccione la carga de trabajo Desarrollo de Python y, a continuación, elija Modificar.

    Carga de trabajo de desarrollo de Python en el instalador de Visual Studio

  4. En el cuadro de diálogo Configure su nuevo proyecto que sigue, escriba "HelloPython" para Nombre del proyecto, especifique una ubicación y seleccione Crear. (El valor Nombre de la solución se establece automáticamente para que coincida con el Nombre del proyecto).

    Cuadro de diálogo Configure su nuevo proyecto

  5. El nuevo proyecto se abre en el panel de la derecha del Explorador de soluciones. En este momento el proyecto está vacío porque no contiene ningún otro archivo.

    Captura de pantalla en la que se muestra el proyecto vacío recién creado en el Explorador de soluciones.

  1. Abra Visual Studio 2022.

  2. En la pantalla de inicio, seleccione Crear un nuevo proyecto.

  3. En el cuadro de diálogo Crear un proyecto, escriba "Web de Python" en el campo de búsqueda en la parte superior. Elija Proyecto web en la lista y, a continuación, seleccione Siguiente:

    Captura de pantalla en la que se muestra la pantalla Crear un proyecto con la opción Proyecto web de Python seleccionada.

    Si no ve las plantillas de proyectos web de Python, seleccione Herramientas > Obtener herramientas y características para ejecutar el Instalador de Visual Studio. En el Instalador, seleccione la carga de trabajo Desarrollo de Python y, en Detalles de la instalación, seleccione Compatibilidad web con Python. Después, seleccione Modificar.

  4. En el cuadro de diálogo Configure el nuevo proyecto, escriba "HelloPython" para Nombre del proyecto, especifique una ubicación y seleccione Crear. El Nombre de la solución se actualiza automáticamente para coincidir con el Nombre del proyecto.

    Captura de pantalla en la que se muestra el cuadro de diálogo Configurar el nuevo proyecto.

El nuevo proyecto se abre en el panel de la derecha del Explorador de soluciones. En este momento el proyecto está vacío porque no contiene ningún otro archivo.

Captura de pantalla en la que se muestra el Explorador de soluciones con el proyecto vacío recién creado.

Pregunta: ¿Cuál es la ventaja de crear un proyecto en Visual Studio para una aplicación de Python?

Respuesta: las aplicaciones de Python suelen definirse usando solo carpetas y archivos, pero esta estructura sencilla puede resultar engorrosa a medida que aumenta el tamaño de las aplicaciones. Las aplicaciones pueden contener archivos generados automáticamente, JavaScript para aplicaciones web y otros componentes. Un proyecto de Visual Studio le ayuda a administrar esta complejidad.

El proyecto, un archivo .pyproj, identifica los archivos de origen y contenido asociados con el proyecto. El archivo .pyproj contiene información de compilación de cada archivo, mantiene la información para integrarse con sistemas de control de código fuente y ayuda a organizar la aplicación en componentes lógicos.

Pregunta: ¿Qué es la "solución" que se muestra en el Explorador de soluciones?

Respuesta: una solución de Visual Studio es un contenedor que le ayuda a administrar uno o varios proyectos relacionados como un grupo. La solución almacena valores de configuración que no son específicos de un proyecto. Los proyectos de una solución también pueden hacer referencia entre sí. Por ejemplo, la ejecución de un proyecto de aplicación de Python puede compilar automáticamente un segundo proyecto, como una extensión de C++ que usa la aplicación de Python.

Instalación de la biblioteca de Flask

En las aplicaciones web de Python casi siempre se usa una de las muchas bibliotecas de Python disponibles para controlar detalles de bajo nivel como el enrutamiento de solicitudes web y la forma de las respuestas. Visual Studio proporciona muchas plantillas para aplicaciones web. Usará una de estas plantillas más adelante en este inicio rápido.

Utilice los pasos siguientes para instalar la biblioteca de Flask en el entorno global predeterminado que Visual Studio usa para este proyecto.

  1. Expanda el nodo Entornos de Python en el proyecto para ver el entorno predeterminado para el proyecto.

    Explorador de soluciones en el que se muestra el entorno predeterminado

  2. Haga clic con el botón derecho en el entorno y seleccione Instalar paquete de Python. Este comando abre la ventana Entornos de Python por la pestaña Paquetes.

  3. Escriba "flask" en el campo de búsqueda y seleccione instalación de PIP flask desde PyPI. Acepte los mensajes de privilegios de administrador y observe el progreso en la ventana Salida de Visual Studio. (Se le pedirá confirmación de elevación cuando la carpeta de paquetes del entorno global esté ubicada en un área protegida, como C:\Archivos de programa).

    Instalación de la biblioteca de Flask con pip install

  1. Expanda el nodo Entornos de Python en el proyecto para ver el entorno predeterminado para el proyecto.

    Explorador de soluciones en el que se muestra el entorno predeterminado

  2. Haga clic con el botón derecho en el entorno y seleccione Administrar paquetes de Python... . Este comando abre la ventana Entornos de Python en la pestaña Paquetes (PyPI) .

  3. En el campo de búsqueda, escriba "flask". Si Flask aparece debajo del cuadro de búsqueda, puede omitir este paso. En caso contrario, seleccione Comando de ejecución: pip install flask. Acepte los mensajes de privilegios de administrador y observe el progreso en la ventana Salida de Visual Studio. (Se le pedirá confirmación de elevación cuando la carpeta de paquetes del entorno global esté ubicada en un área protegida, como C:\Archivos de programa).

    Instalación de la biblioteca de Flask con pip install

  1. Expanda el nodo Entornos de Python en el proyecto para ver el entorno predeterminado para el proyecto.

    Captura de pantalla en la que se muestra el entorno predeterminado en el Explorador de soluciones.

  2. Haga clic con el botón derecho en el entorno y seleccione Administrar paquetes de Python. Este comando abre la ventana Entornos de Python en la pestaña Paquetes (PyPI).

  3. En el campo de búsqueda, escriba "flask". Si Flask aparece debajo del cuadro de búsqueda, puede omitir este paso. En caso contrario, seleccione Comando de ejecución: pip install flask.

    Captura de pantalla en la que se muestra cómo instalar la biblioteca de Flask mediante pip install.

    Aparece un aviso de elevación si la carpeta de paquetes del entorno global está en un área protegida, como C:\Archivos de programa. Acepte las solicitudes de privilegios de administrador. Consulte la ventana Salida de Visual Studio para ver el progreso.

Una vez instalada, la biblioteca aparece en el entorno en el Explorador de soluciones, lo que significa que puede usarla en el código de Python.

Biblioteca de Flask instalada y mostrada en el Explorador de soluciones

Biblioteca de Flask instalada y mostrada en el Explorador de soluciones

Captura de pantalla en la que se muestra la biblioteca de Flask instalada en el Explorador de soluciones.

Nota

En lugar de instalar las bibliotecas en el entorno global, los desarrolladores suelen crear un "entorno virtual" en el que se instalan las bibliotecas de un proyecto específico. Las plantillas de Visual Studio normalmente ofrecen esta opción, como se describe en Inicio rápido: Crear un proyecto de Python desde una plantilla en Visual Studio.

Pregunta: ¿Dónde puedo obtener más información sobre otros paquetes de Python disponibles?

Respuesta: Visite el índice de paquetes de Python.

Agregar un archivo de código

Ahora está listo para agregar un poco de código de Python para implementar una aplicación web básica.

  1. Haga clic con el botón derecho en el Explorador de soluciones y seleccione Agregar > Nuevo elemento.

  2. En el cuadro de diálogo que aparece, seleccione Archivo de Python vacío, asígnele el nombre app.py y seleccione Agregar. Visual Studio abre automáticamente el archivo en una ventana del editor.

  3. Copie el siguiente código y péguelo en app.py:

    from flask import Flask
    
    # Create an instance of the Flask class that is the WSGI application.
    # The first argument is the name of the application module or package,
    # typically __name__ when using a single module.
    app = Flask(__name__)
    
    # Flask route decorators map / and /hello to the hello function.
    # To add other resources, create functions that generate the page contents
    # and add decorators to define the appropriate resource locators for them.
    
    @app.route('/')
    @app.route('/hello')
    def hello():
        # Render the page
        return "Hello Python!"
    
    if __name__ == '__main__':
        # Run the app server on localhost:4449
        app.run('localhost', 4449)
    
  1. Haga clic con el botón derecho en el Explorador de soluciones y seleccione Agregar > Nuevo elemento.

  2. En el cuadro de diálogo que aparece, seleccione vacío. En Nombre, escriba app.py y seleccione Agregar. Visual Studio abre automáticamente el archivo en una ventana del editor.

  3. Copie el siguiente código y péguelo en app.py:

    from flask import Flask
    
    # Create an instance of the Flask class that is the WSGI application.
    # The first argument is the name of the application module or package,
    # typically __name__ when using a single module.
    app = Flask(__name__)
    
    # Flask route decorators map / and /hello to the hello function.
    # To add other resources, create functions that generate the page contents
    # and add decorators to define the appropriate resource locators for them.
    
    @app.route('/')
    @app.route('/hello')
    def hello():
        # Render the page
        return "Hello Python!"
    
    if __name__ == '__main__':
        # Run the app server on localhost:4449
        app.run('localhost', 4449)
    

Puede haber observado que el cuadro de diálogo Agregar > Nuevo elemento muestra muchos otros tipos de archivos que puede agregar a un proyecto de Python, como una clase de Python, un paquete de Python, una prueba unitaria de Python, archivos web.config, etc. En general, estas plantillas de elemento son una excelente manera de crear rápidamente archivos con código reutilizable útil.

Pregunta: ¿Dónde puedo obtener más información sobre Flask?

Respuesta: Consulte la documentación de Flask, empezando por el inicio rápido de Flask.

Ejecutar la aplicación

  1. En el Explorador de soluciones, haga clic con el botón derecho en app.py y después seleccione Establecer como archivo de inicio en el menú desplegable. Este comando identifica el archivo de código que se va a iniciar en Python cuando se ejecuta la aplicación.

    Establecimiento del archivo de inicio para un proyecto en el Explorador de soluciones

    Establecimiento del archivo de inicio para un proyecto en el Explorador de soluciones

    Captura de pantalla en la que se muestra la configuración del archivo de inicio para un proyecto en el Explorador de soluciones.

  2. Haga clic con el botón derecho en el proyecto en el Explorador de soluciones y seleccione Propiedades. Seleccione la pestaña Depurar en el menú Propiedades y establezca la propiedad Número de puerto en 4449. Esta configuración garantiza que Visual Studio inicia un explorador con localhost:4449 para que coincida con los argumentos app.run en el código.

  3. Seleccione Depurar > Iniciar sin depurar o presione Ctrl+F5 para guardar los cambios en los archivos y ejecutar la aplicación.

  4. Aparece una ventana de comandos con el mensaje Ejecutando en https://localhost:4449. Se abre una ventana del explorador en localhost:4449 y se muestra el mensaje Hello, Python! . La solicitud GET también aparece en la ventana de comandos con un estado de 200.

    Si un explorador no se abre automáticamente, inicie el explorador que quiera y vaya a localhost:4449.

    Si ve solo el shell interactivo de Python en la ventana de comandos, o si esa ventana parpadea brevemente en la pantalla, asegúrese de que app.py está establecido como el archivo de inicio.

  5. Vaya a localhost:4449/hello para comprobar que el elemento decorador para el recurso /hello también funciona. Una vez más, la solicitud GET aparece en la ventana de comandos con un estado de 200. Pruebe también algunas otras direcciones URL para ver que muestran los códigos de estado 404 en la ventana de comandos.

  6. Cierre la ventana de comandos para detener la aplicación y, después, cierre la ventana del explorador.

Pregunta: ¿Cuál es la diferencia entre los comandos Iniciar sin depurar e Iniciar depuración?

Respuesta: Iniciar depuración se usa para ejecutar la aplicación en el contexto del depurador de Visual Studio. Con el depurador, puede establecer puntos de interrupción, examinar variables y recorrer el código línea a línea. Las aplicaciones se pueden ejecutar más lentamente en el depurador debido a los enlaces que hacen posible la depuración.

Iniciar sin depurar ejecuta la aplicación directamente, como si la ejecutara desde la línea de comandos, sin contexto de depuración. Iniciar sin depurar también inicia automáticamente un explorador y navega a la dirección URL especificada en la pestaña Depurar de las propiedades del proyecto.

Pasos siguientes

Enhorabuena por ejecutar su primera aplicación de Python desde Visual Studio. Ha aprendido los aspectos básicos sobre el uso de Visual Studio como un IDE de Python.

Dado que los pasos realizados en este inicio rápido son bastante genéricos, probablemente se ha dado cuenta de que se pueden y deben automatizar. Tal automatización es el rol de las plantillas de proyecto de Visual Studio. Consulte Inicio rápido: Crear un proyecto de Python desde una plantilla para crear una aplicación web similar a la de este artículo, pero con menos pasos.

Para continuar con un tutorial más completo sobre Python en Visual Studio, incluido el uso de la ventana interactiva, depuración, visualización de datos y trabajar con Git, vea Tutorial: Introducción a Python en Visual Studio.

Para explorar más de lo que Visual Studio ofrece, seleccione los siguientes vínculos.