Esercitazione: Introduzione al framework Web Django in Visual Studio

Django è un framework Python di alto livello progettato per lo sviluppo rapido, sicuro e scalabile di applicazioni Web. Questa esercitazione esplora il framework Django nel contesto dei modelli di progetto. Visual Studio fornisce i modelli di progetto per semplificare la creazione di app Web basate su Django.

In questa esercitazione apprenderai a:

• Creare un progetto Django di base in un repository Git usando il modello "Progetto Web Django vuoto" (passaggio 1).
• Creare un'app Django con una pagina ed eseguire il rendering di tale pagina usando un modello (passaggio 2).
• Gestire file statici, aggiungere pagine e usare l'ereditarietà dei modelli (passaggio 3).
• Usare il modello Progetto Web Django per creare un'app con più pagine e progettazione reattiva (passaggio 4).
• Autenticare gli utenti (passaggio 5).

Prerequisiti

• Visual Studio 2022 in Windows con le opzioni seguenti:
  • Carico di lavoro Sviluppo Python (scheda Carico di lavoro nel programma di installazione). Per altre istruzioni, vedere Installare il supporto python in Visual Studio.
  • Git per Windows nella scheda Singoli componenti in Strumenti di codice.

I modelli di progetto Django includono anche versioni precedenti di Python Tools per Visual Studio. I dettagli del modello potrebbero essere diversi da quelli descritti in questa esercitazione (in particolare diversi con le versioni precedenti del framework Django).

Lo sviluppo python non è attualmente supportato in Visual Studio per Mac. In Mac e Linux usare l'estensione Python in Visual Studio Code.

"Progetti di Visual Studio" e "progetti Django"

Nella terminologia di Django, un "progetto Django" include diversi file di configurazione a livello di sito insieme a una o più "app". Per creare un'applicazione Web completa, è possibile distribuire queste app in un host Web. Un progetto Django può contenere più app e la stessa app può essere inclusa in più progetti Django.

Un progetto di Visual Studio può contenere il progetto Django insieme a più app. Ogni volta che questa esercitazione fa riferimento a un "progetto", fa riferimento al progetto di Visual Studio. Quando fa riferimento alla parte "Progetto Django" dell'applicazione Web, si riferisce in particolare a un "progetto Django".

Nel corso di questa esercitazione si creerà una singola soluzione di Visual Studio che contiene tre progetti Django separati. Ogni progetto contiene una singola app Django. È possibile passare facilmente da un file all'altro per il confronto, mantenendo i progetti nella stessa soluzione.

Passaggio 1-1: Creare un progetto e una soluzione di Visual Studio

Quando si usa Django dalla riga di comando, in genere si avvia un progetto eseguendo il django-admin startproject <project_name> comando . In Visual Studio il modello "Progetto Web Django vuoto" fornisce la stessa struttura all'interno di un progetto e di una soluzione di Visual Studio.

1. In Visual Studio selezionare File>Nuovo>progetto, cercare "Django" e selezionare il modello Progetto Web Django vuoto e quindi selezionare Avanti.

   

2. Immettere le informazioni seguenti e quindi selezionare Crea:

   • Nome progetto: impostare il nome del progetto di Visual Studio su BasicProject. Questo nome verrà usato anche per il progetto Django.
   • Percorso: specificare un percorso in cui creare la soluzione e il progetto di Visual Studio.
   • Soluzione: lasciare questa opzione di controllo impostata su Crea nuova soluzione predefinita.
   • Nome soluzione: impostare su LearningDjango, appropriato per la soluzione come contenitore per più progetti in questa esercitazione.

Passaggio 1-2: Esaminare i controlli Git e pubblicare il progetto in un repository remoto

In questo passaggio si acquisisce familiarità con i controlli Git di Visual Studio e Team Explorer. Con la finestra Team Explorer si userà il controllo del codice sorgente.

1. Per eseguire il commit del progetto nel controllo del codice sorgente locale:

   1. Selezionare Aggiungi al controllo del codice sorgente nell'angolo inferiore della finestra principale di Visual Studio.
   2. Selezionare quindi l'opzione Git .
   3. Verrà visualizzata la finestra Crea repository Git, in cui è possibile creare ed eseguire il push di un nuovo repository.

   

