Tutorial: Trabajar con el marco web de Django en Visual Studio

Este artículo es el primer paso de una serie de tutoriales de cinco partes que muestra cómo trabajar con Django en Visual Studio. django es un marco de Python de alto nivel diseñado para el desarrollo web rápido, seguro y escalable. Visual Studio proporciona plantillas de proyecto que puede usar para simplificar la creación de aplicaciones web basadas en Django. En esta serie de tutoriales se explora el marco django en el contexto de las plantillas de proyecto de Visual Studio.

En el paso 1 del tutorial, aprenderá a:

• Creación de un proyecto de aplicación web de Django mediante la plantilla Proyecto web de Django en blanco
• Examen del código reutilizable y ejecución de la aplicación
• Creación de un repositorio de Git para la aplicación web de Django
• Trabajar con controles de código fuente de Git
• Creación de un entorno virtual para la aplicación web de Django

Prerrequisitos

• Visual Studio 2022 en Windows con las siguientes opciones seleccionadas en el Instalador de Visual Studio:

  • En la pestaña Cargas de trabajo, selecciona la opción Desarrollo de Python. Para obtener más información, consulte Instalación de compatibilidad con Python en Visual Studio.

  • En la pestaña componentes individuales en Herramientas de código, selecciona la opción Git para Windows.

Las plantillas de proyecto de Django en Visual Studio se incluyen con todas las versiones anteriores de Python Tools para Visual Studio. Los detalles de la plantilla pueden diferir de las descripciones de esta serie de tutoriales, especialmente para versiones anteriores del marco web de Django.

Visual Studio para Mac no es compatible. Para obtener más información, consulte ¿Qué ocurre con Visual Studio para Mac? Visual Studio Code en Windows, Mac y Linux funciona bien con Python a través de extensiones disponibles.

Proyectos de Visual Studio y proyectos de Django

En la terminología de Django, un proyecto de Django tiene varios archivos de configuración de nivel de sitio junto con una o varias "aplicaciones". Para crear una aplicación web completa, puede implementar estas aplicaciones en un host web. Un proyecto de Django puede contener varias aplicaciones y la misma aplicación puede estar en varios proyectos de Django.

Un proyecto de Visual Studio puede contener el proyecto de Django junto con varias aplicaciones. En esta serie de tutoriales, el término "proyecto" hace referencia al proyecto de Visual Studio. Cuando el contenido hace referencia a la parte "Proyecto de Django" de la aplicación web, se hace referencia específicamente a un "proyecto de Django".

Creación de un proyecto y una solución de Visual Studio

En el paso 1 de esta serie de tutoriales, creará una única solución de Visual Studio para contener varios proyectos de Django. Cada proyecto contiene una sola aplicación de Django. Los proyectos se crean mediante diferentes plantillas de proyecto de Django incluidas con Visual Studio. Al mantener los proyectos en la misma solución, puede cambiar fácilmente entre archivos diferentes para la comparación.

Al trabajar con Django desde la línea de comandos, normalmente se inicia un proyecto ejecutando el comando django-admin startproject <project_name>. En Visual Studio, la plantilla "Proyecto Django Web en blanco" proporciona la misma estructura dentro de un proyecto y una solución de Visual Studio.

Siga este procedimiento para crear la solución y el proyecto:

1. En Visual Studio, seleccione Archivo>Nuevo proyecto de> y busque "Django". A continuación, seleccione la plantilla Proyecto web de Django en blanco y seleccione Siguiente.

   

2. Configure el nuevo proyecto y la solución:

   1. Establece el Nombre del proyecto de Visual Studio en BasicProject. Este nombre también se usa para el proyecto de Django.

   2. Especifique la Ubicación para Visual Studio para guardar la solución y el proyecto.

   3. Desactive la opción de colocar solución y proyecto en el mismo directorio.

   4. Establece el Nombre de la solución en LearningDjango. La solución sirve como contenedor para varios proyectos de esta serie de tutoriales.

3. Selecciona Crear.

4. Después de un momento, Visual Studio muestra el aviso Archivo de especificación del paquete de Python "requirements.txt" se detectó en el proyecto "BasicProject".:

   

   El cuadro de diálogo indica que la plantilla seleccionada incluye un archivo requirements.txt que puede usar para crear un entorno virtual para el proyecto.

5. Seleccione la X a la derecha para cerrar la ventana emergente. Más adelante en este tutorial, creará el entorno virtual y garantizará que el control de código fuente excluya el entorno. (El entorno siempre se puede crear más adelante a partir del archivo requirements.txt).

Examen de los controles de Git

