Generare un'app Django e PostgreSQL e distribuirla in Azure

Questo articolo illustra come interagire con GitHub Copilot per generare un'app Web Django locale che esegue operazioni CRUD su un database PostgreSQL. Successivamente, illustra come interagire con GitHub Copilot per Azure per distribuire l'app Web e il database nel servizio app di Azure e nel server flessibile di Azure PostgreSQL (insieme a diversi servizi di Azure di supporto).

L'applicazione specifica creata è un'applicazione semplice di gestione dei contatti che offre operazioni CRUD con un'architettura di stile elenco-dettagli.

Annotazioni

L'uso di un modello LLM (Large Language Model) per generare un'applicazione potrebbe produrre risultati incoerenti. I risultati dipendono dal modello LLM, dalle istruzioni e altro ancora. L'obiettivo di questa guida è aiutare a comprendere come ottenere risultati migliori. Tuttavia, ogni volta che si esegue questo esempio, si ottengono (potenzialmente) risultati notevolmente diversi.

Prerequisiti

Importante

GitHub Copilot è una sottoscrizione separata gestita da GitHub. Per domande relative alle sottoscrizioni e al supporto di GitHub Copilot, vedere Introduzione a un piano di GitHub Copilot.

Preparare la sessione di chat

  1. In Visual Studio Code usare il pulsante Attiva/Disattiva chat nella barra del titolo o premere CTRL+ALT+I per aprire la finestra di chat. Usare l'icona Nuova chat per creare una nuova sessione di chat.

  2. Nell'area della chat, seleziona la modalità Agent. Al momento della stesura di questo articolo, Claude Sonnet 4 restituisce i risultati migliori. Usare il modello migliore disponibile per la generazione di codice.

Convalidare la configurazione

Assicurarsi che gli strumenti dell'interfaccia della riga di comando e Visual Studio Code siano aggiornati, configurati correttamente e che funzionino correttamente per migliorare i risultati.

  1. In una nuova chat immettere il prompt seguente:

    I want to create a new Django website that stores data in PostgreSQL. Then, I'll want
to deploy that new website to Azure. Do I have everything installed on my local
computer that you will need to perform these tasks?

    GitHub Copilot chiederà l'autorizzazione per eseguire una serie di controlli della riga di comando per assicurarsi di disporre degli strumenti, nonché delle versioni più aggiornate di tali strumenti, installate.

  2. Nel tuo terminale, aggiorna interfaccia della riga di comando di Azure con il comando az --upgrade.

  3. Nel terminale installare l'estensione senza password del connettore di servizi per l'interfaccia della riga di comando di Azure con il comando az extension add --name serviceconnector-passwordless --upgrade

  4. In Visual Studio Code impostare il terminale predefinito su Git Bash. Vai a File > Preferenze > Impostazioni, quindi in "Cerca nelle impostazioni" digita "Profilo predefinito: Windows" e seleziona "Git Bash". Potrebbe essere necessario riavviare Visual Studio Code affinché questa impostazione venga applicata.

    Annotazioni

    L'uso di Git Bash non è strettamente necessario, ma al momento della stesura di questo articolo restituisce i risultati migliori.

  5. In Visual Studio Code usare l'estensione PostgreSQL per Visual Studio Code (anteprima) e passare al contacts database.

  6. In Visual Studio Code, usa l'estensione Azure e assicurati di aver effettuato l'accesso al tuo account Azure e alla tua sottoscrizione Azure. Quando si apre l'estensione Di Azure nella barra laterale primaria, dovrebbe essere possibile visualizzare le sottoscrizioni e le risorse esistenti.

  7. Creare una nuova cartella per i nuovi file dell'applicazione e aprirla in Visual Studio Code come area di lavoro.

Configurare il database locale

Anche se GitHub Copilot è in grado di eseguire praticamente qualsiasi attività di sviluppo di applicazioni che gli sviluppatori eseguono in genere, si otterranno i risultati migliori se si eseguono alcune attività in passaggi più piccoli. Per migliorare i risultati, creare il database e configurare l'autenticazione e l'autorizzazione prima di usare GitHub Copilot.

  1. Creare una nuova chat e usare il prompt seguente:

    On my PostgreSQL server localhost, please create a new database named 'contacts'.