2. Dopo aver creato un repository, viene visualizzato un set di nuovi controlli Git nella parte inferiore. Da sinistra a destra, questi controlli mostrano commit non crittografati, modifiche di cui non è stato eseguito il commit, il ramo corrente e il nome del repository.

   

3. Selezionare il pulsante Modifiche Git. Visual Studio apre quindi la pagina Modifiche Git in Team Explorer. Non vengono visualizzate modifiche in sospeso perché il progetto appena creato viene già eseguito automaticamente il commit nel controllo del codice sorgente.

   

4. Nella barra di stato di Visual Studio selezionare il pulsante dei commit di cui è stato annullato il push (freccia in su con 2) per aprire la pagina Sincronizzazione in Team Explorer. La pagina Sincronizzazione offre opzioni semplici per pubblicare il repository locale in repository remoti diversi.

   

   È possibile scegliere qualsiasi servizio desiderato per i progetti. Questa esercitazione mostra l'uso di GitHub, in cui il codice di esempio completo per l'esercitazione è disponibile nel repository Microsoft/python-sample-vs-learning-django.

5. Quando si seleziona uno qualsiasi dei controlli Pubblica, Team Explorer chiede altre informazioni. Ad esempio, quando si pubblica l'esempio per questa esercitazione, il repository stesso deve essere creato per primo, nel qual caso l'opzione Push to Remote Repository è stata usata con l'URL del repository.

   

   Se non è disponibile un repository esistente, le opzioni Pubblica in GitHub e Esegui push ad Azure DevOps consentono di crearne uno direttamente da Visual Studio.

6. Durante lo svolgimento di questa esercitazione, abituarsi a usare periodicamente i controlli in Visual Studio per il commit e il push delle modifiche. Questa esercitazione ricorda di eseguire queste operazioni nei momenti appropriati.

Suggerimento

Per spostarsi rapidamente all'interno di Team Explorer, selezionare l'intestazione (che indica Modifiche o Push nelle immagini precedenti) per visualizzare un menu di scelta rapida delle pagine disponibili.

Domanda: Quali sono alcuni dei vantaggi dell'uso del controllo del codice sorgente sin dall'inizio di un progetto?

Risposta: Il controllo del codice sorgente fin dall'inizio, soprattutto se si usa anche un repository remoto, fornisce un normale backup fuori sede del progetto. A differenza della gestione di un progetto in un file system locale, il controllo del codice sorgente fornisce una cronologia delle modifiche completa e la possibilità di ripristinare un singolo file o l'intero progetto allo stato precedente. La cronologia delle modifiche consente di determinare la causa delle regressioni (errori di test). Quando più persone lavorano su un progetto, il controllo del codice sorgente gestisce la sovrascrittura e fornisce la risoluzione dei conflitti.

Infine, il controllo del codice sorgente, che è fondamentalmente una forma di automazione, consente di automatizzare compilazioni, test e gestione delle versioni. È il primo passaggio dell'uso di DevOps per un progetto. Non c'è davvero motivo di non usare il controllo del codice sorgente fin dall'inizio perché le barriere all'ingresso sono basse.

Per altre informazioni sul controllo del codice sorgente come automazione, vedere The Source of Truth: The Role of Repository in DevOps, un articolo di MSDN Magazine scritto per le app per dispositivi mobili che si applicano anche alle app Web.

Domanda: È possibile impedire a Visual Studio di generare automaticamente il commit di un nuovo progetto?

Risposta: sì. Per disabilitare il commit automatico, passare alla pagina Impostazioni in Team Explorer. Selezionare Impostazioni globali Git>, deselezionare l'opzione Commit changes after merge by default (Esegui commit modifiche dopo l'unione per impostazione predefinita) e quindi selezionare Aggiorna.

Passaggio 1-3: Creare l'ambiente virtuale ed escluderlo dal controllo del codice sorgente

Dopo aver configurato il controllo del codice sorgente per il progetto, è possibile creare l'ambiente virtuale contenente i pacchetti Django necessari per il progetto. È quindi possibile usare Team Explorer per escludere la cartella dell'ambiente dal controllo del codice sorgente.

1. In Esplora soluzioni fare clic con il pulsante destro del mouse sul nodo Ambienti Python e scegliere Aggiungi ambiente.

   

2. Selezionare Crea per accettare le impostazioni predefinite, nella finestra di dialogo Aggiungi ambiente virtuale. È possibile modificare il nome dell'ambiente virtuale, se si vuole, e questa operazione modifica solo il nome della sottocartella dell'ambiente, ma env è una convenzione standard.

   

