Scribd
Importer
93 vues14 pages

Mini-projet de développement web

Ce document décrit le développement d'une application de gestion de produits. Il présente les fonctionnalités de l'application telles que la connexion, l'ajout, la modification et la suppression de produits. Le document contient également le code PHP pour chaque fonctionnalité.

Transféré par

Abdel Gansonre
Copyright
© All Rights Reserved
Nous prenons très au sérieux les droits relatifs au contenu. Si vous pensez qu’il s’agit de votre contenu, signalez une atteinte au droit d’auteur ici.
Formats disponibles
Téléchargez aux formats ODT, PDF, TXT ou lisez en ligne sur Scribd
93 vues14 pages

Mini-projet de développement web

Ce document décrit le développement d'une application de gestion de produits. Il présente les fonctionnalités de l'application telles que la connexion, l'ajout, la modification et la suppression de produits. Le document contient également le code PHP pour chaque fonctionnalité.

Transféré par

Abdel Gansonre
Copyright
© All Rights Reserved
Nous prenons très au sérieux les droits relatifs au contenu. Si vous pensez qu’il s’agit de votre contenu, signalez une atteinte au droit d’auteur ici.
Formats disponibles
Téléchargez aux formats ODT, PDF, TXT ou lisez en ligne sur Scribd

ECOLE SUPERIEURE MULTINATIONALE DES

TELECOMMUNICATIONS
******************

RAPPORT DU PROJET DE : Développement web

THEME : Gestion de produits

MEMBRES DU GROUPE : PROFESSEUR :


Lassana DEMBE Abdoulaye DIENG
Galyam Boubacar Georges OUEDRAOGO

ANNEE ACADEMIQUE: 2021-2022


Plan du travail

I. Introduction

II. La présentation du fonctionnement de l’application à travers les différentes fonctionnalités

III. Conclusion

I. INTRODUCTION :
Un projet de développement web étant un ensemble d’actions coordonnées et implémentées dans le
but de développer un produit fonctionnant avec les exigences répondant ainsi à un besoin spécifique.
Pour notre cas, il s’agit d’un mini projet de gestion des produits (Location de voitures).

II. La présentation du fonctionnement de l’application à travers les différentes fonctionnalités :


Il s’agit des détails de manière explicite le rôle de chaque fonctionnalité intégrée dans le code pour le
fonctionnement de l’application en intégralité.

Ces différentes fonctionnalités sont les suivantes :

1) Connexion :

Cette page est la page principale qui contient le code de connexion à notre base de données à
l’intérieur de cette page, on a déclaré quatre (4) variables à savoir : serveur (le non du serveur), user
(le nom de l’utilisateur), pw (pour mot de passe) et bdd (le nom de notre base de données).

Toutes les autres pages qui seront créés vont appelés la page connexion à travers le lien suivant :
« require_once(‘[Link]’) »

Voici le code correspondant :

2) Index :

Dans cette partie, on a créé une barre de recherche qui permet à l’utilisateur d’exprimer son besoin de
voiture, on a aussi ajouté une vidéo de présentation des voitures (une fonctionnalité supplémentaire)
qui se joue lorsque l’utilisateur est en train de faire la recherche de voiture dans la barre de recherche.

On a créé le bouton Login qui permet à l’utilisateur de se connecter à la page d’accueil (tableau de
bord) pour pouvoir accéder aux autres fonctionnalités (ajouter, détails, modifier, supprimer). Le code
correspondant à cette partie est la suivante :
Après l’exécution de ces codes ci-dessus, on obtient l’interface suivant :
3) Login :

Il s’agit là, lorsque Ce bouton est appuyé, ça nous dirige vers la page de connexion demandant ainsi de
renseigner le nom de l’utilisateur et son mot de passe.

Alors deux conditions s’y pose :

- Si le mot de passe est correct, l’utilisateur accèdera à la page d’accueil pour pouvoir modifier,
supprimer, ou ajouter de voitures ;

- Si le mot de passe est incorrect, le message « Login ou mot de passe invalide lui sera
affiché ».

Voici le code correspondant :


Après l’exécution du code ci-dessus en cliquant sur le bouton Login, on obtient l’interface suivant :

Après avoir effectué la procédure de connexion tout en mettant correctement le nom de l’utilisateur et
le mot de passe (on rappelle qu’on a créé deux utilisateurs à savoir : aly avec 1234 comme son mot de
passe et NIANG avec 0000 comme son mot de passe), on accède au tableau de bord.

4) Tableau de bord :

Cette partie contient les différents paramètres indiqués dans le cahier de charge tels que : ajouter,
détails, modifier, supprimer.

Voici ce code y compris celui du pied de page :


Voici l’interface qui s’affiche :
Etant au niveau du tableau de bord, on voit la liste de toutes les voitures enregistrées, un pied de
page sur lequel s’affiche un message de marketing pour la société et on a la possibilité d’en ajouter
plus, de voir tous les détails, de modifier et de supprimer une ou des voitures si on le souhaite.