Then create a new user <db-username> with password `<password>` and give that
user full rights (create tables and other db objects, CRUD data) to the new
contacts database.

Please do the work, and only prompt me when you are unable to do it yourself.

    Sostituire <db-username> e <password> rispettivamente con il nome utente e la password del database desiderati.

  2. Nei computer Windows, la procedura consigliata per la sicurezza consiste nell'archiviare il nome utente e la password del database in un file locale:

    %APPDATA%\postgresql\pgpass.conf

    Di solito, il percorso seguente punterà a questa posizione sul disco rigido:

    c:\Users\<username>\AppSettings\Roaming\postgresql\pgpass.conf

    Sostituire <username> con il nome utente di Windows.

    Il file deve usare il formato seguente:

    localhost:5432:<database-name>:<database-user>:<password>

    Si presuppone che si stia lavorando con un'istanza di PostgreSQL nel computer locale e che sia ospitata nella porta predefinita (5432).

    Sostituire <database-name> con contacts e sostituire <db-username> e <password> con le credenziali usate nel passaggio precedente.

    Per altre informazioni sul file, vedere la pgpass.confdocumentazione di PostgreSQL.

  3. Aggiungere il percorso al pgpass.conf file nella variabile di ambiente PATH.

  4. Testare la connessione per assicurarsi che funzioni. Usare l'interfaccia della riga di comando di psql per testarla con il comando seguente:

    psql -h localhost -U <db-username> -d contacts

    Sostituire <db-username> con il segmento nome utente del database nel pgpass.conf file.

    Se pgpass.conf non è configurato correttamente, vedrai una richiesta di immettere la password.

Generare un'app con GitHub Copilot

Prima di tutto, vengono fornite istruzioni e indicazioni per la compilazione e il test dell'applicazione nel computer locale.

  1. In Visual Studio Code usare il pulsante Attiva/Disattiva chat nella barra del titolo per aprire la finestra di chat. Usare l'icona Nuova chat per creare una nuova sessione di chat.

  2. Nell'area della chat, seleziona la modalità Agent. Al momento della stesura di questo articolo, Claude Sonnet 4 restituisce i risultati migliori. Usare il modello migliore disponibile per la generazione di codice.

  3. Usare il prompt seguente per avviare la generazione dell'applicazione:

    I want you to create a simple Contact Manager application using Django and PostgreSQL.

This should be a CRUD application, so create web pages that display a list of
contacts, view details, add a new contact, edit or delete a contact. Each Contact
is comprised of a contact's Name, Address, and Phone number. Since this is a
Python / Django project please make sure to work inside of a virtual environment (venv).
I've already created a PostgreSQL database at `localhost` named `contacts`. There are
no tables yet. For local development in PostgreSQL, I'm using a `pgpass.conf` file
and I have tested that it works. Prefer Git Bash in the terminal. Beyond that, if there's
anything I need to do, please include instructions. But I want you to do as much as
you can on your own.

    Il prompt presenta le funzionalità seguenti:

    • Tipo di applicazione da creare. In questo caso, un'applicazione di gestione dei contatti.
    • Tecnologie da usare. In questo caso, Django e PostgreSQL.
    • Architettura del sito da generare. In questo caso, un'applicazione di stile CRUD che include una pagina che elenca tutti i contatti e consente di eseguire il drill-down in un contatto specifico.
    • Altri dettagli sul dominio del problema. In questo caso, si specificano i campi dei dati che si vuole gestire l'applicazione, inclusi il nome, l'indirizzo e il numero di telefono del contatto.
    • Istruzioni specifiche relative al database. In questo caso, si indica a GitHub Copilot di usare un database specifico già creato, si specifica lo stato del database e come interagire
    • Istruzioni specifiche sull'ambiente. In questo caso, è necessario indicare all'utente di usare Git Bash. Si indica anche che si vuole che il lavoro venga eseguito in un ambiente Python (venv), una procedura consigliata. GitHub Copilot potrebbe scegliere queste opzioni autonomamente, ma esplicitarlo fa sì che il processo si svolga senza intoppi.
    • Aspettative esplicite che si desidera che svolga quanto più lavoro possibile autonomamente. In caso contrario, GitHub Copilot potrebbe fornire istruzioni da seguire.
    • Aspettative esplicite per le istruzioni e il contesto. Se ti chiede di eseguire altre azioni, chiarisci fin dall’inizio che deve aiutarti fornendoti istruzioni e indicazioni.

    Importante

    Quando GitHub Copilot usa il terminale per creare un nuovo ambiente virtuale, Visual Studio Code rileva venv e visualizza una finestra di dialogo che chiede se usarlo. Ignora quella finestra di dialogo. Va via. Consentire a GitHub Copilot di usare il terminale esclusivamente per questa operazione.

    GitHub Copilot usa il terminale predefinito e l'ambiente di Visual Studio Code per:

    • Creare un ambiente virtuale Python
    • Installare librerie e altre dipendenze
    • Generare file di codice
    • Generare tabelle di database
    • Genera file README per ulteriori istruzioni
    • Creare dati di test
    • Avviare un server Web locale
    • Testare il sito Web (usando Simple Browser o curl)

    A causa del modo in cui gli LLM generano codice, i comandi che utilizzano e ciò che producono sono diversi ogni volta.

