KEMBAR78
Rapport de mini projet de programation web | PDF
Réalisation d'un journal électronique de
Scientifique et de recherche
Réalisé par : Encadré par :
Soumia Thaiji Mr.BADI
Abder rahim Raji
Mohammed mouradi
Plan de rapport :
Le but de réalisation de journal.
Fonctionnalités.
Outils utilisés.
Définition HTML
Les versions de HTML
Définition css
Les versions de CSS
Javascript
PHP
mysql
La conception.
Identification des acteurs
La réalisation.
Le but de réalisation de journal
Ce travail consiste à réaliser un journal électronique de type
scientifique .Ce projet a pour objectif d'établir un site web
dynamique fournissant la possibilité de mettre en ligne et de de gérer
les articles des travaux de recherche.
Ce document consiste en une description des grandes lignes de
l'analyse, la conception et la réalisation de ce projet.
Fonctionnalités
Le site nous permet :
o L'inscription des visiteurs dans le site.
o Authentifier les visiteurs.
o Voire des vidéos.
o Permettre au visiteur de visualiser les articles de
différant spécialité.
o Modifier les informations personnelles.
o Permettre la suppression du compte.
o Gérer la sécurité des comptes.
o Permettre à l’administrateur de gérer les articles
(ajout/modification/suppression)
o Permet de faire une inscription sur le site pour
que par la suite on peut l’envoie les nouveautés
du site.
Outils utilisés
La réalisation de notre mini projet se base sur un
ensemble d'outils.
Ces outils seront détailles dans ce rubrique :
Notre projet est réalisé sur une machine qui tourne sous le système
d'exploitation GNU/linux avec la distribution Debian (Ubuntu). Le
système d'exploitation GNU/Linux comporte une gamme d'outils de
développement web libres, gratuits et puissants (XAMMP étant un
exemple), plusieurs interpréteurs, des éditeurs de texte performants
ainsi que des terminales de commandes très puissants.
Langages web utilisés :
HTML [1] : L'Hyper Text Markup Language C'est un langage à
balisage qui décrit la structure logique. Il a volontairement été conçu
pour être simple, il permet d'écrire de l'hypertexte.
La figure fait la synthèse des différents l'hypertexte possibles :
Il contient des commandes, implémentées par des balises pour
marquer les différents types de texte (titres, paragraphe, listes …),
son rôle est de gérer et organiser le contenu. Il permet d'inclure des
ressources multimédias dont les images, les formulaires de saisie, lu
son, la vidéo, etc.
(HTML) a fait son apparition en 1991.
HTML a évolué en passant par plusieurs améliorations depuis sa
première version en 1991 arrivant à la version HTLM5 actuellement.
Cette version apporte de nombreuses améliorations comme la
possibilité d'inclure facilement des vidéos … un meilleur agencement
du contenu, de nouvelles fonctionnalités pour les formulaires, etc.
Les versions de HTML
_ HTML 1 : c'est la toute première version créée par Tim Berners-Lee
en 1991.
_ HTML 2 : la deuxième version du HTML apparaît en 1994 et prend
fin en 1996 avec l'apparition du HTML 3.0. C'est cette version qui
posera en fait les bases des versions suivantes du HTML. Les règles et
le fonctionnement de cette version sont donnés par le W3C (tandis
que la première version a été créée par un seul homme).
_ HTML 3 : apparue en 1996, cette nouvelle version du HTML
rajoute de nombreuses possibilités au langage comme les tableaux,
les applets, les scripts, le positionnement du texte autour des images,
etc.
_ HTML 4 : il s'agit de la version la plus répandue du HTML (plus
précisément, il s'agit de HTML 4.01). Elle apparaît pour la première
fois en 1998 et propose l'utilisation de frames (qui découpent une
page web en plusieurs parties), des tableaux plus complexes, des
améliorations sur les formulaires, etc. Mais surtout, cette version
permet pour la première fois d'exploiter des feuilles de style, notre
fameux CSS !
_ HTML 5 : c'est LA dernière version. Encore assez peu répandue, elle
fait beaucoup parler d'elle car elle apporte de nombreuses
améliorations comme la possibilité d'inclure facilement des vidéos,
un meilleur agencement du contenu, de nouvelles fonctionnalités
pour les formulaires, etc. C'est cette version que nous allons
découvrir ensemble.
CSS [1] : Les feuilles de style (Cascading Style Sheets) Les feuilles de
style Permet Séparation du contenu et de la mise en forme, ont pour
rôle de gérer l'apparence de la page web, ce langage est venu
d’améliorer HTML en 1996. CSS Permet :
 la modification de l'aspect d'une page ou d'un site sans en
