Delen via

Een Django- en PostgreSQL-app genereren en implementeren in Azure

In dit artikel wordt uitgelegd hoe u kunt communiceren met GitHub Copilot om een lokale Django-web-app te genereren die CRUD-bewerkingen uitvoert op een PostgreSQL-database. Vervolgens wordt u begeleid bij het werken met GitHub Copilot voor Azure om de web-app en database te implementeren in Azure App Service en Azure PostgreSQL Flexible Server (samen met verschillende ondersteunende Azure-services).

De specifieke toepassing die u maakt, is een triviale contactbeheertoepassing die CRUD-bewerkingen bevat met een architectuur met lijstdetails.

Opmerking

Het gebruik van een LLM (Large Language Model) voor het genereren van een toepassing kan inconsistente resultaten opleveren. Uw resultaten zijn afhankelijk van het LLM-model, uw instructies en meer. De focus van deze handleiding is om inzicht te krijgen in hoe u betere resultaten krijgt. Telkens wanneer u dit voorbeeld doorloopt, krijgt u echter (mogelijk) aanzienlijk andere resultaten.

Vereiste voorwaarden

Belangrijk

GitHub Copilot is een afzonderlijk abonnement dat wordt beheerd door GitHub. Zie Aan de slag met een GitHub Copilot-abonnement voor vragen over GitHub Copilot-abonnementen en ondersteuning.

De chatsessie voorbereiden

  1. Gebruik in Visual Studio Code de wisselknop Chat in de titelbalk of selecteer Ctrl+Alt+i om het chatvenster te openen. Gebruik het pictogram Nieuwe chat om een nieuwe chatsessie te maken.

  2. Selecteer Agent de modus in het chatgebied. Op het moment van schrijven Claude Sonnet 4 levert dit de beste resultaten op. Gebruik het beste model dat beschikbaar is voor het genereren van code.

Uw configuratie valideren

Zorg ervoor dat uw CLI-hulpprogramma's en Visual Studio Code zijn bijgewerkt, correct zijn geconfigureerd en correct werken om uw resultaten te verbeteren.

  1. Voer in een nieuwe chat de volgende prompt in:

    
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 vraagt toestemming om een reeks opdrachtregelcontroles uit te voeren om ervoor te zorgen dat u over de hulpprogramma's beschikt, evenals de meest recente versies van deze hulpprogramma's die zijn geïnstalleerd.

  2. Werk in uw terminal de Azure CLI bij met de opdracht az --upgrade.

  3. Installeer in uw terminal de extensie zonder wachtwoord voor de serviceconnector voor Azure CLI met de opdracht az extension add --name serviceconnector-passwordless --upgrade

  4. Stel in Visual Studio Code de standaardterminal in op Git Bash. Ga naar Instellingen voor bestandsvoorkeuren >> en typ vervolgens in Zoekinstellingen 'Standaardprofiel: Windows' en selecteer 'Git Bash'. Mogelijk moet u Visual Studio Code opnieuw starten om deze instelling van kracht te laten worden.

    Opmerking

    Het gebruik van Git Bash is niet strikt noodzakelijk, maar op het moment van schrijven levert dit de beste resultaten op.

  5. Gebruik in Visual Studio Code de Extensie PostgreSQL voor Visual Studio Code (preview) en navigeer naar de contacts database.

  6. Gebruik in Visual Studio Code de Azure-extensie en zorg ervoor dat u bent aangemeld bij uw Azure-account en -abonnement. Wanneer u de Azure-extensie opent in de primaire zijbalk, moet u uw bestaande abonnementen en resources kunnen bekijken.

  7. Maak een nieuwe map voor uw nieuwe toepassingsbestanden en open deze in Visual Studio Code als uw werkruimte.

De lokale database instellen

Hoewel GitHub Copilot vrijwel elke toepassingsontwikkelingstaak kan uitvoeren die ontwikkelaars doorgaans uitvoeren, krijgt u de beste resultaten als u enkele taken in kleinere stappen uitvoert. Als u de resultaten wilt verbeteren, maakt u de database en stelt u verificatie en autorisatie in voordat u met GitHub Copilot werkt.

  1. Maak een nieuwe chat en gebruik de volgende prompt:

    
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.

    Vervang <db-username> respectievelijk door <password> de gewenste gebruikersnaam en het gewenste wachtwoord voor de database.

  2. Op Windows-computers wordt aanbevolen om de gebruikersnaam en het wachtwoord van de database op te slaan in een lokaal bestand:

    %APPDATA%\postgresql\pgpass.conf

    Dit lost doorgaans de volgende locatie op uw harde schijf op:

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

    Vervang <username> door uw Windows-gebruikersnaam.

    Het bestand moet de volgende indeling hebben:

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

    Hierbij wordt ervan uitgegaan dat u met een exemplaar van PostgreSQL op uw lokale computer werkt en dat deze wordt gehost op de standaardpoort (5432).

    Vervang <database-name> door contacts en vervang <db-username> deze door <password> de referenties die u in de vorige stap hebt gebruikt.

    Zie de pgpass.conf voor meer informatie over het bestand.

  3. Voeg het pad toe aan het bestand in de pgpass.conf omgevingsvariabele PATH.

  4. Test de verbinding om ervoor te zorgen dat deze werkt. Gebruik de psql CLI om deze te testen met de volgende opdracht:

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

    Vervang <db-username> door het gebruikersnaamsegment van de database in het pgpass.conf bestand.

    Als de pgpass.conf instellingen niet juist zijn ingesteld, wordt u gevraagd uw wachtwoord in te voeren.