Eseguire la distribuzione in Azure con GitHub Copilot per Azure

Dopo che GitHub Copilot genera il sito in locale, si creerà una richiesta di chiedere a GitHub Copilot di apportare modifiche al sito in preparazione alla distribuzione e quindi di eseguire la distribuzione. L'estensione GitHub Copilot per Azure gestisce questa richiesta creando file Bicep e quindi eseguendo tali file usando l'interfaccia della azd riga di comando.

Usa il prompt seguente... puoi copiarlo nel Blocco note e modificare qualsiasi valore tra parentesi angolari, come <resource-group-name> e <region-name>, quindi copiarlo e incollarlo nella chat di GitHub Copilot:

Please help me deploy this Django app to Azure.

First, create and use a Resource Group named "<resource-group-name>" in the "<region-name>" region.

Second, create an Azure App Service for the Django app in the new "<resource-group-name>" in the "<region-name>" region.

Third, create a new Azure Database for PostgreSQL flexible server named "<server-name>" in a resource group named "<resource-group-name>" in my subscription "<subscription-id>". Use my current account ("<account-id>") as the Microsoft Entra administrator. For the PostgreSQL "Administrator login", use "<azure-database-username>" and password "<azure-database-password>". Use a "development" class database configuration in the "<region-name>" region. Create a new database named "contact_manager_db" and migrate all tables and data from the local version of "contact_manager_db". The local database uses the username "<local-database-username>" and password "<local-database-password>". Add my IP address as a firewall rule, allow public access to this resource through the internet using a public IP address, and allow public access from any Azure service within Azure to this server.

Fourth, use Service Connector (and any other services you need to make this configuration work successfully) to connect the web app to the database. You may need to modify the application code to accommodate Service Connector. Also, please ensure a secure connection between the Azure App Service web site and the Azure PostgreSQL Flexible Server.

Please choose the least expensive options.

If you are prompted for an environment, use the name "contacts-env". Configure my firewall to allow my IP address. Beyond that, if there's anything
I need to do, please include instructions. But I want you to do as much as you can on your own.

Before you start:

- Do you have any questions that need to be clarified?
- Please create a plan for deployment in the form of a TODO list, and then update the TODO list as you progress. Do not start until I have a chance to review your plan and tell you to proceed.