3. Se richiesto, fornire il consenso per i privilegi di amministratore, attendere alcuni minuti mentre Visual Studio scarica e installa i pacchetti. Durante questo periodo, migliaia di file vengono trasferiti in molte sottocartelle. È possibile visualizzare lo stato di avanzamento nella finestra Output di Visual Studio. Durante l'attesa, leggere le sezioni delle domande seguenti.

4. Nei controlli Git di Visual Studio (sulla barra di stato) selezionare l'indicatore delle modifiche (che mostra 99*) che apre la pagina Modifiche in Team Explorer.

   La creazione dell'ambiente virtuale ha apportato migliaia di modifiche, ma non è necessario includerne alcuna nel controllo del codice sorgente perché l'utente (o chiunque altro clona il progetto) può sempre ricreare l'ambiente da requirements.txt.

5. Per escludere l'ambiente virtuale, fare clic con il pulsante destro del mouse sulla cartella env e selezionare Ignora questi elementi locali.

   

6. Dopo aver escluso l'ambiente virtuale, le uniche modifiche rimanenti sono apportate al file di progetto e al file con estensione gitignore . Il file con estensione gitignore contiene una voce aggiunta per la cartella dell'ambiente virtuale. È possibile fare doppio clic sul file per visualizzare una differenza.

7. Immettere un messaggio di commit e selezionare il pulsante Commit all (Commit all ), quindi eseguire il push dei commit nel repository remoto.

Domanda: Perché è utile creare un ambiente virtuale?

Risposta: Un ambiente virtuale è un ottimo strumento per isolare le dipendenze esatte dell'app. Questo isolamento evita i conflitti all'interno di un ambiente Python globale e semplifica i test e la collaborazione. Quando si sviluppa un'app, si finisce per introdurre nel tempo molti utili pacchetti Python. È possibile aggiornare facilmente il file requirements.txt del progetto mantenendo i pacchetti in un ambiente virtuale specifico del progetto. Il file requirements.txt descrive l'ambiente, incluso nel controllo del codice sorgente. Quando il progetto viene copiato in altri computer, tra cui server di compilazione, server di distribuzione e altri computer di sviluppo, è facile ricreare l'ambiente usando solo requirements.txt, che è il motivo per cui non è necessario includere l'ambiente nel controllo del codice sorgente. Per altre informazioni, vedere Usare ambienti virtuali.

Domanda: Come si rimuove un ambiente virtuale di cui è già stato eseguito il commit nel controllo del codice sorgente?

Risposta: Prima di tutto, modificare il file con estensione gitignore per escludere la cartella. Trovare la sezione alla fine con il commento # Python Tools for Visual Studio (PTVS) e aggiungere una nuova riga per la cartella dell'ambiente virtuale, ad esempio /BasicProject/env. Visual Studio non mostra il file in Esplora soluzioni. Per aprire direttamente il file, passare a File Apri>file>. È anche possibile aprire il file da Team Explorer. Passare alla pagina Impostazioni e selezionare Repository Impostazioni. Passare ora alla sezione Ignora e attributi e selezionare il collegamento Modifica accanto a .gitignore.

In secondo luogo, aprire una finestra di comando, passare a una cartella come BasicProject. La cartella BasicProject contiene la cartella dell'ambiente virtuale, ad esempio env, ed eseguire git rm -r env. Eseguire quindi il commit delle modifiche dalla riga di comando (git commit -m 'Remove venv') o dalla pagina Modifiche di Team Explorer.

Passaggio 1-4: Esaminare il codice boilerplate

Al termine della creazione del progetto, esaminare il codice boilerplate del progetto Django, che è lo stesso generato dal comando django-admin startproject <project_name> dell'interfaccia della riga di comando.

1. La radice del progetto ha manage.py, l'utilità amministrativa della riga di comando Django impostata automaticamente da Visual Studio come file di avvio del progetto. Eseguire l'utilità nella riga di comando usando python manage.py <command> [options]. Per attività Django comuni, Visual Studio offre pratici comandi di menu. Fare clic con il pulsante destro del mouse sul progetto in Esplora soluzioni e scegliere Python per visualizzare l'elenco. Alcuni di questi comandi verranno visualizzati nel corso di questa esercitazione.

   