Een app genereren met GitHub Copilot

Eerst geeft u instructies en richtlijnen voor het bouwen en testen van de toepassing op uw lokale computer.

  1. Gebruik in Visual Studio Code de wisselknop Chat in de titelbalk om het chatvenster te openen. Gebruik het pictogram Nieuwe chat om een nieuwe chatsessie te maken.

  2. Selecteer Agent de modus in het chatgebied. Op het moment van schrijven Claude Sonnet 4 levert dit de beste resultaten op. Gebruik het beste model dat beschikbaar is voor het genereren van code.

  3. Gebruik de volgende prompt om te beginnen met het genereren van toepassingen:

    
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.

    De prompt heeft de volgende functies:

    • Het type toepassing dat u wilt maken. In dit geval een toepassing voor contactbeheer.
    • De technologieën die moeten worden gebruikt. In dit geval Django en PostgreSQL.
    • De sitearchitectuur die u wilt genereren. In dit geval is een CRUD-stijltoepassing met een pagina met alle contactpersonen en kunt u inzoomen op een specifieke contactpersoon.
    • Meer informatie over het probleemdomein. In dit geval geeft u de gegevensvelden op die de toepassing moet beheren, inclusief de naam, het adres en het telefoonnummer van de contactpersoon.
    • Specifieke instructies met betrekking tot de database. In dit geval geeft u GitHub Copilot opdracht om een specifieke database te gebruiken die u al hebt gemaakt, geeft u de status van de database op en hoe u kunt communiceren
    • Specifieke instructies over de omgeving. In dit geval geeft u de opdracht om Git Bash te gebruiken. U geeft ook aan dat u wilt dat het werk wordt uitgevoerd in een Python-omgeving (venv), wat een best practice is. GitHub Copilot kan deze opties zelf kiezen, maar door te vermelden dat het proces expliciet soepel verloopt.
    • Expliciete verwachtingen dat u wilt dat het zo veel mogelijk zelf werkt. Anders kan GitHub Copilot instructies geven die u moet volgen.
    • Expliciete verwachtingen voor instructies/context. Als u andere acties moet uitvoeren, stelt u de verwachting in dat u deze nodig hebt om u te helpen door instructies en richtlijnen te geven.

    Belangrijk

    Wanneer GitHub Copilot de terminal gebruikt om een nieuwe virtuele omgeving te maken, detecteert Visual Studio Code het venv en geeft een dialoogvenster weer waarin u wordt gevraagd of u deze wilt gebruiken. Dit dialoogvenster negeren. Het gaat weg. Toestaan dat GitHub Copilot de terminal uitsluitend voor deze bewerking gebruikt.

    GitHub Copilot maakt gebruik van de ingebouwde terminal en de Visual Studio Code-omgeving om:

    • Een virtuele Python-omgeving maken
    • Bibliotheken en andere afhankelijkheden installeren
    • Codebestanden genereren
    • Databasetabellen genereren
    • Leesmij-bestanden genereren voor verdere instructies
    • Testgegevens maken
    • Een lokale webserver starten
    • De website testen (met simple browser of curl)

    Vanwege de manier waarop LLM's code genereren, zijn de opdrachten die worden gebruikt en wat deze produceert telkens anders.

Implementeren in Azure met GitHub Copilot voor Azure

Nadat GitHub Copilot de site lokaal heeft gegenereerd, maakt u een prompt waarin u GitHub Copilot vraagt om wijzigingen aan te brengen in de site ter voorbereiding op de implementatie en vervolgens om de implementatie uit te voeren. De GitHub Copilot voor Azure-extensie verwerkt deze aanvraag door Bicep-bestanden te maken en deze bestanden vervolgens uit te voeren met behulp van de azd CLI.

Gebruik de volgende prompt... u kunt kopiëren naar Kladblok en elke waarde tussen vierkante haken <resource-group-name> wijzigen, en <region-name> vervolgens kopiëren en plakken in GitHub Copilot-chat:


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.

