L’auteur a choisi Mozilla Foundation pour recevoir un don dans le cadre du programme Write for Donations.
Comme la demande de développement full-stack continue de croître, les cadres web rendent les flux de développement moins lourds et plus efficaces ; Django est l’un de ces cadres. Django a été utilisé sur de grands sites web tels que Mozilla, Pinterest et Instagram. Contrairement à Flask, qui est un micro-cadre neutre, le package Django PyPI comprend tout ce dont vous auriez besoin pour un développement full-stack ; il n’est pas nécessaire de mettre en place une base de données ou un panneau de contrôle pour le développement.
Un cas d’utilisation courant de Django consiste à l’utiliser pour afficher des informations provenant d’API (telles que les posts Instagram ou les référentiels GitHub) dans vos propres sites et apps web. Bien que cela soit possible avec d’autres cadres, la philosophie " batteries incluses " de Django signifie qu’il y aura moins de problèmes et qu’il faudra moins de paquets pour obtenir le même résultat.
Dans ce tutoriel, vous allez construire un projet Django qui affichera les informations droplet de votre compte DigitalOcean en utilisant l’API DigitalOcean v2. Plus précisément, vous allez créer un site web qui affichera un tableau de Droplets énumérant chacun(e) de leurs adresses IP, ID, régions d’hébergement et ressources. Votre site web utilisera BulmaCSS pour le style de la page afin que vous puissiez vous concentrer sur le développement tout en ayant quelque chose d’agréable à regarder à la fin.
Une fois que vous avez terminé ce tutoriel, vous aurez un projet Django capable de produire une page web qui ressemble à ceci :
Avant de commencer ce guide, vous aurez besoin des éléments suivants :
do_django_api
pour notre répertoire de projet et env
pour notre environnement virtuel.À partir de l’environnement virtuel env
, installez Django
- pip install Django
Vous pouvez maintenant démarrer un projet Django et exécuter certaines commandes initiales d’installation.
Utilisez django-admin startproject <nom>
pour créer un sous-répertoire dans le dossier du projet nommé d’après votre projet Django, puis passez dans ce répertoire.
- django-admin startproject do_django_project
- cd do_django_project
Une fois qu’il est créé, à l’intérieur de ce sous-répertoire, vous trouverez manage.py
, qui est le moyen habituel d’interagir avec Django et d’exécuter votre projet. Utilisez migrate
pour mettre à jour la base de données de développement de Django :
- python3 manage.py migrate
Vous verrez des sorties qui ressemblent à ceci pendant que la base de données se met à jour :
OutputOperations to perform:
Apply all migrations: admin, auth, contenttypes, sessions
Running migrations:
Applying contenttypes.0001_initial... OK
Applying auth.0001_initial... OK
Applying admin.0001_initial... OK
Applying admin.0002_logentry_remove_auto_add... OK
Applying admin.0003_logentry_add_action_flag_choices... OK
Applying contenttypes.0002_remove_content_type_name... OK
Applying auth.0002_alter_permission_name_max_length... OK
Applying auth.0003_alter_user_email_max_length... OK
Applying auth.0004_alter_user_username_opts... OK
Applying auth.0005_alter_user_last_login_null... OK
Applying auth.0006_require_contenttypes_0002... OK
Applying auth.0007_alter_validators_add_error_messages... OK
Applying auth.0008_alter_user_username_max_length... OK
Applying auth.0009_alter_user_last_name_max_length... OK
Applying auth.0010_alter_group_name_max_length... OK
Applying auth.0011_update_proxy_permissions... OK
Applying sessions.0001_initial... OK
Ensuite, utilisez la commande runserver
pour exécuter le projet afin que vous puissiez le tester :
- python3 manage.py runserver
La sortie ressemblera à ceci pendant que le serveur démarre :
OutputWatching for file changes with StatReloader
Performing system checks...
System check identified no issues (0 silenced).
September 22, 2019 - 22:57:07
Django version 2.2.5, using settings 'do_django_project.settings'
Starting development server at http://127.0.0.1:8000/
Quit the server with CONTROL-C.
Vous avez maintenant un projet Django de base et un serveur de développement qui fonctionne. Pour visualiser votre serveur de développement en cours de fonctionnement, visitez le site 127.0.0.1:8000
dans un navigateur. Cela affichera la page de démarrage Django :
Ensuite, vous allez créer une app Django et configurer votre projet pour qu’il lance une vue à partir de cette app, de façon à voir quelque chose de plus intéressant que la page par défaut.
Dans cette étape, vous allez créer le squelette de l’app qui contiendra vos résultats Droplet. Vous reviendrez dans cette app plus tard, une fois que vous aurez configuré l’appel API pour l’alimenter avec des données.
Vérifiez que vous vous trouvez dans le répertoire do_django_project
et créez une app Django en utilisant la commande suivante :
- python3 manage.py startapp display_droplets
Vous devez maintenant ajouter la nouvelle app à INSTALLED_APPS
dans le fichier settings.py
, de sorte que Django la reconnaisse. settings.py
est un fichier de configuration Django qui est situé dans un autre sous-répertoire du projet Django et qui a le même nom que le dossier du projet (do_django_project
). Django a créé les deux dossiers pour vous. Passez au répertoire do_django_project
- cd do_django_project
Modifiez settings.py
dans l’éditeur de votre choix :
- nano settings.py
Ajoutez votre nouvelle app à la section INSTALLED_APPS
du fichier :
INSTALLED_APPS = [
'django.contrib.admin',
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles',
# The new app
'display_droplets',
]
Enregistrez et fermez le fichier lorsque vous avez fini de le modifier.
Ensuite, vous allez créer une fonction, GetDroplets
, dans le fichier views.py
de l’app display_droplets
. Cette fonction rendra le modèle que vous utiliserez pour afficher les données Droplet, en tant que context
, à partir de l’API. context
est un dictionnaire qui est utilisé pour prendre des données du code Python et les envoyer à un modèle HTML afin qu’elles puissent être affichées dans une page web.
Passez au répertoire display_droplets
:
- cd ..
- cd display_droplets
Ouvrez views.py
pour le modifier :
- nano views.py
Ajoutez le code suivant au fichier :
from django.views.generic import TemplateView
class GetDroplets(TemplateView):
template_name = 'droplets.html'
def get_context_data(self, *args, **kwargs):
pass
Enregistrez et fermez le fichier.
Plus tard, vous allez alimenter cette fonction et créer le fichier droplets.html
; mais d’abord, configurons urls.py
pour appeler cette fonction lorsque vous visiterez le répertoire root du serveur de développement (127.0.0.1:8
000).
Revenez au répertoire do_django_project
:
- cd ..
- cd do_django_project
Ouvrez urls.py
pour le modifier :
- nano urls.py
Ajoutez une déclaration import
pour GetDroplets
, puis ajoutez un chemin supplémentaire à urlpatterns
qui pointera vers la nouvelle vue.
from django.contrib import admin
from django.urls import path
from display_droplets.views import GetDroplets
urlpatterns = [
path('admin/', admin.site.urls),
path('', GetDroplets.as_view(template_name='droplets.html'), name='Droplet View'),
]
Si vous souhaitez créer vos propres chemins personnalisés, le premier paramètre est l’URL (comme exemple.com/**admin**
), le deuxième paramètre est la fonction à appeler pour produire la page web, et le troisième est juste un nom pour le chemin.
Enregistrez et fermez le fichier.
Ensuite, vous allez travailler avec des modèles. Les modèles sont des fichiers HTML que Django utilise pour créer des pages web. Dans le cas présent, vous utiliserez un modèle pour construire une page HTML qui affiche les données API.
Revenez au répertoire display_droplets
:
- cd ..
- cd display_droplets
À l’intérieur de ce répertoire, créez un dossier modèle
et passez à ce répertoire :
- mkdir templates
- cd templates
Créez droplets.html
et ouvrez-le pour le modifier :
- nano droplets.html
Afin d’éviter d’avoir à écrire un quelconque CSS pour ce projet, nous utiliserons Bulma CSS car c’est un cadre CSS gratuit et léger qui vous permet de créer des pages web soignées simplement en ajoutant quelques attributs de classe au HTML.
Maintenant, créons un modèle avec une barre de navigation de base. Ajoutez le code suivant au fichier droplets.html
:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>DigitalOcean Droplets</title>
<link crossorigin="anonymous"
href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.7.4/css/bulma.min.css"
integrity="sha256-8B1OaG0zT7uYA572S2xOxWACq9NXYPQ+U5kHPV1bJN4="
rel="stylesheet"/>
<link rel="shortcut icon" type="image/png" href="https://assets.digitalocean.com/logos/favicon.png"/>
</head>
<body>
<nav aria-label="main navigation" class="navbar is-light" role="navigation">
<div class="navbar-brand">
<div class="navbar-item">
<img atl="DigitalOcean" src="https://assets.digitalocean.com/logos/DO_Logo_icon_blue.png"
style="margin-right: 0.5em;">Droplets
</div>
</div>
</nav>
</body>
</html>
Enregistrez et fermez le fichier.
Ce code importe Bulma en HTML standard et crée une barre nav
affichant “Droplets”.
Rafraîchissez l’onglet de votre navigateur pour visualiser les modifications que vous avez apportées au modèle.
Jusqu’à présent, vous n’avez touché à rien en rapport avec les API ; vous avez créé une base pour le projet. Ensuite, vous mettrez cette page à profit en faisant un appel API et en présentant les données des Droplets.
Au cours de cette étape, vous allez mettre en place un appel API et envoyer les données des Droplets comme contexte au modèle à afficher dans un tableau.
Revenez au répertoire de l’app display_droplets
- cd ..
Installez la bibliothèque de requêtes
afin que vous puissiez parler à l’API :
- pip install requests
La bibliothèque de requêtes
permet à votre code de demander des données aux API et d’ajouter des en-têtes (données supplémentaires envoyées avec notre requête).
Maintenant, vous allez créer un fichier services.py
, dans lequel vous effectuerez l’appel API. Cette fonction utilisera requests
pour parler à https://api.digitalocean.com/v2/droplets
et ajouter chaque Droplet du fichier JSON renvoyé à une liste.
Ouvrez services.py
pour le modifier :
- nano services.py
Ajoutez le code suivant au fichier :
import os
import requests
def get_droplets():
url = 'https://api.digitalocean.com/v2/droplets'
r = requests.get(url, headers={'Authorization':'Bearer %s' % 'access_token'})
droplets = r.json()
droplet_list = []
for i in range(len(droplets['droplets'])):
droplet_list.append(droplets['droplets'][i])
return droplet_list
Dans la fonction get_droplets
, deux choses se produisent : une requête est faite et les données sont analysées. url
contient l’URL demandant les données des Droplets de l’API DigitalOcean. r
stocke les données demandées.
requests
a deux paramètres dans ce cas : url
et headers
. Si vous voulez des données provenant d’une API différente, vous devez remplacer la valeur url
par l’URL appropriée. headers
envoie à DigitalOcean votre jeton d’accès, afin qu’il sache que vous êtes autorisé à faire la demande et pour quel compte la demande est effectuée.
droplets
contient les informations de la variable r
, mais maintenant elle a été convertie à partir de JSON
(format dans lequel l’API envoie des informations), dans un dictionnaire facile à utiliser au sein d’une boucle for
.
Les trois lignes suivantes créent un tableau,droplet_list[]
. Ensuite, une boucle for
itère les informations en droplets
et ajoute chaque élément à la liste. Toutes les informations extraites de l’API et stockées dans les droplets
peuvent être trouvées dans les Developer Docs de DigitalOcean.
Remarque : n’oubliez pas de remplacer access_token
par votre jeton d’accès. En outre, conservez-le et ne publiez jamais ce jeton en ligne.
Enregistrez et fermez le fichier.
Vous devez toujours cacher votre jeton d’accès, mais au cas où quelqu’un voudrait exécuter votre projet, vous devez disposer d’un moyen facile pour qu’il puisse ajouter son propre jeton d’accès sans avoir à modifier le code Python. DotENV est la solution, car les variables sont conservées dans un fichier .env
qui peut être facilement modifié.
Revenez au répertoire do_django_project
:
- cd ..
Pour commencer à travailler avec des variables d’environnement, installez python-dotenv
:
- pip install python-dotenv
Une fois qu’il est installé, vous devez configurer Django pour gérer les variables d’environnement, afin de pouvoir les référencer dans le code. Pour ce faire, vous devez ajouter quelques lignes de code à manage.py
et à wsgi.py
.
Ouvrez manage.py
pour le modifier :
- nano manage.py
Ajoutez le code suivant :
"""Django's command-line utility for administrative tasks."""
import os
import sys
import dotenv
def main():
os.environ.setdefault('DJANGO_SETTINGS_MODULE', 'do_django_project.settings')
try:
from django.core.management import execute_from_command_line
except ImportError as exc:
raise ImportError(
"Couldn't import Django. Are you sure it's installed and "
"available on your PYTHONPATH environment variable? Did you "
"forget to activate a virtual environment?"
) from exc
execute_from_command_line(sys.argv)
if __name__ == '__main__':
main()
dotenv.load_dotenv(
os.path.join(os.path.dirname(__file__), '.env')
)
L’ajout de ceci dans manage.py
signifie que lorsque vous envoyez des commandes à Django en cours de développement, il gère les variables d’environnement de votre fichier .env
.
Enregistrez et fermez le fichier.
Si jamais vous avez de besoin de gérer des variables d’environnement dans vos projets de production, vous pouvez le faire à partir du fichier wsgi.py
. Passez au répertoire do_django_project
:
- cd do_django_project
Et ouvrez wsgi.py
pour le modifier :
- nano wsgi.py
Ajoutez le code suivant à wsgi.py
:
import os
import dotenv
from django.core.wsgi import get_wsgi_application
os.environ.setdefault('DJANGO_SETTINGS_MODULE', 'do_django_project.settings')
dotenv.load_dotenv(
os.path.join(os.path.dirname(os.path.dirname(__file__)), '.env')
)
application = get_wsgi_application()
Ce fragment de code a un os.path.dirname()
supplémentaire parce que wsgi.py
doit remonter deux répertoires pour trouver le fichier .env
. Ce fragment n’est pas le même que celui utilisé pour manage.py
.
Enregistrez et fermez le fichier.
Vous pouvez maintenant utiliser une variable d’environnement dans services.py
au lieu de votre jeton d’accès. Revenez au répertoire display_droplets
:
- cd ..
- cd display_droplets
Ouvrez services.py
pour le modifier :
- nano services.py
Maintenant, remplacez votre jeton d’accès par une variable d’environnement :
import os
import requests
def get_droplets():
url = "https://api.digitalocean.com/v2/droplets"
r = requests.get(url, headers={'Authorization':'Bearer %s' % os.getenv('DO_ACCESS_TOKEN')})
droplets = r.json()
droplet_list = []
for i in range(len(droplets['droplets'])):
droplet_list.append(droplets['droplets'][i])
return droplet_list
Enregistrez et fermez le fichier.
L’étape suivante consiste à créer un fichier .env
. Revenez au répertoire do_django_project
:
- cd ..
Créez un fichier .env
et gardez le ouvert le fichier pour le modifier :
- nano .env
Dans .env
, ajoutez votre jeton en tant que variable DO_ACCESS_TOKEN
DO_ACCESS_TOKEN=access_token
Enregistrez et fermez le fichier.
Remarque : ajoutez .env
à votre fichier .gitignore
afin qu’il ne soit jamais inclus dans vos validations.
La connexion API est maintenant installée et configurée, et vous avez également protégé votre jeton d’accès. Il est temps de présenter à l’utilisateur les informations que vous avez récupérées.
Maintenant que vous savez faire des appels API, vous devez envoyer les données des Droplets au modèle, pour le rendu. Revenons au fragment de la fonction, GetDroplets
, que vous avez créé plus tôt dans views.py
. Dans la fonction, vous enverrez droplet_list
comme contexte au modèle droplets.html
.
Passez au répertoire display_droplets
:
- cd display_droplets
Ouvrez views.py
pour le modifier :
- nano views.py
Ajoutez le code suivant à views.py
:
from django.shortcuts import render
from django.views.generic import TemplateView
from .services import get_droplets
class GetDroplets(TemplateView):
template_name = 'droplets.html'
def get_context_data(self, *args, **kwargs):
context = {
'droplets' : get_droplets(),
}
return context
Les informations envoyées au modèle droplets.html
sont traitées via le dictionnaire context
. C’est pourquoi droplets
agit comme une clé et le tableau renvoyé à partir de get_droplets()
agit comme une valeur.
Enregistrez et fermez le fichier.
Dans le modèle droplets.html
, vous allez créer un tableau et le remplir avec les données des droplets.
Passez au répertoire templates
:
- cd templates
Ouvrez droplets.html
pour le modifier :
- nano droplets.html
Ajoutez le code suivant après l’élément nav
dans droplets.html
:
<table class="table is-fullwidth is-striped is-bordered">
<thead>
<tr>
<th>Name</th>
<th>IPv4 Address(es)</th>
<th>Id</th>
<th>Region</th>
<th>Memory</th>
<th>CPUs</th>
<th>Disk Size</th>
</tr>
</thead>
<tbody>
{% for droplet in droplets %}
<tr>
<th>{{ droplet.name }}</th>
{% for ip in droplet.networks.v4 %}
<td>{{ ip.ip_address }}</td>
{% endfor %}
<td>{{ droplet.id }}</td>
<td>{{ droplet.region.name }}</td>
<td>{{ droplet.memory }}</td>
<td>{{ droplet.vcpus }}</td>
<td>{{ droplet.disk }}</td>
</tr>
{% endfor %}
</tbody>
</table>
{% for droplet in droplets %} ... {% end for %}
est une boucle qui itére à travers le tableau de Droplets récupéré dans views.py
. Chaque droplet est inséré dans une rangée de table. Les différentes lignes {{ droplet.<attribut> }}
récupèrent cet attribut pour chaque Droplet de la boucle, et l’insèrent dans une cellule de la table.
Enregistrez et fermez le fichier.
Actualisez votre navigateur et vous verrez une liste de Droplets.
Vous pouvez maintenant gérer l’API DigitalOcean dans vos projets Django. Vous avez pris les données extraites de l’API et les avez insérées dans le modèle que vous avez créé précédemment, pour afficher les informations de manière lisible et souple.
Dans cet article, vous avez construit un projet Django qui peut afficher les informations de Droplets à partir de l’API DigitalOcean avec un style Bulma CSS. Vous avez acquis trois compétences importantes en suivant ce tutoriel :
requests
et json
.view
et template
.dotenv
dans Django.Maintenant que vous avez été initié à la manipulation des API dans Django, vous pouvez créer votre propre projet en utilisant soit une autre fonctionnalité de l’API DigitalOcean, soit une toute autre API. Vous pouvez également consulter d’autres tutoriels Django, ou un tutoriel similaire avec le cadre React.
Thanks for learning with the DigitalOcean Community. Check out our offerings for compute, storage, networking, and managed databases.
This textbox defaults to using Markdown to format your answer.
You can type !ref in this text area to quickly search our full set of tutorials, documentation & marketplace offerings and insert the link!
Sign up for Infrastructure as a Newsletter.
Working on improving health and education, reducing inequality, and spurring economic growth? We'd like to help.
Get paid to write technical tutorials and select a tech-focused charity to receive a matching donation.
Hi and thank you for this tutorial! I am learning how to code with Django, and I wonder why classes are written in views.py instead of models.py. Isn’t views.py for http and models for all classes? Thank you in advance