GithubHelp home page GithubHelp logo

sae_bde_getting_reworked's Introduction

projetBDE

Page Connexion : Entrez votre numéro étudiant et votre mot de passe afin de vous connecter sur le site du BDE.
Si vous n’avez pas de compte, cliquez sur le lien "Créer un compte” juste en bas du formulaire afin d’accéder à la page Inscription pour pouvoir créer un compte .
Si vous ne voulez pas créer de compte, vous pouvez cliquer sur le lien ”Se connecter en tant qu’inviter” afin d’accéder au site en tant que personne anonyme.

Page Inscription :
Page permettant de créer un compte pour un client, ces données seront stockées dans la base de données du BDE.
Pour pouvoir s’inscrire, il faudra donner son nom, prénom, numéro étudiant et un mot de passe.

Header :
→ Le logo du BDE qui sert de bouton pour revenir à la page d’accueil.
→ Un bouton catalogue qui permet au client d’aller à la page catalogue.
→ Le drapeau de l’Angleterre qui traduit la page en anglais
→ Un bouton Profil qui affiche un menu déroulant contenant la page “Mon Profil” et le bouton "Déconnexion".
pour la version du modérateur:
→ Un bouton Caddie qui permet au modérateur d’aller dans la page panier.
→ Un bouton Paramètre qui affiche un menu déroulant contenant la page “Mon Profil” et le bouton "Déconnexion".

Footer : Contient 3 Rubrique principale :
Nous contacter : qui contient L’adresse, l’adresse mail et le numéro de téléphone du BDE.
Réseaux Sociaux : contient deux icônes, celle d’Instagram et de TikTok. En cliquant sur une des deux icônes, l’utilisateur pourra être renvoyé vers le compte Instagram du BDE ou le compte TikTok du BDE.
Document Officiels : contient deux pages web, celui de la Mention légale qui contient les conditions générales d’utilisation. Et celui de la Charte qui contient toutes les règles à respecter au sein du BDE.

Site web version client

Page d’accueil:
→ Une partie où l’on présente les horaires de disponibilités du BDE.
→ Une deuxième partie dans laquelle on présente les moyens de paiements disponibles avec des images.
→ Une troisième partie dans laquelle il y a un diaporama automatique, qui défile les images des produits.

Page Catalogue:
→ Le client a accès au catalogue et peut voir les produits disponibles ainsi que leur prix.

Page Mon Profil:
→ Un bouton “Mes Informations Personnelles” qui envoie à la page Mes Informations Personnelles.
→ Un bouton “Mon historique” qui renvoie à la page mon historique d’achat.

Page Mes Informations Personnelles:
→ Un tableau qui affiche “le nom”, “le prénom”, et “le numéro étudiant” du client.

Page Mon historique:
→ Un tableau dans lequel il y a “le nom du produit acheté”, “la date”, “la quantité”, ainsi que “le prix”.

Page Charte:
→ Des blocs de texte structuré qui contiennent le règlement intérieur du BDE.

Page Mention légale:
→ Des blocs de texte structuré qui contiennent des informations tels que: “l’éditeur du site”, “l’hébergeur du site”, “les conditions générales d’utilisation”.

Site web version modérateur (membre du BDE):

Page d’accueil:
→ La page d’accueil est pareille que celle du client cependant la version du modérateur contient des changements dans le header (cité plus haut).

Page Catalogue:
→ Dans cette version, le modérateur a la même base que le client cependant, contrairement au client, le modérateur a un bouton ajouter dans le panier lui permet d’ajouter les produits sélectionnés dans le panier.

Page Panier:
→ La page affiche les produits sélectionnés sous forme d’un tableau dans lequel il y a “le nom du produit”, “la quantité” et “le prix du produit”.
→ Le prix total des produits achetés
→ Un mini formulaire où le modérateur écrit le numéro étudiant valide du client pour que le client puisse voir la transaction dans sa page historique.
→ Un bouton “payer” qui valide la transaction.

