1. Installation de Django

Pour commencer, assurez-vous d'avoir Django installé. Ouvrez votre terminal et exécutez la commande suivante :

pip install django

2. Créer une application simple

Nous allons créer une application web simple. Créez un nouveau projet Django nommé mon_site en utilisant la commande suivante :

django-admin startproject mon_site

3. Créer une vue simple

Dans le dossier mon_site, ouvrez le fichier views.py et ajoutez le code suivant :

from django.http import HttpResponse

def index(request):
    return HttpResponse("Bienvenue sur mon site !")

4. Configurer les URL

Pour que cette vue soit accessible, vous devez configurer les URL. Ouvrez le fichier urls.py et ajoutez la route suivante :

from django.urls import path
from .views import index

urlpatterns = [
    path('', index, name='index'),
]

Cette configuration permet d'accéder à votre vue via http://127.0.0.1:8000/.

5. Démarrer le serveur

Pour démarrer votre application, exécutez la commande suivante dans le répertoire de votre projet :

python manage.py runserver

Accédez à http://127.0.0.1:8000/ dans votre navigateur pour voir le message.

6. Ajouter des routes supplémentaires

Ajoutons une nouvelle route à notre application. Modifiez le fichier urls.py pour inclure une route about :

def about(request):
    return HttpResponse("À propos de cette application")

urlpatterns = [
    path('', index, name='index'),
    path('about/', about, name='about'),
]

Vous pouvez maintenant accéder à cette nouvelle route via http://127.0.0.1:8000/about.

7. Servir des fichiers statiques

Pour servir des fichiers statiques, créez un dossier static dans votre projet et ajoutez-y un fichier HTML. Modifiez votre vue pour le servir :

from django.shortcuts import render

def index(request):
    return render(request, 'index.html')

Accédez à votre fichier HTML via http://127.0.0.1:8000/static/index.html.

8. Conclusion

Vous avez maintenant les bases pour créer une application web avec Django. Ce tutoriel vous a montré comment créer des vues, gérer des URL et servir des fichiers statiques. Explorez davantage les fonctionnalités de Django pour développer des applications plus complexes !

Activité 1 – Votre première application Django

Bienvenue dans cette activité où vous allez poser les premières pierres d’une application web grâce à Django, un framework Python puissant et complet. Nous allons découvrir, étape par étape, comment créer une structure de projet, manipuler des vues, gérer les requêtes, et afficher des pages HTML à l’aide de templates. Prêt·e ? Allons-y !

1. Prérequis

Avant de vous lancer, assurez-vous que Django est bien installé sur votre machine. Si ce n’est pas encore fait, ouvrez un terminal et entrez la commande suivante :

pip install django

2. Structure du projet

Créons maintenant un dossier de projet – par exemple rascof. À l’intérieur, organisez vos fichiers comme suit pour garder un code propre et clair :

3. Créer vos premières pages HTML

Django fonctionne avec des templates HTML placés dans un dossier templates. Commençons par créer quelques pages clés :

1️⃣ inscription.html – formulaire d'inscription

⌨️

2️⃣ connexion.html – page de connexion

⌨️

3️⃣ profil.html – fiche utilisateur

⌨️

4️⃣ dashboard.html – tableau de bord

⌨️

4. Ajouter le cœur de votre application : views.py

Passons maintenant au script principal : views.py. Ce fichier sera le cerveau de votre application Django.

⌨️

⌨️

⌨️

⌨️

5. Migrations dans Django

Lorsque vous créez ou modifiez vos modèles dans le fichier models.py, vous devez effectuer une migration pour mettre à jour votre base de données. Utilisez les commandes suivantes :

• python manage.py makemigrations – Crée les fichiers de migration basés sur vos modifications dans les modèles.
• python manage.py migrate – Applique ces migrations à la base de données.

Ces commandes garantissent que votre base de données est synchronisée avec vos modèles Django. Vous ne devez pas oublier d'exécuter ces étapes chaque fois que vous modifiez un modèle.

6. Lancer votre application

Il est temps de faire vivre votre application ! Exécutez simplement le fichier Python :

python manage.py runserver

Puis rendez-vous sur http://127.0.0.1:8000 depuis votre navigateur. 🎉

6. À vous de jouer ! Passez à la vitesse supérieure

🚀 Vous avez maintenant une application fonctionnelle. Pourquoi ne pas aller plus loin ? Voici trois missions pour muscler votre code et vos compétences.