Il prompt presenta le funzionalità seguenti:

  • Servizi specifici da usare. In questo caso, si indica che si vuole usare il servizio app di Azure, il server flessibile postgreSQL di Azure, il connettore di servizi. Gli dai anche l'istruzione di "fare qualsiasi altra cosa sia necessario" per garantire che funzioni.
  • Opzioni di servizio specifiche. In questo caso, si indica di voler usare l'opzione meno costosa possibile per ogni servizio.
  • Suggerimento per i passaggi successivi probabili. In questo caso, è consigliabile apportare alcune modifiche al codice per usare Service Connector.
  • Anticipare le decisioni in anticipo. In questo caso, si fornisce la risposta alle impostazioni necessarie, ad esempio un nome di ambiente per azd,
  • Aspettative esplicite che si desidera che faccia quanto più lavoro possibile da solo. In caso contrario, potrebbe fornire istruzioni da seguire.
  • Aspettative esplicite per le istruzioni e il contesto. Far capire che hai bisogno di aiuto e indicazioni quando ti chiede di agire.
  • Chiede se è necessario un chiarimento. Questo spesso presenta potenziali problemi, ad esempio casi limite o istruzioni poco chiare.
  • Richiede un piano con una lista di cose da fare. Offre la certezza che GitHub Copilot per Azure comprenda l'assegnazione e i piani per eseguirlo come previsto.

GitHub Copilot usa il terminale predefinito e l'ambiente di Visual Studio Code per:

  • Aggiornare i file di codice per supportare Service Connector
  • Generare file Bicep
  • Eseguire la azd CLI
  • Testare la distribuzione
  • Se necessario, eseguire il debug della distribuzione usando i log o un altro output

Interagire con GitHub Copilot

GitHub Copilot richiede l'input prima di eseguire molte attività. Una pausa per fornire input è l’occasione per guidare GitHub Copilot a correggere la rotta, così da evitare errori o personalizzare l’output generato in base alle tue preferenze.

Mentre funziona, è possibile guardare e accettare la maggior parte delle domande poste usando il Continue pulsante.

Importante

Se si ottengono risultati imprevisti, riavviare usando una nuova sessione di chat.

A volte è necessario immettere dei dati. Ci sono alcuni momenti distinti quando viene richiesto l'input:

  • Credenziali utente : se l'operazione corrente nel terminale richiede un nome utente o una password, verranno richieste queste informazioni.
  • Momento della decisione - A volte, GitHub Copilot ti offre diverse opzioni in un elenco e ti chiede quale preferisci.
  • Il riquadro comandi : a volte, GitHub Copilot usa le funzionalità di un'estensione e le opzioni vengono visualizzate nel riquadro comandi. Dopo aver eseguito le selezioni appropriate, GitHub Copilot procede.
  • Accesso interattivo - interfaccia della riga di comando di Azure e azd CLI richiedono l'autenticazione e avviano uno dei diversi meccanismi di autenticazione.

Testare e richiedere modifiche

Quando GitHub Copilot ha finito, è possibile che consideri il sito completo e funzionante. Tuttavia, i test potrebbero individuare problemi o funzionalità impreviste/indesiderate dell'app.

Usare i prompt che descrivono il problema con il maggior numero di dettagli possibile. Ad esempio, se l'applicazione non funziona, fornire il maggior numero possibile di informazioni, incluso il messaggio di errore esatto e il risultato previsto.

Interrompere il flusso

In alcuni casi, si potrebbe notare che GitHub Copilot è bloccato in un ciclo che tenta di eseguire ripetutamente le stesse attività o è bloccato in un processo che non restituisce mai. Ad esempio, durante la diagnosi dei problemi con il sito Web, GitHub Copilot potrebbe voler eseguire un comando simile al seguente:

az webapp log tail

Quando GitHub Copilot è bloccato, è possibile interrompere GitHub Copilot in uno dei diversi modi seguenti:

  • Ctrl+C
  • Usare il pulsante pausa nella chat
  • Terminare la sessione di chat e avviare una nuova chat

Importante

La chiusura della sessione di chat elimina definitivamente tutto il contesto creato durante la sessione, che potrebbe o non essere auspicabile.

Per fornire il contesto a ciò che è successo e spostarlo verso una possibile soluzione, è possibile aggiungere una richiesta immediatamente dopo aver interrotto il GitHub Copilot, ad esempio:

You were just getting the logs from Azure App Service but it did not return
so you got stuck. Try to interrupt after a minute once you get what you need
from the logs.

Contenuti correlati

  • Ultimo aggiornamento: