- Accueil - Présentation générale de l'entreprise - Image de la page d'accueil avec des produits en avant - Liens rapides vers Services & Produits et Contacts - Témoignages ou avis clients - Présentation (Menu déroulant) - **À propos** - Historique de l'entreprise - Mission et vision - Valeurs et engagements - Nos partenaires et certifications - **Présentation générale** - Résumé de l'entreprise et de ses services - Services & Produits (Menu déroulant) - **Produits** - **Moteurs** - Description détaillée des moteurs (types, spécifications, modèles) - Options disponibles (neuf, reconditionné) - Prix (si applicable) - **Pièces détachées** - Catégories de pièces (moteurs, transmissions, suspension, etc.) - Liste des produits avec description et photos - Disponibilité et options de commande - **Services** - Livraison - Installation - Maintenance - Conseils techniques - **FAQ** - Réponses aux questions fréquemment posées (livraison, retours, garanties, etc.) - Contacts - Formulaire de contact - Adresse physique : Km 12, route de Rufisque, Dakar, Sénégal - Numéro de téléphone et email - Liens vers les réseaux sociaux - Carte interactive (Google Maps) - Administration (Page privée) - **Gestion des pages** - Ajouter/Modifier/Supprimer des pages du site - Accueil - Présentation - Services & Produits - Contacts - FAQ - **Gestion des produits** - Ajouter/Modifier/Supprimer des produits (moteurs, pièces détachées) - **Gestion des services** - Ajouter/Modifier/Supprimer des services (livraison, installation, maintenance) - **Gestion des contacts** - Consulter les demandes de contact ou les messages des utilisateurs - **Paramètres généraux** - Modifier les informations du site (texte d'introduction, horaires, etc.) - **Gestion des utilisateurs** - Gérer les administrateurs et les permissions d'accès - **Gestion des commandes** - Suivi des commandes ou demandes de produits **Langages et technologies à utiliser pour le développement du site :** - **HTML** : Structure de base des pages du site (accueil, présentation, services & produits, etc.) - **CSS** : Mise en forme et style des pages, y compris la disposition des éléments, les couleurs et la typographie. - **JavaScript (avec Bootstrap)** : Interaction dynamique et responsive des pages, gestion des éléments cliquables, formulaires, etc. Bootstrap sera utilisé pour le design réactif et les composants d'interface utilisateur. - **Flask (Backend)** : Pour gérer les requêtes, les formulaires de contact, l'administration du site, la gestion des produits, et le stockage des informations côté serveur. - **SQLite (Base de données)** : Base de données légère et intégrée pour stocker les informations sur les produits, les utilisateurs, les contacts, et les commandes. SQLite est pratique pour les applications locales et petites à moyennes applications web. - **Tables recommandées** : - `Produits` : id, nom, description, prix, image, catégorie, disponibilité - `Utilisateurs` : id, nom, email, mot de passe, rôle (admin, utilisateur) - `Commandes` : id, utilisateur_id, produit_id, quantité, statut, date - `Contacts` : id, nom, email, message, date - `Paramètres` : id, texte d'introduction, horaires, autres paramètres - `FAQ` : id, question, réponse ![Plan de travail 1.png](attachment:cea60ae8-8c35-43de-ae5c-2740221a891d:Plan_de_travail_1.png) ![Plan de travail 1.png](attachment:09cce8de-8e3c-4508-98ba-85f5f8da37f6:Plan_de_travail_1.png) Pour exécuter le projet en local sur votre propre ordinateur, voici les étapes à suivre: Prérequis 1. Python 3.11 ou version supérieure installé sur votre ordinateur 2. PostgreSQL installé et configuré 3. Git (pour cloner le projet) Étapes pour exécuter en local 1. **Cloner le projet** ``` git clone cd ``` 2. **Créer un environnement virtuel Python** ``` python -m venv venv ``` 3. **Activer l'environnement virtuel** - Sur Windows: ``` venv\Scripts\activate ``` - Sur macOS/Linux: ``` source venv/bin/activate ``` 4. **Installer les dépendances** ``` pip install flask flask-login flask-sqlalchemy flask-wtf email-validator gunicorn psycopg2-binary ``` 5. **Configurer la base de données** - Créez une base de données PostgreSQL - Configurez la variable d'environnement DATABASE_URL avec votre chaîne de connexion: ``` # Sur Windows set DATABASE_URL=postgresql://utilisateur:mot_de_passe@localhost:5432/nom_de_la_base # Sur macOS/Linux export DATABASE_URL=postgresql://utilisateur:mot_de_passe@localhost:5432/nom_de_la_base ``` 6. **Démarrer l'application** ``` # Si vous voulez utiliser le mode développement flask run # Ou avec gunicorn (recommandé pour la production) gunicorn --bind 0.0.0.0:5000 main:app ``` 7. **Accéder à l'application** Ouvrez votre navigateur et accédez à `http://localhost:5000` Structure du projet - `main.py`: Point d'entrée de l'application - `app.py`: Configuration de l'application Flask - `models.py`: Modèles de données - `forms.py`: Formulaires WTForms - `routes.py`: Routes principales - `admin_routes.py`: Routes d'administration - `templates/`: Tous les templates HTML - `static/`: Fichiers statiques (CSS, JavaScript, images) Initialisation de la base de données Lors du premier démarrage, la base de données sera automatiquement créée grâce au code dans `app.py`. Cependant, vous devrez créer un utilisateur administrateur manuellement pour accéder au panneau d'administration: ``` python -c " from app import app, db from models import User from werkzeug.security import generate_password_hash import datetime with app.app_context(): # Créer un utilisateur administrateur admin = User( username='admin', email='admin@example.com', password_hash=generate_password_hash('admin123'), role='admin', created_at=datetime.datetime.utcnow() ) db.session.add(admin) db.session.commit() print('Utilisateur administrateur créé avec succès') " ``` Vous pouvez vous connecter à l'interface d'administration en accédant à `/admin/login` avec le nom d'utilisateur `admin` et le mot de passe `admin123`. Avez-vous besoin d'autres informations sur l'installation ou le déploiement? ous devrez créer un utilisateur administrateur manuellement pour accéder au panneau d'administration: 1 minute ago TD [](data:image/svg+xml,%3csvg%20xmlns=%27http://www.w3.org/2000/svg%27%20version=%271.1%27%20width=%2724%27%20height=%2724%27/%3e) [](https://www.gravatar.com/avatar/564a462732abf82298d613a19b9f800f?d=blank&s=256) Integrating with Basic Email/Password Authentication Installed flask-login, flask-wtf Oui, il faut créer un utilisateur administrateur pour accéder au panneau d'administration. Lorsque vous installez le projet en local, vous devez le faire manuellement. Voici comment procéder: 1. Après avoir configuré votre base de données et installé toutes les dépendances, exécutez le script Python suivant: ``` from app import app, db from models import User from werkzeug.security import generate_password_hash import datetime with app.app_context(): # Vérifie si l'utilisateur admin existe déjà existing_admin = User.query.filter_by(username='admin').first() if not existing_admin: # Créer un utilisateur administrateur admin = User( username='admin', email='admin@example.com', password_hash=generate_password_hash('admin123'), role='admin', created_at=datetime.datetime.utcnow() ) db.session.add(admin) db.session.commit() print('Utilisateur administrateur créé avec succès') else: print('Un utilisateur administrateur existe déjà') ``` 1. Vous pouvez enregistrer ce script dans un fichier (par exemple `create_admin.py`) et l'exécuter avec la commande: ``` python create_admin.py ``` 2. Une fois l'utilisateur administrateur créé, vous pourrez vous connecter au panneau d'administration en accédant à: ``` http://localhost:5000/admin/login ``` 3. Utilisez les identifiants suivants: - Nom d'utilisateur: `admin` - Mot de passe: `admin123` Si vous souhaitez modifier les paramètres de l'administrateur (nom d'utilisateur, email, mot de passe), vous pouvez ajuster les valeurs dans le script ci-dessus avant de l'exécuter.