Après avoir effectué les différents paramètres, on peut quitter le tableau de bord juste en cliquant sur
« Déconnexion » en bas de la photo de profil de l’utilisateur connecté.

3-1) Ajouter :

Cette partie nous permet d’ajouter plus de voitures juste en cliquant l’icône ci-dessus en donnant les
informations nécessaires de la voiture (immatriculation, marque, prix et la photo).

Si toutes les informations sont correctement renseignées le message suivant s’affiche « insertion de
donnée validée » et le message suivant « échec d’insertion de donnée » dans le cas contraire.

Voici le code correspondant ainsi :


L’interface obtenu est la suivante :

3-2) Détails :

Ici, nous obtenons tous les détails sur les voitures (quantité, immatriculation, marque, prix, photo)
seulement en cliquant sur l’icône ci-dessus.

Voici le code correspondant :


3-3) Pied de page (footer) :

Cette partie contient le code qui permet de mettre en bas de la page les différents messages de
marketing de la société. Voici le ce code ci-dessous :
L’interface qu’on obtient à la suite de la combinaison de ces deux codes est la suivante :

3-3) Modifier :

Dans cette partie, on peut modifier cette caractéristique de la voiture tels que : la marque, le prix ainsi
que la photo mais on ne peut pas modifier l’immatriculation, car l’immatriculation est définie comme
notre clé primaire.

Si les différents champs sont remplis, on obtient le message suivant « Mis à jour des données
validés » et le message suivant dans le cas contraire « Echec de modification de donnée ».

Voici le code correspondant :


Voici l’interface correspondant :

3-4) Supprimer :

Cette partie permet supprimer immédiatement la voiture concernée dans la base de données des en
cliquant sur l’icône ci-dessus. Si la suppression se fait correctement, le message suivant s’affiche
« Suppression a été correctement effectuée » et le message suivant « la suppression a échoué »
dans le cas contraire.

Voici le code correspondant :


III. CONCLUSION :

En guise de conclusion, on peut dire que ce mini-projet que nous venons de réaliser nous a permis
d’apprendre de nombreuses connaissances sur le développement web.

Ça nous a permis aussi de savoir comment combiner PHP, HTML et CSS afin de donner un produit
final (site) et de connaître leurs rôles spécifiques pour la réalisation d’un tel projet.

Common questions

Alimenté par l’IA

The login functionality enhances security by implementing a credential verification process where users must enter a correct username and password to access the dashboard. This ensures only authorized users can modify, add, or delete car records. Incorrect login attempts are met with a message indicating invalid credentials, preventing unauthorized access .

The car management web application includes several key functionalities: a connection page for database access, a search bar with video presentation on the index page, a login feature that verifies user credentials, and a dashboard for managing cars. The dashboard allows users to add new cars with necessary details, view all car details, modify existing information excluding the registration number, and delete cars, all while showing marketing messages in the footer .

Marketing messages in the footer augment the design by utilizing otherwise unused space to engage with users. They serve a dual purpose of reinforcing brand messaging while providing continuous, passive exposure to promotional content throughout the user experience, which can enhance business objectives by subtly influencing user perception and actions .

To add a new car, the user navigates to the dashboard and selects the 'add car' feature. Information such as registration, brand, price, and a photo must be provided. Data integrity is ensured by validating the input fields before insertion, with successful data entry acknowledged by a 'data insertion validated' message, or an error message if the process fails .

The inclusion of a video presentation provides an engaging visual context that can help users make informed decisions by offering a dynamic preview of available cars. It enhances the attractiveness of the application interface, potentially increasing user satisfaction and time on site by delivering rich multimedia content during the search process .

The logout feature allows users to securely end their session, preventing unauthorized access to sensitive operations such as modifying or deleting car records. It also assists in managing session data, ensuring that user-specific information is cleared upon exit, thereby maintaining the security and privacy expected in a user-centric application .

The limitation enforced is that the registration (immatriculation) of a car cannot be modified because it serves as the primary key in the database schema. This constraint is typically in place to maintain data integrity and uniquely identify each record in the application, hence ensuring accurate data management .

PHP is used for scripting server-side logic and database interactions, such as connecting to the database and processing form submissions with user data. HTML structures the web content, providing the layout and organization of the pages. CSS styles the application, giving the user interface its aesthetic appeal. Together, these technologies create an interactive, functional, and visually appealing web application .

Developers gained significant insights into integrating PHP, HTML, and CSS for web development, learning how to coordinate these technologies to produce a functional product meeting specified requirements. They also deepened their understanding of the practical application of database management, user interaction with UI elements, and the nuances of creating a coherent user experience .

Using the registration number as a primary key ensures each car record is uniquely identifiable, preventing duplicates and facilitating accurate data retrieval and updates. It enforces data integrity by ensuring key attributes do not change, which is crucial for maintaining reliability and consistency in the database operations .

Vous aimerez peut-être aussi