• 📝 Mission 1 — Créez une nouvelle vue : Ajoutez une vue /about (ou autre) et faites-la apparaître dans votre menu. Affichez-y un message personnalisé ou votre photo de profil, par exemple.
• 📝 Mission 2 — Organisez votre code : Déplacez le modèle User dans un fichier séparé models.py pour respecter une bonne organisation MVC.
  • 1️⃣ Créez votre modèle dans models.py.
  • 2️⃣ Importez ensuite User dans views.py depuis models.py.
• 📝 Mission 3 — Utilisez une vraie base de données : Passez de SQLite à MySQL pour un environnement plus réaliste :
  • 1️⃣ Installez XAMPP ou WAMP sur votre machine.
  • 2️⃣ Créez une base de données nommée par exemple django_app.
  • 3️⃣ Modifiez la ligne dans settings.py :

  DATABASES = {
      'default': {
          'ENGINE': 'django.db.backends.mysql',
          'NAME': 'django_app',
          'USER': 'root',
          'PASSWORD': 'password',
          'HOST': 'localhost',
          'PORT': '3306',
      }
  }
      

  • N'oubliez pas d'installer le module mysqlclient avec pip install mysqlclient.

💬 Ces ajustements vous rapprochent d’un code professionnel. Prenez votre temps et amusez-vous à tester !

7. Bravo !

Vous avez mis en place une application web complète avec Django ! 🎯
Ce n’est que le début : vous pouvez maintenant enrichir votre projet avec des formulaires, une base de données, du CSS personnalisé… L’aventure ne fait que commencer.

Activité 2 - Site Dynamique avec Django

Dans cette activité, vous allez créer un site dynamique avec Django. Vous implémenterez une page de login et de signup, en utilisant une base de données SQLite pour stocker les informations des utilisateurs.

1. Prérequis

Avant de commencer, assurez-vous d'avoir Django et SQLite installés. Si ce n'est pas le cas, exécutez la commande suivante :

pip install django

2. Créer la structure de votre projet

Créez un dossier pour votre projet, par exemple mon_site_dynamique, et initialisez un projet Django :

django-admin startproject mon_site_dynamique

Ensuite, déplacez-vous dans le répertoire du projet :

cd mon_site_dynamique

3. Créer la base de données

Django crée une base de données SQLite par défaut. Pour créer les tables nécessaires, exécutez la commande suivante :

python manage.py migrate

4. Créer les fichiers HTML

Dans le dossier templates, créez les fichiers suivants :

•             1️⃣ signup.html : pour la page de signup.
•             2️⃣ login.html : pour la page de login.

Voici le contenu de signup.html :

<!DOCTYPE html>
<html lang="fr">
<head>
    <meta charset="UTF-8">
    <title>Inscription</title>
</head>
<body>
    <h1>Créer un compte</h1>
    <form action="{% url 'signup' %}" method="post">
        {% csrf_token %}
        <label for="username">Nom d'utilisateur:</label>
        <input type="text" id="username" name="username" required>

        <label for="password">Mot de passe:</label>
        <input type="password" id="password" name="password" required>

        <input type="submit" value="S'inscrire">
    </form>
</body>
</html>

Et voici le contenu de login.html :

<!DOCTYPE html>
<html lang="fr">
<head>
    <meta charset="UTF-8">
    <title>Connexion</title>
</head>
<body>
    <h1>Se connecter</h1>
    <form action="{% url 'login' %}" method="post">
        {% csrf_token %}
        <label for="username">Nom d'utilisateur:</label>
        <input type="text" id="username" name="username" required>

        <label for="password">Mot de passe:</label>
        <input type="password" id="password" name="password" required>

        <input type="submit" value="Se connecter">
    </form>
</body>
</html>

5. Créer le fichier Python principal

Dans le dossier principal, ouvrez le fichier views.py et ajoutez le code suivant :

from django.shortcuts import render, redirect
from django.contrib.auth.models import User
from django.contrib import messages

def signup(request):
    if request.method == 'POST':
        username = request.POST['username']
        password = request.POST['password']
        User.objects.create_user(username=username, password=password)
        messages.success(request, 'Inscription réussie !')
        return redirect('login')
    return render(request, 'signup.html')