Page Paramètre:
→ Un bouton “Mes Informations Personnelles” qui envoie à la page Mes Informations Personnelles.
→ Un bouton “Historique de vente” qui envoie à la page Historique de vente.

Page mes informations personnelles:
→ Un tableau qui affiche “le nom”, “le prénom”, “le numéro étudiant” ainsi que le “grade” du membre du bde.

Page Historique de vente:
→ Un tableau dans lequel il y a “le nom de l’acheteur”, “le nom du produit acheté”, “la date”, “la quantité”, ainsi que “le prix”.

Page Mensualité:
→ Un tableau dans lequel il y a “le nom de l’acheteur”, “le nom du produit acheté”, “la date”, “la quantité”, ainsi que “le prix”. Cette page calcul et affiche la totalité des ventes effectuées pendant 1 mois.

Page Bilan:
→ Un tableau dans lequel il y a “le nom de l’acheteur”, “le nom du produit acheté”, “la date”, “la quantité”, ainsi que “le prix”. Cette page calcul et affiche la totalité des ventes effectuées pendant toute l’année.

Page Inventaire:
→ Un tableau dans lequel il y a “le nom des produits”, “la quantité”, “le prix”, et “changer la quantité” dans lequel se trouve un mini champ de texte qu’on doit remplir si on veut augmenter la quantité des produits.
→ Un bouton “ajouter un produit” qui ramène l’utilisateur dans la page ajouter un produit.

Page Ajouter un produit:
→ La page est composée d’un formulaire que l’utilisateur doit remplir pour ajouter des produits dans l’inventaire, un champ de texte qui contient “le lien de l’image”, “son prix”, “son nom”, “sa quantité”.

Compétences Acquises

La réalisation du projet "projetBDE" m'a permis de développer et de mettre en pratique un large éventail de compétences techniques et pratiques, tant du point de vue du développement web que de la gestion de projet :

  • Développement Front-end et Back-end : J'ai acquis de l'expérience dans le développement à la fois du front-end et du back-end, en utilisant des technologies telles que HTML, CSS, JavaScript, PHP et des frameworks comme Gradio pour créer des interfaces utilisateur conviviales et des fonctionnalités dynamiques.

  • Gestion de base de données : J'ai appris à concevoir et à manipuler des bases de données relationnelles, en utilisant des outils comme MySQL ou PostgreSQL pour stocker et gérer efficacement les données des utilisateurs, des produits et des transactions.

  • Authentification et autorisation : J'ai mis en place des systèmes d'authentification et d'autorisation sécurisés, permettant aux utilisateurs de se connecter, de créer des comptes et d'accéder à des fonctionnalités spécifiques en fonction de leurs rôles (client ou membre du BDE).

  • Déploiement d'application web : J'ai appris à déployer des applications web sur des serveurs en ligne, en utilisant des services d'hébergement comme Heroku ou AWS pour rendre l'application accessible au public de manière fiable et sécurisée.

  • Travail en équipe : Travailler avec une équipe de six personnes m'a permis de développer mes compétences en communication, en collaboration et en résolution de problèmes, en contribuant à tous les aspects du projet, de la conception à la mise en œuvre.

  • Gestion de projet agile : J'ai participé à la planification, à l'organisation et à l'exécution du projet selon une méthodologie agile, en utilisant des outils de suivi des tâches et de gestion de projet comme Trello ou Asana pour assurer un développement efficace et cohérent.

  • Développement de fonctionnalités avancées : J'ai implémenté des fonctionnalités avancées telles que la gestion des paniers d'achat, l'historique des transactions, le suivi des ventes mensuelles et annuelles, ainsi que la gestion de l'inventaire des produits.

  • Sécurité et conformité : J'ai pris en compte les aspects de sécurité et de conformité lors du développement de l'application, en mettant en œuvre des mesures pour protéger les données des utilisateurs et en respectant les réglementations en matière de protection des données.

sae_bde_getting_reworked's People

Contributors

sxfiene avatar billoinfo avatar kaiamin avatar m0tyr avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.