De prompt heeft de volgende functies:

  • Specifieke services die u wilt gebruiken. In dit geval geeft u aan dat u Azure App Service, Azure PostgreSQL Flexible Server, Service Connector wilt gebruiken. U geeft het ook de instructie om te "doen wat u ook moet doen" om ervoor te zorgen dat het werkt.
  • Specifieke serviceopties. In dit geval geeft u aan dat u voor elke service de minst dure optie wilt gebruiken.
  • Hint voor waarschijnlijke volgende stappen. In dit geval stelt u voor dat er codewijziging nodig is om serviceconnector te kunnen gebruiken.
  • Anticiperen op beslissingen van tevoren. In dit geval geeft u het antwoord op de instellingen die nodig zijn, zoals een omgevingsnaam voor azd,
  • Expliciete verwachtingen dat u wilt dat het net zo veel eigen werk doet. Anders kan het u instructies geven die u moet nemen.
  • Expliciete verwachtingen voor instructies/context. Stel de verwachting in dat u hulp en hulp nodig hebt wanneer u wordt gevraagd actie te ondernemen.
  • Vraagt of er duidelijkheid nodig is. Dit veroorzaakt vaak potentiële problemen, zoals randcases of onduidelijke instructies.
  • Vraagt een plan aan met een takenlijst. Geeft u het vertrouwen dat GitHub Copilot voor Azure begrijpt welke toewijzing en plannen u wilt uitvoeren zoals u dat bedoelde.

GitHub Copilot maakt gebruik van de ingebouwde terminal en de Visual Studio Code-omgeving om:

  • De codebestanden bijwerken voor serviceconnector
  • Bicep-bestanden genereren
  • De azd CLI uitvoeren
  • De implementatie testen
  • Indien nodig fouten opsporen in de implementatie met behulp van logboeken of andere uitvoer

Interactie met GitHub Copilot

GitHub Copilot vereist uw invoer voordat u veel taken uitvoert. Een pauze voor invoer is de mogelijkheid om GitHub Copilot te laten corrigeren om fouten te voorkomen of gegenereerde uitvoer aan te passen aan uw voorkeuren.

Terwijl het werkt, kunt u de meeste vragen bekijken en ermee instemmen met behulp van de Continue knop.

Belangrijk

Als u onverwachte resultaten krijgt, start u opnieuw met behulp van een nieuwe chatsessie.

Af en toe moet u invoer opgeven. Er zijn enkele momenten waarop u om invoer wordt gevraagd:

  • Gebruikersreferenties : als voor de huidige bewerking in de terminal een gebruikersnaam of wachtwoord is vereist, wordt u om deze informatie gevraagd.
  • Moment van beslissing - Af en toe biedt GitHub Copilot u verschillende opties in een lijst en vraagt u wat u wilt.
  • Het opdrachtpalet - Af en toe gebruikt GitHub Copilot de functies van een extensie en de opties worden weergegeven in het opdrachtpalet. Zodra u de juiste selecties hebt gemaakt, gaat GitHub Copilot verder.
  • Interactieve aanmelding : de Azure CLI en azd CLI moeten u verifiëren en een van de verschillende verificatiemechanismen initiëren.

Testen en vragen om wijzigingen

Wanneer GitHub Copilot is voltooid, is het mogelijk dat de site volledig en functioneel is. Uw test kan echter problemen detecteren, of onverwachte/ongewenste app-functies.

Gebruik prompts om het probleem zo gedetailleerd mogelijk te beschrijven. Als de toepassing bijvoorbeeld niet werkt, geeft u zoveel mogelijk informatie op, inclusief het exacte foutbericht en het verwachte resultaat.

De stroom onderbreken

Soms merkt u misschien dat GitHub Copilot vastzit in een lus die dezelfde taken herhaaldelijk probeert uit te voeren of dat het vastloopt in een proces dat nooit terugkeert. Bij het diagnosticeren van problemen met de website kan GitHub Copilot bijvoorbeeld een opdracht als volgt uitvoeren:

az webapp log tail

Wanneer GitHub Copilot vastloopt, kunt u GitHub Copilot op een van de volgende manieren onderbreken:

  • Ctrl+C
  • Gebruik de pauzeknop in de chat
  • De chatsessie beëindigen en een nieuwe chat starten

Belangrijk

Het beëindigen van de chatsessie vernietigt alle context die tijdens de sessie is opgebouwd, wat wel of niet wenselijk is.

Als u deze context wilt geven aan wat er zojuist is gebeurd en deze naar een mogelijke oplossing wilt duwen, kunt u direct na het onderbreken van de GitHub Copilot een prompt toevoegen, zoals:

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.

Volgende stappen

  • Last updated on