Guida tecnica per creare un nuovo progetto in Django con il supporto di Bootstrap 5 per l’interfaccia grafica.
#axts #devdiary #django #python #bootstrap
NEWSLETTER? NO, GRAZIE!
Unisciti al mio canale Telegram! Onnipresente. Silenzioso. Non ingombrante.
> AxelTheSaint <
Sommario Veloce
Per migliore utilizzo della guida, ecco i link che riportano direttamente alle sezioni specifiche. Se vuoi arrivare dritto al codice puoi farlo immediatamente, se invece desideri comprendere meglio anche la teoria, sono presenti le specifiche sezioni:
- Requisiti di sistema testati
- Listato completo di codice
- Interfaccia grafica con Bootstrap 5
- Guida Tecnica: avviare e configurare un progetto in Django
- Guida Tecnica: testare il funzionamento del progetto
- Appendice Teorica: Cosa è Django
- Appendice Teorica: Cosa è Bootstrap
Requisiti di sistema testati
Requisiti di sistema testati:
- Windows 10 64 bit oppure Windows 11 64 bit
- Python (Per installare Python in ambiente Windows ho creato una pillola tecnica apposita – Come installare Python in ambiente Windows)
- [Per sistemi Linux e Mac Python è già installato, pertanto basterà aggiungere il componente Django]
- Django (qualsiasi versione)
- Bootstrap (ho testato l’utilizzo di Bootstrap con le versioni 4 e 5. In questo caso useremo la versione 5 ma non c’è differenza ai fini della riuscita dell’installazione di Django)
N.B. : Per avviare un progetto in Django è necessario prima di tutto avere installato il componente Python nel nostro ambiente di sviluppo. Per le specifiche dell’installazione Python, trovi l’articolo nel paragrafo “Requisiti di sistema testati” (sopra).
Listato completo di codice per avviare un progetto in Django
Listato di istruzioni in sequenza
python -m venv project_venv
cd project_venv/Scripts
activate
cd..
cd..
pip install django
django-admin startproject new_project
cd new_project
python manage.py migrate
python manage.py createsuperuser
python manage.py runserver
> python manage.py startapp core
Schermata dell’intero processo
Interfaccia grafica con integrazione di Bootstrap 5 [Facoltativo]
Questa sezione risulta facoltativa in quanto, arrivati a questo punto, il nostro progetto in Django è effettivamente avviato e configurato. Tuttavia, per completezza ho voluto inserire un ulteriore passo in modo da descriverti completamente il processo da zero, fino ad una pagina in html funzionante.
[WORK IN PROGRESS.. CONTENT UPDATING COMING SOON]
Guida Tecnica: come avviare e configurare un progetto in Django
Aprire il prompt dei comandi e recarsi presso la cartella dove sviluppare il progetto in Django.
Tips & Tricks: sarebbe opportuno non operare su C: oppure su cartelle di sistema per le quali la scrittura è ostacolata da controlli di sicurezza e di permessi da parte di Windows
Tips & Tricks: per aprire il prompt dei comandi in una cartella, senza andare a ricercare il percorso specifico, è sufficiente inserire nella barra di esplorazione il comando “cmd” e premere “Invio”
Una volta avviato il prompt dei comandi nella cartella del progetto, inserire sequenzialmente i codici riportati di seguito senza chiudere.
[Se chiudi per sbaglio, non preoccuparti! Basta riprendere da dove hai interrotto il processo senza ripetere le istruzioni che hai già inserito]
Step 1: installare l’ambiente virtuale
“python -m venv project_venv”
[ “project_venv” è il nome che ho dato all’ambiente virutale, non è rilevante ai fini del funzionamento e dell’installazione di Django, potrebbe essere “venv”, “virtual_enviroment”, “pippo”, “pluto” o qualsiasi altro nome. Di solito si usa una nomenclatura parlante, ovvero solo a leggerla si capisce quale sia il suo scopo.]
Attendere l’esito dell’installazione e proseguire.
Step 2: avviare l’ambiente virtuale
Entrare nella cartella Script ed attivare l’ambiente virtuale, attraverso questo codice:
“cd project_venv/Scripts”
“activate”
Comparirà a sinistra della riga del prompt dei comandi la dicitura
(project_venv)
Uscire dalla cartella con il comando “cd..” per due volte:
“cd..” > adesso siamo nella cartella “project_venv”
“cd..” > adesso siamo nella cartella “Nuovo Progetto Django”
Step 2: installare Django
“pip install django”
attendere l’esito dell’installazione e proseguire.
Step 3: inizializzare il progetto Django
“django-admin startproject new_project”
[“new_project” è il nome che ho dato il progetto Django che sto avviando. Il nome in questo caso è vincolante perché condizionerà i successivi vincoli di sviluppo, ma è assolutamente inventato, chiama il tuo progetto nel modo in cui ritieni più opportuno – sì, anche “pippo”, “pluto” o “paperino”.]
Step 4: inizializzare il database integrato con Django
“cd new_project” > recarsi nella cartella del progetto inizializzato allo Step 3.
“python manage.py migrate”
Se desideri appoggiarti ad un database esterno al sistema integrato in Django, ho preparato un approfondimento: Appendice tecnica: configurare Django con PostgreSQL
Step 5: creare un utente admin del progetto Django
“python manage.py createsuperuser”
inserire sequenzialmente: utente, email (facoltativa), password (2 volte per conferma), per ogni inserimento (anche in caso di campo vuoto come la mail) premere “Invio” per proseguire
Step 6: inizializzare un’applicazione in Django
Per ogni app che vogliamo inizializzare per il nostro progetto dovremo scrivere l’istruzione
“python manage.py startapp nome_app”
nel listato di codice è riportato “python manage.py core” in quanto ho chiamato la mia app “core”.
Non è stato inserito negli esempi delle schermate poiché è un processo che, a seconda della grandezza del progetto, può essere ripetuto più volte.
Guida Tecnica: come testare il progetto in Django
Final Step: avviare il server locale e verificare il corretto funzionamento
“python manage.py runserver”
Se il sistema non ha dato errori, aprire un qualsiasi browser e andare all’indirizzo:
localhost:8000
oppure
127.0.0.1:8000
Il risultato sarà il seguente:
Tips & Tricks: per uscire dall’esecuzione del server è sufficiente, nel prompt dei comandi, premere la combinazione di tasti CTRL + C (un paio di volte)
Appendice Teorica: cosa è Django
Django è un web frameworkPer framework si intende una architettura logica di supporto sul quale una software o un applicativo può essere costrui... Leggi di alto livello scritto in Python. Consente lo sviluppo di siti web e applicativi web oriented sicuri e scalabili rapidamente. Django è gratuito e open source, molto popolare ed utilizzato a livello globale ed è facilmente integrabile con le numerose librerie in linguaggio Python.
Se questa disamina ti è sufficiente prosegui pure, altrimenti ho scritto un approfondimento in merito. Appendice Teorica: Django FrameworkPer framework si intende una architettura logica di supporto sul quale una software o un applicativo può essere costrui... Leggi.
Se invece vuoi maggiori informazioni sul progetto, ecco la pagina ufficiale: Django Project.
Appendice Teorica: cosa è Bootstrap
Bootstrap è il più famoso frameworkPer framework si intende una architettura logica di supporto sul quale una software o un applicativo può essere costrui... Leggi per la costruzione di pagine web, responsive e orientate al mobile. Comprende una raccolta di strumenti (open source) per la creazione di siti e applicazioni per il web. Bootstrap contiene modelli di progettazione basati su html e css per la tipografia e per le varie componenti dell’interfaccia. (Come ad esempio moduli, pulsanti e navigazione, così come alcune estensioni e librerie in JavScript. Il supporto di JavaScript permette la realizzazione di effetti, altrimenti molto lunghi e onerosi in termini di integrazione e messa a punto.)
Uno dei maggiori punti di forza è la possibilità di strutturare l’intera pagina web come una griglia divisa per righe e per colonne. Grazie a questo, non solo si accelera il processo di realizzazione di un progetto web, si rende disponibile il contenuto per numerose risoluzioni di schermo, rendendo così molto più semplice l’adattamento ai vari dispositivi. (Siano essi desktop o portatili come notebook, tablet e smartphone.)
L’ulteriore vantaggio è l’immediato accesso a vari stili grafici e testuali che rendono molto più pratica e veloce la formattazione e l’applicazione di interfacce grafiche.
Se vuoi maggiori informazioni ecco la pagina ufficiale: Bootstrap.