Table de matières
Table de matières
Dans ce présent chapitre nous allons présenter le développement de notre système informatisé déployé dans l’environnement web. Nous allons donner quelques notions sur les sites web, par la suite, nous parlerons de la création de notre base des données ainsi que ses tables réalisées à partir des scripts SQL exécutés en PHP.
Système d’information multimédia utilisé sur l’Internet et basé sur la technologie de l’hypertexte. Il permet de relier les serveurs et d’accéder aux bases de données. [4]
Un site web est un ensemble de pages reliées par des liens hypertextes, auquel on accède sur le web par une ou plusieurs adresses qui lui sont propres [5].
Les pages web sont des documents informatiques qui peuvent contenir du texte, des images, des tableaux, des formulaires et bien d’autres éléments multimédias.
Lorsque vous voulez visiter un site web, vous tapez son adresse dans votre navigateur web, l’Internet est un réseau composé d'ordinateurs. Ceux-ci peuvent être classés en deux catégories.
Les clients : ce sont les ordinateurs des internautes. L’ordinateur utilisé fait partie de la catégorie des clients. Chaque client représente un visiteur d'un site web.
Les serveurs : ce sont des ordinateurs puissants qui stockent et délivrent des sites web aux internautes, c'est-à-dire aux clients.
Définissons quelques vocables que nous aurons à utiliser dans la création et le déploiement de notre site web :
Le CSS permet de modifier l’aspect de tout un site à partir d’un seul fichier (la feuille de style) ; le CSS allège la gestion d’un site.
C’est un langage de script orienté objet permettant de gérer intégralement un site web, en partant de la simple génération de documents HTML à la production des requêtes SQL.
MySQL dérive directement de SQL (Structured Query Language) qui est un langage de requête vers les bases de données exploitant le modèle relationnel. Il en reprend la syntaxe mais n’en conserve pas toute la puissance puisque de nombreuses fonctionnalités de SQL n’apparaissent pas dans MySQL comme les sélections imbriquées, les clés étrangères, etc.
Le serveur de base de données MySQL est très souvent utilisé avec le langage PHP [10].
Le SQL est un langage d’interrogation de bases de données ; très répandu, permettant de manipuler assez facilement les bases de données relationnelles.
Il existe deux types de sites web : le site statique et le site dynamique
Ce sont des sites réalisés uniquement à l'aide des langages HTML et CSS. Ils fonctionnent très bien mais leur contenu ne peut pas être mis à jour automatiquement : il faut que le propriétaire du site (le webmaster) modifie le code source pour y ajouter des nouveautés. Ce n'est pas très pratique quand on doit mettre à jour son site plusieurs fois dans la même journée ! Les sites statiques sont donc bien adaptés pour réaliser des sites « vitrine », pour présenter par exemple son entreprise, mais sans aller plus loin. Ce type de site se fait de plus en plus rare aujourd'hui, car dès que l'on rajoute un élément d'interaction (comme un formulaire de contact), on ne parle plus de site statique mais de site dynamique [11].
Apparus vers le début des années 1990 avec l’avènement du langage HTML, les sites statiques sont conçus sous l’architecture client-serveur ; c’est-à-dire que ces sites s’inscrivent dans la logique « je demande, on me sert ». Le client est le navigateur Internet et le serveur est le serveur web sur lequel sont stockées les informations du site Internet. [12]
Lorsque le site est statique, le schéma est très simple. Cela se passe en deux temps, comme sur la figure Suivante :
Figure 4 Représentation d’un site statique
Ils utilisent d'autres langages en plus de HTML et CSS, tels que PHP et MySQL. Le contenu de ces sites web est dit « dynamique » parce qu'il peut changer sans l'intervention du webmaster.
En effet, PHP permet de créer des pages web dynamiques et interactives. Une page web dynamique est celle à partir de laquelle le visiteur ou client peut faire la manipulation des données. Une page interactive quant à elle permet à un visiteur de saisir des données personnelles. Ces dernières sont ensuite transmises au serveur, où elles peuvent rester stockées dans une base de données pour être diffusées vers d’autres acteurs [13]
Illustrons par la figure suivante :
Figure 5 Représentation d’un site dynamique source (11)
Pour contenir la masse d’informations collectées, PHP s’appuie généralement sur une base de données, en l’occurrence MySQL et s’appuie encore sur des serveurs Apache. C’est ainsi que PHP, MySQL et Apache forment le trio ultra-dominant sur les serveurs Internet. Quand ce trio est associé à Windows, l’on parle de système WAMP.
Une base de données permet d'enregistrer des données de façon organisée et hiérarchisée.
C’est un ensemble structuré d’informations, elle est conçue pour permettre une consultation et une modification aisée de son contenu.
Après installation du logiciel WampServer sur notre ordinateur, nous avons procédé comme-suit afin de pouvoir créer notre base de données :
1° Lancement de WampServer
Le lancement de ce logiciel se fait en cliquant sur l’icône symbolisant WampServer, avec le bouton gauche de la souris, dans la barre des tâches située à droite de l’écran. Ce qui affiche l’image suivante :
Figure 6 lancement du wampserver
Une fois WampServer lancé, nous avons choisi « phpMyAdmin » pour accéder à l’environnement de la base des données à partir du serveur local.
Voici sa page d’accueil à la figure suivante :
Figure 7 : la page d’accueil de wampsrver
2° Présentation de notre base de données et ses différentes tables
Figure 8 : les différentes tables de notre base de données
Notre logiciel est une plateforme de communication à l’Université Catholique de Bukavu, tous les acteurs connectés peuvent échangés des informations selon leurs besoins.
Pour y arriver nous avons utilisé les langages suivants : CSS, HTML, PHP, SQL, Javascript, Bootsrap.
Certains logiciels nous ont aidés pour la réalisation de ce présent travail : Wampserver, Mozila, word, paint, outil capture d’écran.
Pour utiliser le présent logiciel, il faut avoir un navigateur installé sur la machine comme : Mozilla Fire Fox, Safari, Internet explorer, Microsoft Edge, Google Chrome…
Notre logiciel nommé « UCB+ » possède une interface conviviale, voici les captures d’écran qui explicite son utilisation.
Page d’accueil de notre plateforme de communication
Figure 9 : Page d'accueil de notre système
Une fois que l’utilisateur tapera l’url de notre système, il sera dirigé sur notre page d’accueil, nous voyons une image de l’Université Catholique de Bukavu, toutes les facultés qu’elle organise ; dans la barre de navigation nous voyons les liens qui nous permettrons de naviguer dans notre plateforme ; ces liens sont : Accueil, A propos, publicités, valves, se connecter et s’identifier. Nous expliciterons l’utilisation de notre logiciel point par point ; commençons par le premier lien.
Figure 10 : Le lien Accueil
Figure 11 : le lien A propos
Figure 12 : La page A propos
Le lien A propos nous renseigne sur l’auteur de notre logiciel, nous avons un bouton, lisez moi sur cette page qui renseigne encore plus sur le logiciel.
Figure 13 : Le message de l'auteur
|
Après le lien A propos nous avons le lien publicité, ici l’utilisateur sera conduit à une page ou seront présenté les publicités selon les facultés.
L’utilisateur est directement redirigé sur la page des publicités suivante :
Figure 15 : La page des publicités
Nous voyons que l’utilisateur est à la page des publicités, ces dernières sont classées selon les différentes facultés. Si l’utilisateur veut voir seulement les photos publicitaires d’une faculté donnée, il n’aura qu’à cliquer sur la faculté correspondante ; signalons aussi que l’utilisateur a la possibilité d’agrandir la photo, ou de voir un texte qui peut commenter la photo publier illustrons par l’image suivante :
|
Voici le commentaire sur l’image :
Figure 17 : Image commentée
|
Après la page publicitaire, nous avons le lien valve, une fois cliqué, l’utilisateur a une vision sur toutes les valves de l’Université. Illustrons par une image.
L’utilisateur peut parcourir toutes les valves, selon les facultés, chaque titre publier est un lien qui conduit à une page où les informations sur les valves sont bien détaillées ; cliquons sur le lien où notre curseur pointe à l’image présentée ci-haut ;
|
L’utilisateur peut voir en détail toutes les informations sur les valves, s’il clique sur le petit bouton en bas de la publication, 3 actions lui sont proposées
|
L’utilisateur choisie alors une action selon ses besoins. Sur cette page, il a la possibilité de rentrer sur la page où sont présentés les titres des informations affichées sur les valves.
|
Les informations ne sont affichées sur les valves que par les secrétaires facultaires, une fois l’utilisateur clique sur le bouton « afficher un nouveau article »
|
Le clique sur ce bouton « Afficher un nouveau article », donne une interface de connexion au secrétaire facultaire, illustrons par une image :
|
Le secrétaire de la faculté des sciences présentement se nomme JEAN DE DIEU, c’est pourquoi son interface présente ce nom.
Le secrétaire doit mettre ses identifiants de connexion pour pouvoir afficher des nouveaux articles sur la valve de sa faculté. Nous prenons un exemple d’une adresse et d’un mot de passe ; l’utilisateur devra cliquer sur le bouton Se Connecter, une fois qu’il a fait et que ses identifiants sont corrects, il est directement redirigé dans sa session de travail, là où il peut publier ; illustrons par une image :
|
Le secrétaire de la faculté, saisie le titre de l’information à publier, puis le corps de ce qu’il va publier, le bouton afficher sera à afficher directement l’information soumise par le secrétaire sur toute la valve de la faculté correspondante. Sur la partie droite, le secretaire a une image de la valve sur laquelle il doit afficher ; il peut aussi voir en détails toute les publications déjà affichées sur la valve.
Pour quitter son compte il doit cliquer sur le bouton de Logout
|
Une fois déconnecté, il est redirigé sur la page d’accueil.
Après le lien valve, nous avons le lien Se Connecter.
Les utilisateurs : Enseignant, Etudiant, ses connecteront dans notre système par leurs identifiants qu’ils auront déjà fourni lors de l’inscription.
|
Si les identifiants qu’il a fournis sont corrects il sera directement redirigé dans son compte respectif.
|
|
Notre requête lit dans notre table message et affiche le nom de celui qui envoi le message, la date, et le message.
Figure 29 : Bouton de déconnexion de l'étudiant
|
|
L’utilisateur a donc la possibilité de voir tous les étudiants de l’UCB, s’il clique sur le lien voir en détails il est redirigé à la page suivante :
L’utilisateur peut cliquer sur le 3 boutons à l’extrême droit, selon ses besoins, il peut soit, voir le profil d’un étudiant, chater avec l’étudiant, ou soit envoyé un message.
|
|
|
|
|
Par ce bouton publier, l’utilisateur peut afficher sur la liste d’actualité, un message, une information, qu’il veut mettre à la portée de plusieurs autres étudiants.
Il peut aussi lire les publications des autres acteurs, illustrons par l’image suivante :
|
Nous voyons les actualités affichées selon l’ordre décroissant, c’est-à-dire de la dernière publication à la première ;
L’utilisateur peut effectuer différentes actions sur l’actualité affichée ; il peut soit l’imprimer, soit l’enregistrer ou soit la commenter.
Concernant l’utilisateur enseignant, avant de publier un message il choisira la promotion dans laquelle il veut rendre visible le message.
Si l’utilisateur clique sur le bouton publier il a une interface qui lui permet de publier et de choisir le cours.
|
L’image ci-haut montre comment l’utilisateur peut sélection un cours et publier ; tous ses camarades verrons le message et pourront intervenir.
Toutes les publications sont affichées dans le compte de l’utilisateur, portant le nom de celui qui a publié, la date de la publication, illustrons par l’image suivante :
|
Pour un bon renseignement, le cours sur lequel l’utilisateur publie sont repris sur l’image suivante et le nombre de fois qu’une publication porte sur un cours donné.
|
Pour bien utiliser notre logiciel, il est recommandé de disposer au minimum :
d’un navigateur : Mozilla Firefox, Google Chrome, Internet Explorer, Safari, etc. ;
Afric mémoire est une plateforme web pour le partage des mémoires et TFC entre étudiants du monde entier.
Enregistrer en PDF
Imprimer cette page