modifier le contenu.
 la modification facilement l'aspect d'une page.
 la modification de l’interface graphique a un aspect
compliqué à cause des répercutions.
 La décoration des différents éléments de la page en
définissant par exemple une couleur de fond pour un
bloc ou encore une taille de police pour un titre.
 dimensionner et positionner tous les éléments comme on
le souhaite sur la page.
Les versions de CSS :
- CSS 1 : dès 1996, on dispose de la première version du CSS. Elle
pose les bases de ce langage qui permet de présenter sa page web,
comme les couleurs, les marges, les polices de caractères, etc.
-CSS 2 : apparue en 1999 puis complétée par CSS 2.1, cette nouvelle
version de CSS rajoute de nombreuses options. On peut désormais
utiliser des techniques de positionnement très précises, qui nous
permettent d'afficher des éléments où on le souhaite sur la page.
-CSS 3 : c'est la dernière version, qui apporte des fonctionnalités
particulièrement attendues comme les bordures arrondies, les
dégradés, les ombres, etc.
JAVASCRIPT :
Javascript est un langage de programmation très récent, créé par les
sociétés Netscapeet Sun Micro systeme vers la fin de l'année 1995.
•Son objectif principal: introduire de l'interactivité avec les pages
HTML, et effectuer des traitements simples sur le poste de travail de
l'utilisateur il présente la coté client qui permet d'ajouter les
propriétés des langages de programmations (variables, fonctions, ...) à
HTML
•Le moyen: introduire le code JavaScript est inclut directement dans
la page web sous forme des petits programmes, appelés SCRIPTS,
dans les pages HTML, ou dans un fichier externe et permet aussi
d'ajouter des interactions avec l'utilisateur.
On y a ajouté des bibliothèques (comme JQuery) qui introduisent
plus de fonctionnalités, de rapidité et de fluidité.
PHP [2] :
PHP a été créé en 1994 par Rasmus Lerdorf pour les besoins des
pages web personnelles (livre d'or, compteurs, etc.). PHP signifiait à
l'époque Personnal Home Page.
Après son apparition, PHP devient un projet collectif et son
interpréteur est réécrit .PHP signifie désormais Hypertext
Preprocessor. PHP est un langage impératif disposant depuis la
version 5 de fonctionnalités de modèle objet complètes et sa syntaxe
est très proche du langage C. PHP permet de rendre le site web
dynamique en permettant la génération des pages HTML.
MySQL[6] :
La conception :
Visiteur : C'est une personne connectée au site web qui peut déjà être
inscrit ou c’est la première visite, les fonctionnalités offertes au
visiteur se limitent à chercher dans les articles proposer par
Administrateur et les visualiser, il a des droits de navigation limités.
Administrateur : Son rôle consiste à gérer les articles et les
participants il possède des droits absolus.
La réalisation.
Le présent de cette rubrique décrit les différentes sections de notre
site web :
1 .Page d'accueil.
2 .Page CONTACT.
3 .Formulaire d'inscription.
4 .Formulaire d'authentification.
5 .Page de confirmation de code d’administration.
6 .Page administrations.
7 .Page album.
8 .Page des articles mathématiques.
9 .Page des articles informatiques.
10 .Page des articles chimiques.
11 .Page des articles biologiques.
12 .Page des vidéos.
13 .Page des articles géologiques.
14 .Page des articles astronomiques.
1 .Page d'accueil
2 .Page CONTACT
3 .Formulaire d'inscription
4 .Formulaire d'authentification
5 .Page de confirmation de code d’administration
Notification : Le code est (ASM).
6 .Page administrations
7 .Page album
8 .Page des articles mathématiques
9 .Page des articles informatiques
10 .Page des articles chimiques
11 .Page des articles biologiques
12 .Page des vidéos
13 .Page des articles géologiques
14 .Page des articles astronomiques
Conclusion
La réalisation de notre site est un travail de longue durée
nécessitant un gros travail de recherche, d'analyse, de conception et
de réalisation. Il reste bien sûre besoin de plusieurs améliorations à
ajouter.

Rapport de mini projet de programation web

  • 1.
    Réalisation d'un journalélectronique de Scientifique et de recherche Réalisé par : Encadré par : Soumia Thaiji Mr.BADI Abder rahim Raji Mohammed mouradi
  • 2.
    Plan de rapport: Le but de réalisation de journal. Fonctionnalités. Outils utilisés. Définition HTML Les versions de HTML Définition css Les versions de CSS Javascript PHP mysql La conception. Identification des acteurs La réalisation.
  • 3.
    Le but deréalisation de journal Ce travail consiste à réaliser un journal électronique de type scientifique .Ce projet a pour objectif d'établir un site web dynamique fournissant la possibilité de mettre en ligne et de de gérer les articles des travaux de recherche. Ce document consiste en une description des grandes lignes de l'analyse, la conception et la réalisation de ce projet.
  • 4.
    Fonctionnalités Le site nouspermet : o L'inscription des visiteurs dans le site. o Authentifier les visiteurs. o Voire des vidéos. o Permettre au visiteur de visualiser les articles de différant spécialité. o Modifier les informations personnelles. o Permettre la suppression du compte. o Gérer la sécurité des comptes. o Permettre à l’administrateur de gérer les articles (ajout/modification/suppression) o Permet de faire une inscription sur le site pour que par la suite on peut l’envoie les nouveautés du site. Outils utilisés La réalisation de notre mini projet se base sur un ensemble d'outils. Ces outils seront détailles dans ce rubrique : Notre projet est réalisé sur une machine qui tourne sous le système d'exploitation GNU/linux avec la distribution Debian (Ubuntu). Le
  • 5.
    système d'exploitation GNU/Linuxcomporte une gamme d'outils de développement web libres, gratuits et puissants (XAMMP étant un exemple), plusieurs interpréteurs, des éditeurs de texte performants ainsi que des terminales de commandes très puissants. Langages web utilisés : HTML [1] : L'Hyper Text Markup Language C'est un langage à balisage qui décrit la structure logique. Il a volontairement été conçu pour être simple, il permet d'écrire de l'hypertexte. La figure fait la synthèse des différents l'hypertexte possibles :
  • 6.
    Il contient descommandes, implémentées par des balises pour marquer les différents types de texte (titres, paragraphe, listes …), son rôle est de gérer et organiser le contenu. Il permet d'inclure des ressources multimédias dont les images, les formulaires de saisie, lu son, la vidéo, etc. (HTML) a fait son apparition en 1991. HTML a évolué en passant par plusieurs améliorations depuis sa première version en 1991 arrivant à la version HTLM5 actuellement. Cette version apporte de nombreuses améliorations comme la possibilité d'inclure facilement des vidéos … un meilleur agencement du contenu, de nouvelles fonctionnalités pour les formulaires, etc. Les versions de HTML _ HTML 1 : c'est la toute première version créée par Tim Berners-Lee en 1991. _ HTML 2 : la deuxième version du HTML apparaît en 1994 et prend fin en 1996 avec l'apparition du HTML 3.0. C'est cette version qui posera en fait les bases des versions suivantes du HTML. Les règles et le fonctionnement de cette version sont donnés par le W3C (tandis que la première version a été créée par un seul homme). _ HTML 3 : apparue en 1996, cette nouvelle version du HTML rajoute de nombreuses possibilités au langage comme les tableaux, les applets, les scripts, le positionnement du texte autour des images, etc. _ HTML 4 : il s'agit de la version la plus répandue du HTML (plus précisément, il s'agit de HTML 4.01). Elle apparaît pour la première fois en 1998 et propose l'utilisation de frames (qui découpent une page web en plusieurs parties), des tableaux plus complexes, des améliorations sur les formulaires, etc. Mais surtout, cette version
  • 7.
    permet pour lapremière fois d'exploiter des feuilles de style, notre fameux CSS ! _ HTML 5 : c'est LA dernière version. Encore assez peu répandue, elle fait beaucoup parler d'elle car elle apporte de nombreuses améliorations comme la possibilité d'inclure facilement des vidéos, un meilleur agencement du contenu, de nouvelles fonctionnalités pour les formulaires, etc. C'est cette version que nous allons découvrir ensemble. CSS [1] : Les feuilles de style (Cascading Style Sheets) Les feuilles de style Permet Séparation du contenu et de la mise en forme, ont pour rôle de gérer l'apparence de la page web, ce langage est venu d’améliorer HTML en 1996. CSS Permet :  la modification de l'aspect d'une page ou d'un site sans en modifier le contenu.  la modification facilement l'aspect d'une page.  la modification de l’interface graphique a un aspect compliqué à cause des répercutions.  La décoration des différents éléments de la page en définissant par exemple une couleur de fond pour un bloc ou encore une taille de police pour un titre.  dimensionner et positionner tous les éléments comme on le souhaite sur la page. Les versions de CSS : - CSS 1 : dès 1996, on dispose de la première version du CSS. Elle pose les bases de ce langage qui permet de présenter sa page web, comme les couleurs, les marges, les polices de caractères, etc.
  • 8.
    -CSS 2 :apparue en 1999 puis complétée par CSS 2.1, cette nouvelle version de CSS rajoute de nombreuses options. On peut désormais utiliser des techniques de positionnement très précises, qui nous permettent d'afficher des éléments où on le souhaite sur la page. -CSS 3 : c'est la dernière version, qui apporte des fonctionnalités particulièrement attendues comme les bordures arrondies, les dégradés, les ombres, etc.
  • 9.
    JAVASCRIPT : Javascript estun langage de programmation très récent, créé par les sociétés Netscapeet Sun Micro systeme vers la fin de l'année 1995. •Son objectif principal: introduire de l'interactivité avec les pages HTML, et effectuer des traitements simples sur le poste de travail de l'utilisateur il présente la coté client qui permet d'ajouter les propriétés des langages de programmations (variables, fonctions, ...) à HTML •Le moyen: introduire le code JavaScript est inclut directement dans la page web sous forme des petits programmes, appelés SCRIPTS, dans les pages HTML, ou dans un fichier externe et permet aussi d'ajouter des interactions avec l'utilisateur. On y a ajouté des bibliothèques (comme JQuery) qui introduisent plus de fonctionnalités, de rapidité et de fluidité. PHP [2] : PHP a été créé en 1994 par Rasmus Lerdorf pour les besoins des pages web personnelles (livre d'or, compteurs, etc.). PHP signifiait à l'époque Personnal Home Page. Après son apparition, PHP devient un projet collectif et son interpréteur est réécrit .PHP signifie désormais Hypertext Preprocessor. PHP est un langage impératif disposant depuis la version 5 de fonctionnalités de modèle objet complètes et sa syntaxe est très proche du langage C. PHP permet de rendre le site web dynamique en permettant la génération des pages HTML.
  • 10.
    MySQL[6] : La conception: Visiteur : C'est une personne connectée au site web qui peut déjà être inscrit ou c’est la première visite, les fonctionnalités offertes au visiteur se limitent à chercher dans les articles proposer par Administrateur et les visualiser, il a des droits de navigation limités. Administrateur : Son rôle consiste à gérer les articles et les participants il possède des droits absolus.
  • 12.
    La réalisation. Le présentde cette rubrique décrit les différentes sections de notre site web : 1 .Page d'accueil. 2 .Page CONTACT. 3 .Formulaire d'inscription. 4 .Formulaire d'authentification. 5 .Page de confirmation de code d’administration. 6 .Page administrations. 7 .Page album. 8 .Page des articles mathématiques. 9 .Page des articles informatiques. 10 .Page des articles chimiques. 11 .Page des articles biologiques. 12 .Page des vidéos. 13 .Page des articles géologiques. 14 .Page des articles astronomiques.
  • 13.
  • 14.
    2 .Page CONTACT 3.Formulaire d'inscription
  • 15.
    4 .Formulaire d'authentification 5.Page de confirmation de code d’administration Notification : Le code est (ASM).
  • 16.
  • 17.
    8 .Page desarticles mathématiques 9 .Page des articles informatiques
  • 18.
    10 .Page desarticles chimiques 11 .Page des articles biologiques
  • 19.
    12 .Page desvidéos 13 .Page des articles géologiques
  • 20.
    14 .Page desarticles astronomiques Conclusion La réalisation de notre site est un travail de longue durée nécessitant un gros travail de recherche, d'analyse, de conception et de réalisation. Il reste bien sûre besoin de plusieurs améliorations à ajouter.