En el siguiente procedimiento, se familiarizará con la compatibilidad de Visual Studio con el control de código fuente de Git.

Importante

En Visual Studio 2019 y versiones posteriores, la experiencia de control de versiones de Git está activada de forma predeterminada. Si quiere obtener más información sobre cómo se compara con Team Explorer, consulte la página de Comparación en paralelo de Git y Team Explorer.

Si prefiere seguir usando Team Explorer en versiones anteriores de Visual Studio, vaya a Herramientas>Opciones>Entorno>Características en versión preliminar y active la casilla Nueva experiencia de usuario de Git.

1. Para confirmar el proyecto en el control de código fuente local, seleccione Agregar al control de código fuente en la parte inferior derecha de la ventana principal de Visual Studio y, a continuación, seleccione Git:

   

   Se abre la ventana Crear repositorio de Git, donde puede crear y empujar un nuevo repositorio.

2. Después de crear un repositorio, la barra de controles de Git aparece en la parte inferior derecha de la ventana principal de Visual Studio:

   

   De izquierda a derecha, la barra de controles de Git muestra el número de confirmaciones salientes o entrantes (flechas #/#), el número de cambios no confirmados (lápiz #), el nombre de la rama actual y el nombre del repositorio actual. Los controles git también están disponibles en el menú git de la barra de herramientas principal.

3. En la barra de controles de Git, seleccione los cambios (lápiz #) para abrir la ventana Cambios de Git. También puede seleccionar Ver>Cambios de Git (Ctrl+O, Ctrl+G):

   

   En esta ventana se muestran detalles sobre los cambios no confirmados, incluidos los cambios guardados. Dado que el proyecto recién creado ya se ha confirmado automáticamente en el control de código fuente, no verá cambios pendientes.

4. En la barra de controles de Git, seleccione las confirmaciones (flechas #/#) y, a continuación, seleccione Ver todas las confirmaciones:

   

   Se abre la ventana del repositorio de Git. También puede seleccionar Ver>Repositorio de Git (Ctrl+O, Ctrl+R):

   

   En esta ventana se muestran los detalles del repositorio actual en el panel izquierdo y la rama actual con confirmaciones salientes y entrantes en el panel derecho.

   Para ver la vista de diferencias del archivo, seleccione una confirmación en el panel central. La versión anterior se muestra en el lado izquierdo y la versión revisada se muestra en el lado derecho. Los detalles también contienen el autor del cambio, el confirmador de cambios y el mensaje de confirmación.

A medida que trabaje con esta serie de tutoriales, póngase en el hábito de usar periódicamente los controles de Git en Visual Studio para confirmar e insertar cambios. Los Pasos del tutorial se lo recuerdan en los momentos adecuados.

Uso del control de código fuente desde el principio

Hay varias ventajas para usar el control de código fuente desde el principio de un proyecto. Cuando se usa el control de código fuente desde el inicio de un proyecto, especialmente si también se usa un repositorio remoto, se obtiene una copia de seguridad normal fuera del sitio del proyecto. A diferencia de mantener un proyecto justo en un sistema de archivos local, el control de código fuente también proporciona un historial de cambios completo y la fácil capacidad de revertir un solo archivo o todo el proyecto a un estado anterior. El historial de cambios ayuda a determinar la causa de las regresiones (errores de prueba).

El control de código fuente es esencial si varias personas trabajan en un proyecto, ya que administra sobrescrituras y proporciona resolución de conflictos. El control de código fuente es fundamentalmente una forma de automatización, lo que le permite automatizar compilaciones, pruebas y administración de versiones. Es el primer paso para usar Azure DevOps para un proyecto y, dado que las barreras para la entrada son tan bajas, realmente no hay ninguna razón para no usar el control de código fuente desde el principio.

Para obtener más información sobre el control de código fuente como automatización, vea The Source of Truth: The Role of Repositories in DevOps, un artículo de MSDN Magazine escrito para aplicaciones móviles que también se aplica a las aplicaciones web.

Impedir que Visual Studio confirme automáticamente proyectos

Siga estos pasos para evitar que Visual Studio confirme automáticamente un nuevo proyecto:

1. Seleccione Herramientas>Opciones>Control de código fuente>Configuración global de Git.

2. Desactive la opción Confirmar cambios después de combinar de forma predeterminada y seleccione Aceptar.

Creación de un entorno virtual y exclusión del control de código fuente

Después de configurar el control de código fuente para el proyecto, puede crear el entorno virtual con los paquetes de Django necesarios que requiere el proyecto. A continuación, puede usar la ventana Cambios de Git para excluir la carpeta del entorno del control de código fuente.

1. En el Explorador de soluciones, haz clic con el botón derecho en el nodo Entornos de Python y selecciona Agregar entorno.

   

2. En el cuadro de diálogo Agregar entorno, seleccione Crear para aceptar los valores predeterminados. (Puede cambiar el nombre del entorno virtual si lo desea, lo cual cambiará el nombre de su subcarpeta, pero env es una convención estándar).

   

3. Si Visual Studio solicita privilegios de administrador, proporcione su consentimiento. Espere varios minutos mientras Visual Studio descarga e instala paquetes. Para Django y sus dependencias, el proceso puede requerir expandirse cerca de 1000 archivos en más de 100 subcarpetas. Puedes ver el progreso en la ventana de Salida de Visual Studio.

4. En la barra de controles de Git, seleccione los cambios no confirmados (que ahora muestra 99+) para abrir la ventana Cambios de Git:

   

   La creación del entorno virtual aporta miles de cambios, pero no es necesario incluirlos en el control de código fuente. Usted o cualquier otra persona que clone el proyecto siempre puede volver a crear el entorno mediante el archivo requirements.txt.

5. Para excluir el entorno virtual del control de código fuente, en la ventana Cambios de Git, haga clic con el botón derecho en la carpeta env y seleccione Omitir estos elementos locales:

   

   Después de excluir el entorno virtual, los únicos cambios restantes son en el archivo de proyecto (.py) y el archivo .gitignore , que contiene una entrada agregada para la carpeta del entorno virtual.

   Para ver la vista de diferencias del archivo .gitignore, haga doble clic en el archivo en la ventana Cambios de Git .

6. En la ventana Cambios de Git, escriba un mensaje de confirmación, como "Cambios iniciales del proyecto":

   

7. En el menú desplegable Confirmar, seleccione Confirmar provisional y enviar cambios.

Puedes abrir la ventana del repositorio de Git y confirmar que las confirmaciones almacenadas provisionalmente se muestran en el historial local para la rama actual.

Descripción del propósito de los entornos virtuales

Un entorno virtual es una excelente manera de aislar las dependencias exactas de la aplicación. Este método de aislamiento evita conflictos dentro de un entorno global de Python y ayuda tanto a las pruebas como a la colaboración. Con el tiempo, a medida que desarrolla una aplicación, indefectiblemente aporta muchos paquetes de Python útiles. Al mantener los paquetes en un entorno virtual específico del proyecto, puede actualizar fácilmente el archivo requirements.txt del proyecto que describe ese entorno, que se incluye en el control de código fuente. Al copiar el proyecto en otros equipos, incluidos los servidores de compilación, los servidores de implementación y otros equipos de desarrollo, es fácil volver a crear el entorno. Puede volver a crear el entorno usando solo el archivo requirements.txt, por lo que el entorno no necesita estar en el control de código fuente. Para obtener más información, consulte Uso de entornos virtuales.

Eliminación del entorno virtual en el control de código fuente

Puede quitar un entorno virtual después de que esté bajo el control de código fuente. Siga estos pasos:

1. Edite el archivo de .gitignore para excluir la carpeta:

   1. Abra el archivo seleccionando Archivo>Abrir archivo>.

      También puede abrir el archivo desde Team Explorer. En la página Configuración, seleccione Configuración del repositorio. Vaya a la sección Ignore & Attributes Files (Archivos de omisión y de atributos) y seleccione el vínculo Editar situado junto a .gitignore.

   2. Busque la sección al final que tiene el comentario # Python Tools for Visual Studio (PTVS).

   3. Después de esa sección, agregue una nueva línea para la carpeta del entorno virtual, como /BasicProject/env.

2. Abra una ventana de comandos y vaya a la carpeta (por ejemplo, BasicProject) que tenga la carpeta del entorno virtual, como env.

3. Ejecute el comando git rm -r env para quitar el entorno virtual que está actualmente bajo control de código fuente.

4. Confirma los cambios con el comando git commit -m 'Remove venv' o confírmalos desde la página Cambios de Team Explorer.

Examen del código boilerplate

En esta sección, examinará el código estándar en el archivo Project (.py) que Visual Studio crea en función de la selección de plantilla.

Nota

El código genérico es el mismo si crea el proyecto en Visual Studio a partir de la plantilla de Django o genera el proyecto mediante el comando de la CLI django-admin startproject <project_name>.

1. Abra Explorador de soluciones para ver los archivos de la solución y del proyecto. El proyecto inicial contiene solo dos archivos, manage.py y requirements.txt:

   

   El archivo requirements.txt especifica las dependencias del paquete de Django. La presencia de este archivo es lo que le invita a crear un entorno virtual al crear el proyecto por primera vez.

   El archivo manage.py es la utilidad administrativa de la línea de comandos de Django que Visual Studio establece automáticamente como archivo de inicio del proyecto. Ejecute la utilidad en la línea de comandos mediante python manage.py <command> [options] comando.

   Para tareas comunes de Django, Visual Studio proporciona comandos de menú cómodos. Haga clic con el botón derecho en el proyecto en Explorador de Soluciones y seleccione Python para ver la lista de comandos. En esta serie de tutoriales se usan varios de estos comandos.

2. Además de los dos archivos, el proyecto también tiene una subcarpeta con el mismo nombre que el proyecto. Esta carpeta contiene los archivos de proyecto básicos de Django:

   

   • __init__.py: un archivo vacío que indica a Python que esta carpeta es un paquete de Python.
   • settings.py: la configuración del proyecto de Django, que se modifica al desarrollar una aplicación web.
   • urls.py: una tabla de contenido para el proyecto de Django, que se modifica a medida que desarrolla la aplicación web.
   • wsgi.py: punto de entrada para los servidores web compatibles con WSGI para servir el proyecto. Normalmente dejarás los archivos tal cual, puesto que sirven de enlace a los servidores web de producción.

Generación de requisitos después de la instalación del paquete

Visual Studio puede generar un archivo requirements.txt desde un entorno virtual después de instalar otros paquetes.

• En Explorador de Soluciones, expanda el nodo Entornos de Python, haga clic con el botón derecho en su entorno virtual y seleccione Generar requirements.txt.

Se recomienda usar este comando periódicamente a medida que se modifica el entorno. Confirme los cambios en el archivo requirements.txt en el control de código fuente junto con cualquier otro cambio de código que dependa de ese entorno. Si configura la integración continua en un servidor de compilación, debe generar el archivo y confirmar los cambios siempre que modifique el entorno.

Ejecución del proyecto

Ahora está listo para ejecutar el proyecto en Visual Studio siguiendo este procedimiento:

1. En Visual Studio, seleccione Depurar>Iniciar depuración (F5) o seleccione servidor web en la barra de herramientas principal (el explorador que ve puede variar):

   

2. Cualquiera de los comandos ejecuta el servidor mediante el comando manage.py runserver <port>, que inicia el servidor web integrado en Django.

   El código inicia la aplicación mediante el puerto especificado dentro del servidor de desarrollo de Django.

   Si Visual Studio publica el mensaje No se pudo iniciar el depurador e indica que no se encuentra ningún archivo de inicio, haga clic con el botón derecho en el archivo manage.py en explorador de soluciones y seleccione Establecer como archivo de inicio.

3. Cuando se inicia el servidor, se abre una ventana de consola para mostrar el registro del servidor. Visual Studio abre automáticamente un explorador para http://localhost:<port>. Dado que el proyecto de Django no tiene aplicaciones, Django muestra solo una página predeterminada para confirmar que el código actual funciona según lo previsto.

   

4. Cuando haya terminado, cierre la ventana de la consola, que detiene el servidor de desarrollo de Django. También puede seleccionar Depurar>Detener la depuración.

Uso del servidor web y el marco de trabajo de Django

Django tiene un servidor web integrado que puede usar para fines de desarrollo. Al ejecutar la aplicación web de Django localmente, se usa el servidor de desarrollo web de Django integrado. Un ejemplo de este escenario es cuando se depura la aplicación web de Django en Visual Studio.

Al implementar la aplicación web de Django en un host web, se usa el servidor web en el host en lugar del servidor web integrado de Django. El módulo wsgi.py del proyecto django se encarga de enlazar a los servidores de producción.

Comparar los comandos de depuración con los comandos de Python del proyecto.

Hay una diferencia entre usar los comandos del menú de depuración y los comandos de servidor enumerados en el submenú Python del proyecto.

Además de los comandos de menú de depuración y los botones de la barra de herramientas, también puede iniciar el servidor a través de los comandos del menú contextual del proyecto: Python>Iniciar servidor o Python>Iniciar el servidor de depuración.

Ambos comandos abren una ventana de consola en la que se ve la dirección URL local (localhost:port) para el servidor en ejecución. Sin embargo, debe abrir manualmente un explorador con esa dirección URL; ejecutar el servidor de depuración no inicia automáticamente el depurador de Visual Studio. Puede adjuntar un depurador al proceso en ejecución, si lo desea, mediante el comando Depurar>Anexar al proceso más adelante.

Paso siguiente

paso 2: Crear una aplicación de Django con vistas y plantillas de página