def login(request):
    if request.method == 'POST':
        username = request.POST['username']
        password = request.POST['password']
        user = authenticate(request, username=username, password=password)
        if user:
            login(request, user)
            return redirect('index')
        messages.error(request, 'Nom d'utilisateur ou mot de passe incorrect.')
    return render(request, 'login.html')

6. Configurer les URL

Ouvrez le fichier urls.py et configurez les routes pour les vues :

from django.urls import path
from .views import signup, login

urlpatterns = [
    path('signup/', signup, name='signup'),
    path('login/', login, name='login'),
]

7. Démarrer le serveur

Pour démarrer le serveur, exécutez la commande :

python manage.py runserver

Accédez à http://127.0.0.1:8000/signup pour vous inscrire et à http://127.0.0.1:8000/login pour vous connecter.

8. Conclusion

Vous avez maintenant créé un site dynamique avec Django, comprenant des pages de login et de signup, ainsi qu'une base de données pour gérer les utilisateurs. Explorez davantage en ajoutant des fonctionnalités comme la réinitialisation de mot de passe ou l'authentification par session !

Dans ce cours, nous allons examiner en détail l'activité 2, où vous avez créé un site dynamique avec Django, comprenant des pages de login et de signup, ainsi qu'une base de données SQLite pour gérer les utilisateurs. Nous allons décomposer chaque partie du code et expliquer son fonctionnement.

1. Prérequis

Avant de commencer, assurez-vous d'avoir installé Django et SQLite. Ces outils sont essentiels pour le développement de votre application web dynamique.

2. Structure du projet

La structure de votre projet se compose de :

•                 1️⃣ static : pour les fichiers CSS et JavaScript.
•                 2️⃣ templates : pour les fichiers HTML (signup et login).

3. Création de la base de données

Django crée une base de données SQLite par défaut. Pour créer les tables nécessaires, exécutez la commande suivante :

python manage.py migrate

Cette commande initialise la base de données et crée les tables requises par Django.

4. Fichiers HTML - Pages de login et signup

Les fichiers signup.html et login.html contiennent des formulaires pour l'inscription et la connexion :

Voici le contenu de signup.html :

<!DOCTYPE html>
<html lang="fr">
<head>
    <meta charset="UTF-8">
    <title>Inscription</title>
</head>
<body>
    <h1>Créer un compte</h1>
    <form action="{% url 'signup' %}" method="post">
        {% csrf_token %}
        <label for="username">Nom d'utilisateur:</label>
        <input type="text" id="username" name="username" required>
        <label for="password">Mot de passe:</label>
        <input type="password" id="password" name="password" required>
        <input type="submit" value="S'inscrire">
    </form>
</body>
</html>

Et voici le contenu de login.html :

<!DOCTYPE html>
<html lang="fr">
<head>
    <meta charset="UTF-8">
    <title>Connexion</title>
</head>
<body>
    <h1>Se connecter</h1>
    <form action="{% url 'login' %}" method="post">
        {% csrf_token %}
        <label for="username">Nom d'utilisateur:</label>
        <input type="text" id="username" name="username" required>
        <label for="password">Mot de passe:</label>
        <input type="password" id="password" name="password" required>
        <input type="submit" value="Se connecter">
    </form>
</body>
</html>

5. Fichier Python principal

Le fichier views.py contient la logique de l'application :

from django.shortcuts import render, redirect
from django.contrib.auth.models import User
from django.contrib import messages

def signup(request):
    if request.method == 'POST':
        username = request.POST['username']
        password = request.POST['password']
        User.objects.create_user(username=username, password=password)
        messages.success(request, 'Inscription réussie !')
        return redirect('login')
    return render(request, 'signup.html')

def login(request):
    if request.method == 'POST':
        username = request.POST['username']
        password = request.POST['password']
        user = authenticate(request, username=username, password=password)
        if user:
            login(request, user)
            return redirect('index')
        messages.error(request, 'Nom d'utilisateur ou mot de passe incorrect.')
    return render(request, 'login.html')

6. Explication du code

7. Démarrer le serveur

Pour démarrer votre application, utilisez la commande suivante :

python manage.py runserver

8. Conclusion

Vous avez maintenant une compréhension détaillée de la façon dont le site dynamique fonctionne avec Django. Vous avez créé des pages de login et de signup et utilisé SQLite pour gérer les utilisateurs. Explorez davantage en ajoutant des fonctionnalités avancées, comme la réinitialisation de mot de passe ou l'authentification par session !