2. Nel progetto è presente una cartella con lo stesso nome del progetto. La cartella contiene i file di progetto Django di base:

   • __init.py: file vuoto che indica a Python che questa cartella è un pacchetto Python.
   • settings.py: contiene le impostazioni per il progetto Django, che verrà modificato durante lo sviluppo di un'app Web.
   • urls.py: contiene un sommario per il progetto Django, che verrà modificato anche durante lo sviluppo.
   • wsgi.py: punto di ingresso per i server Web compatibili con WSGI per gestire il progetto. In genere si lascia questo file così come è, perché fornisce gli hook per i server Web di produzione.

   

3. Come indicato sopra, il modello di Visual Studio aggiunge anche un file requirements.txt al progetto specificando la dipendenza dei pacchetti Django. La presenza di questo file è il motivo per cui creare un ambiente virtuale quando si crea il progetto per la prima volta.

Domanda: Visual Studio può generare un file requirements.txt da un ambiente virtuale dopo che si installano altri pacchetti?

Risposta: sì. Espandere il nodo Ambienti Python, fare clic con il pulsante destro del mouse sull'ambiente virtuale e scegliere il comando Genera requirements.txt. È utile usare questo comando periodicamente man mano che si modifica l'ambiente e si esegue il commit delle modifiche apportate a requirements.txt nel controllo del codice sorgente, insieme a tutte le altre modifiche del codice che dipendono dall'ambiente. Se si configura l'integrazione continua in un server di compilazione, è necessario generare il file ed eseguire il commit delle modifiche ogni volta che si modifica l'ambiente.

Passaggio 1-5: Eseguire il progetto Django vuoto

1. In Visual Studio selezionare Debug>Avvia debug (F5) o usare il pulsante Server Web sulla barra degli strumenti (il browser visualizzato potrebbe variare):

   

2. L'esecuzione del server significa eseguire il comando manage.py runserver <port>, che avvia il server di sviluppo predefinito di Django. Se Visual Studio visualizza il messaggio Impossibile avviare il debugger perché manca il file di avvio, fare clic con il pulsante destro del mouse su manage.py in Esplora soluzioni e selezionare Imposta come file di avvio.

3. Quando si avvia il server, viene visualizzata una finestra della console che visualizza anche il log del server. Visual Studio apre automaticamente un browser all'indirizzo http://localhost:<port>. Poiché il progetto Django non ha app, Django mostra solo una pagina predefinita per confermare che quello che hai finora funziona bene.

   

4. Al termine, arrestare il server chiudendo la finestra della console o usando il comando Debug>Interrompi debug in Visual Studio.

Domanda: Django è un server Web e un framework?

Risposta: Sì e no. Django dispone di un server Web predefinito usato a scopo di sviluppo. Questo server Web viene usato quando si esegue l'app Web in locale, ad esempio durante il debug in Visual Studio. Quando si esegue la distribuzione in un host Web, tuttavia, Django usa invece il server Web dell'host. Il modulo wsgi.py nel progetto Django si occupa dell'hook nei server di produzione.

Domanda: Qual è la differenza tra l'uso dei comandi del menu Debug e dei comandi del server nel sottomenu Python del progetto?

Risposta: Oltre ai comandi del menu Debug e ai pulsanti della barra degli strumenti, è possibile avviare il server anche usando i comandi Python>Avvia server o Python>Avvia il server di debug del menu di scelta rapida del progetto. Entrambi i comandi aprono una finestra della console in cui verrà visualizzato l'URL locale (localhost:port) per il server in esecuzione. Tuttavia, è necessario aprire manualmente un browser con tale URL e l'esecuzione del server di debug non avvia automaticamente il debugger di Visual Studio. Se si desidera, è possibile collegare un debugger al processo in esecuzione usando il comando Debug>Connetti a processo .

Passaggi successivi

A questo punto, il progetto Django di base non contiene app. Si creerà un'app nel passaggio successivo. Poiché si useranno app Django più del progetto Django, non sarà necessario conoscere più i file boilerplate per il momento.

Creare un'app Django con visualizzazioni e modelli di pagina

Approfondimento

• Codice del progetto Django: Writing your first Django app, part 1 (Scrittura della prima app Django, parte 1) (docs.djangoproject.com)
• Utilità di amministrazione: django-admin and manage.py (docs.djangoproject.com)
• Codice sorgente per l'esercitazione su GitHub: Microsoft/python-sample-vs-learning-django