REPUBLIQUE ALGERIENNE DEMOCRATIQUE ET POPULAIRE MINISTERE DE L’ENSEIGNEMENT SUPERIEUR ET DE LA RECHERCHE SCIENTIFIQUE N° d’ordre : …………… UNIVERSITE DE M’SILA FACULTE DES MATHEMATIQUES ET DE L’INFORMATIQUE Département d’Informatique MEMOIRE de fin d’étude Présenté pour l’obtention du diplôme de MASTER Domaine : Mathématiques et Informatique Filière : Informatique Spécialité : Systèmes d’Informations Avancés Par : SAOUDI Azzouz SUJET Un compilateur des pages HTML pour la Génération automatique des codes JavaScript basant sur ANTLR Soutenu publiquement le : 19 / 06 /2014 devant le jury composé de : Mr .BOUDIA Malika Université de M’sila Président Mr. MOKHTARI Rabah Université de M’sila Rapporteur Mr. BOUBAKIRE Mohamed Université de M’sila Examinateur Mr…………………………… Université de M’sila Examinateur Promotion : 2013 /2014 Remerciements : En tout premier lieu, je remercie Allah le tout puissant, et Je tiens à remercier très sincèrement Mr MOKHTARI Rabah pour le grand honneur qu’il m’a fait en me proposant le sujet, pour ses conseils et pour ses orientations J’ai eu l’honneur et le privilège de travailler sous son assistance et de profiter de ses qualités humaines m'ont été d'une grande utilité, Son professionnelles et de sa grande expérience. il m’a guidé tout au long de ce travail. Je remercie tous les enseignants de l’université de M’sila, et en particulier mes enseignants de nos départements informatique. Mes remerciements vont également aux membres de jury d’avoir accepté de juger mon travail. Je remercie vivement toute ma famille, en particulier mes parents, ma femme..., pour m’avoir toujours soutenu au cours de mes études. Qu’ils trouvent ici le fruit de leur patience et du soutien permanent qu’ils m’ont prodigué pour affronter tous les moments difficiles. Mes sincères remerciements s'adressent également à mes amis DJENIDI Salah Eddine, BOUKHALAT Youssef, GHADBAEN Mebarek, et tous mes collègues. Enfin, je remercie toutes les personnes qui de près ou de loin, ont contribue à sa réalisation de ce travail. Dédicaces : Ça serait indigne de ma part si j'oubliais de remercier les deux êtres qui ont fait que je sois ici aujourd’hui… eh oui, ma maman et mon père, vous qui m’avez conçu, élevé, éduqué…vous qui avez toujours été là pour moi et n’avez jamais cessé de croire en moi, aucun mot ni aucune langue ne pourrait exprimer ma profonde gratitude à votre égards. A mes chers parents Je vous dois ce que je suis aujourd’hui grâce à votre amour, à votre patience et vos innombrables sacrifices. Que ce modeste travail, soit pour vous une petite compensation et reconnaissance envers ce que vous avez fait d’incroyable pour moi. Que Dieu, le tout puissant, vous préserve et vous procure santé et longue vie afin que je puisse à mon tour vous combler. A mes très chers frères Aucune dédicace ne serait exprimer assez profondément ce que je ressens envers vous, je vous dirais tout simplement, un grand merci, je vous aime. A ma femme A toute la famille et surtout mes oncle Gagui Mohamad et sa femme benAzi turkia. A mes très chers amis En témoignage de l’amitié sincère qui nous a liées et des bons moments passés ensemble. Je vous dédie ce travail en vous souhaitant un avenir radieux et plein de bonnes promesses. saoudi azzouz Table des Matières Page i Table des Matières Introduction générale…………………………………………………………………………………………..…...….…1 Chapitre I: introduction à la compilation I.1 Introduction au compilateur………………………………………………….…………………………3 I.1.1 Définitions……..…………….…………….…………………………………….………….……3 I.2 Structure d’un compilateur………………………………………………..………………………….…4 I.2.1 Structure logique……………………………………….…………………..……………….…4 I.2.2 Structure physique.…………………………………………………………………….……..6 I.3 Analyse lexicale…………………………………………………………………….…………….……….…..6 I.3.1 Le rôle de l’analyse lexicale.……………………….…………………….…………….…6 I.3.2 Unités lexicales, modèle (motif) et lexèmes.…………………………………….7 I.3.3 Erreurs lexicale………………………………………………………………………………….8 I.4 Analyse syntaxique………………………………………………………………………………………….8 I.4.1 Rôle de l’analyseur syntaxique……………………………………………………….…8 I.4.2 Méthode d’analyses syntaxique…………………………………………………….….9 I.4.2.1 Analyse descendant…………………………………………………………..9 I.4.2.2 Analyse ascendant…………………………………………………………….10 I.5 Grammaires……………………………………………………………………………………………………..10 I.5.1 Forme d’une grammaire……………………………………………………………………10 I.5.2 Processus de dérivation……………………………………………………………………11 I.5.3 Formes étendues de grammaires……………………………………………………..12 I.5.4 Propriétés des grammaires……………………………………………………………….12 I.5.5 Définition d’une grammaire……………………………………………………………..13 I.6 Les Outils LEX, YACC et ANTLR…………………………………………………………………….15 I.6.1 Lex…………………………………………………………………………………………………….15 I.6.2 Yacc…………………………………………………………………………………………………..16 I.6.3 ANTLR……………………………………………………………………………………………..18 I.7 Conclusion………………………………………………………………………………………………………18 Chapitre II: Développement Web II.1 Introduction au langage HTML............................................................................19 II.1.1 Les formulaires HTML……………………………………………………………….….20 II.1.1.1 Définition d'un formulaire.……………………………………………...20 II.1.1.2 Les éléments d'un formulaire.………….…………………….…….…20 II.1.2 Saisie de données dans le formulaire.……………………….…………………….23 II.1.2.1 Zones de saisie monolignes.………………………………………………23 II.1.2.2 Zones de saisie multilignes.……………………………………………….23 II.1.2.3 Liste d’options…………………………………………………………………..24 II.1.2.4 Boutons.………………..………………………………………………….…….25 Table des Matières Page ii II.2 Introduction aux JavaScript …………………………….………………….…………………....27 II.2.1 Définition …………………………………………………………………..………………...27 II.2.2 Vérification et Validation de formulaire ..……………………………………..27 II.3 Conclusion …………………………………………………….…………………………………………..31 Chapitre III. Génération des codes JS à partir d’un code HTML II.1 Introduction……………………………………………………………………………………………….32 III.2 ANTLR (ANother Tool for Language Recognition)…………………………………..32 III.2.1 Les fichiers générés………………………………………………………………………..34 III.2.2 Les avantage d’Antlr…………………………..………………………………………….34 III.3 Ecriture de la grammaire.…………………………………………………………………………..34 III.3.1 Structure d’un fichier grammaire ANTLR………………………………………34 III.3.2 Les multiplicités.……………………………….……………………………………………36 III.3.3 Les alternatives.……………………………………………………………………………..36 III.3.4 Les options……….…………………………………………………………………………….37 III.4 Grammaire pour les formulaires HTML………………………………………………….…38 III.5 L'outil ANTLR, exécution, et code généré ………………………………………………..39 III.5.1 Description de code généré.…………………………………………………………..40 III.6 Les règle de translation……………………………………………………………………………..41 III.7 Présentation du logiciel……………………………………………………………………….......45 III.8 Conclusion.………………………………………………………………………………………………..49 Conclusion Générale…………………………………………………………………….50 Référence ………………………………………………………..……………………………51 Liste des Figures Page iii Liste des figures Figure I.1 : schéma d’un compilateur…..............................................................................3 Figure I.2 : les différentes phases d’un compilateur……………………………………………………...4 Figure I.3 : Interactions entre analyseur lexical et analyseur syntaxique………………………7 Figure I.4 : place de l’analyseur syntaxique dans le modèle de compilateur…………………9 Figure I.5 : Dérivation gauche de la chaine id *id +id………………………………………………….11 Figure I.6 : Deux arbres de dérivation pour id +id * id……………………………………………….13 Figure I.7 : principe d’utilisation des utiles Lex & yacc…………………………………………….….15 Figure II.1 : Vérification de formulaire avec JavaScript………………………………………………..28 Figure II.2 :Vérification si l’utilisateur n’est remplier pas un champ d’un formulaire….29 Figure II.3 : Vérification si l’utilisateur remplier tout les champs d’un formulaire…..….30 Figure III.S1 : Le cadre global d’ANTLR……………………………………………………………………….33 Figure III.2 : les classes générées par ANTLR à partir de la grammaire HTML……………40 Figure III.3 : Déférant méthode pour parcoure l’arbre syntaxique……………………………….41 Figure III.4 : l’interface générale du logiciel…………………………………………………………………45 Figure III.5 : interface pour ouvrir un ficher html à généré.……………………………….………..46 Figure III.6 : Message de dialogue concernant le type de fichier ouvert……………….……..46 Figure III.7 : Une page HTML à compiler……………………………………………………………….…….47 Figure III.8 : interface affiche le code JavaScript généré………………………………………….…..48 Figure III.9 : Message de dialogue concernant les erreurs de la page HTML à compiler....48 Figure III.10: interface affiche les erreurs de la page HTML détaillé……………………………..49 Liste des tableaux Page iv Liste des tableaux Tableau II.1: Les éléments d'un formulaire « input »…………………………………………………….…21 Tableau II.2: Les éléments d'un formulaire «select »…………………………………………………….…22 Tableau II3 : Les éléments d'un formulaire « textarea»……………………………………………………22 Tableau III.4 : description déférant code généré par ANTLR…………………………………………..40 Introduction générale Introduction Générale Page 1 Introduction : L’informatique a occupé, ces dernières années un rôle prépondérant dans les différentes branches de l'activité humaine L’apparition des langages évolues (fortran, pascal, HTML, XML, PHP, C...ete.) et systèmes spécialisés (recherche documentaire, ...ete.) a ouvert le monde de l'informatique a différentes classes d'utilisateurs, et a facilité la communication : homme- machine et machine- homme Les formulaires dans une page HTML peuvent n'accepter pas que certains types d'entrées. L’envoi de formulaires peut n'être possible que lorsque certaines exigences sont respectées. Pour résoudre la relation étroite entre les formulaires dans la page HTML et code javascript pour valider les données entrés par un utilisateur. Nous voyons que l’ensemble de codes utilisés, dans le monde de développement web, très semblable et peut être ré exploité, pour cela il est fortement utile d’adopter un mécanisme permettant de faciliter la réutilisation de codes dans le développement web et en fournissant d’outil facilitant sa génération automatique afin de profiter des espaces de point de vue du temps et d’efforts. Le but majeur de ce travail est faciliter le travail l’utilisateur pour générer le code javascript à partir des pages uniquement HTML. La réalisation de notre travail nous a amené à diviser l'étude en deux phases:  La phase théorique: qui est consacré a la conception d'un compilateur pour générer le code JavaScript.  La phase pratique: l'implémentation du logiciel. Notre mémoire est organisé autour des chapitres suivants : Il commence par une introduction générale introduisant le domaine de développent web en général. Chapitre I : Dans ce chapitre, nous esquissons la structure typique d’un compilateur, et Les principes de base inhérents à la réalisation de compilateurs : analyse lexicale, analyse syntaxique,…, et les outils fondamentaux utilisés pour effectuer ces analyses. Introduction Générale Page 2 Chapitre II : Connaitre et utiliser langages du Web (e.g HTML, JavaScript, PHP...) Chapitre III : Dans ce chapitre on procède au compilateur des pages html pour générer le code JavaScript basé sur ANTLR qu'on a baptisé HTML2js Enfin une conclusion générale. Chapitre 01 : Chapitre I : introduction à la compilation Page 3 I. 1. Introduction: Tout langage informatique structuré est en fait une notation permettant de décrire des expressions et des textes à l’intention des humains et des ordinateurs. Le monde que nous connaissons s’appuie sur des langages de différents types (Java, XML, HTML, UML…) pour différents objectifs. Souvent, on aura besoin d'aller d'un langage à un autre pour transformer, translater, ou traduire un texte d'une structure à une autre. La réalisation automatique d'une telle translation est appelé une compilation. Ainsi, l'outil logiciel qui exécute cette action est le compilateur. Dans ce chapitre, nous esquissons la structure typique d’un compilateur et Les principes de base inhérents à la réalisation de compilateurs : analyse lexicale, analyse syntaxique,…, et les outils fondamentaux utilisés pour effectuer ces analyses. I. 1.1 Définition : Un compilateur est un programme qui traduit un programme écrit dans un langage source vers un langage cible en indiquant les erreurs éventuelles que pourrait contenir le programme source [3]. Figure I.1 : schéma d’un compilateur [1]. Les rôles essentiels de ce processus de compilation sont :  signale au programmeur la présence d’erreurs dans le programme source.  Rendre compréhensible par la machine un langage de haut niveau. CompilateurProgramme Source Programme cible Messages D’erreur Chapitre I : introduction à la compilation Page 4 I. 2 Structure d’un compilateur : I. 2.1 Structure logique: Les phases de compilation : un compilateur est théoriquement constitué de six phases, formant un ensemble cohérent. Une décomposition typique d’un compilateur est présentée dans la figure I.2 ainsi que l’intersection entre ses phases.  Les phases d'un compilateur : Figure I.2 : les différentes phases d’un compilateur [1]. Chapitre I : introduction à la compilation Page 5 a. analyse lexicale : C’est phase de lecture et conversion du flot d’entrée le rôle de l’analyse lexicale :  lire les caractères d’entrée  réaliser un prétraitement du programme source.  transmettre à l’analyseur syntaxique des unités lexicales.  Initialiser la table des symboles.  Garder un lien entre compilateur et utilisateur. L’intérêt de l’analyse lexicale :  Conception modulaire plus simple du compilateur.  Simplification de l’écriture de l’analyseur syntaxique.  Techniques spécifiques d’entrée du texte.  Existence de techniques générales d’analyse lexicale. Dans cette phase, les erreurs détectables sont par exemple une suite de caractères inconnue, constante grande, etc…. b. Analyse syntaxique (analyse grammaticale) : Phase de vérification de la syntaxe du flot d’entrée. Le rôle de l’analyse syntaxique :  Vérifie la conformité syntaxique.  Construit l’arbre d’analyse.  Gère les erreurs communes de syntaxe. Dans cette phase, les erreurs détectables sont par exemple Une expression arithmétique mal parenthèse. c. Analyse sémantique : C’est la phase de vérification du sens des instructions, cette phase permet de préparer la phase ultime du compilateur qui est la génération du code. d. génération du code intermédiaire : Il utilise la structure produite par l’analyse syntaxique pour générer un ensemble d’instructions simples écrit dans un langage proche du langage objet. Chapitre I : introduction à la compilation Page 6 e. Optimisation du code : Cette phase est optionnelle, elle tente d’améliorer le code intermédiaire de façon que le code machine résultant s’exécute plus rapidement. f. Génération du code objet : Phase de transformation de chaque instruction du programme source en son équivalant en langage objet, celui-ci dépend de l’architecture de la machine sur laquelle le programme est appelé à être exécuté. I. 2.2 Structure physique d’un compilateur : Dans l’implémentation d’un compilateur, il arrive souvent que l’on regroupe les activités de plusieurs phases logiques en un modèle appelé passe et ce, dans le but d’accélérer le processus de compilation.  L'analyse du programme source Découpage en trois phases : i) Analyse lexicale : flot de caractères regroupés en unités lexicales ii) Analyse syntaxique : regroupement des unités lexicales en unités grammaticales iii) Analyse sémantique : contrôle ou établissement de la cohérence sémantique I. 3 Analyse lexicale (lexer): I. 3.1 Le rôle de l’analyse lexicale : L’analyseur lexical constitue la première phase d’un compilateur.la tâche principale d’un analyseur lexical est : o Lire les caractères constituant le programme source. o Produire en sortie (comme résultat) une suite d’unités lexicales. o Le flot d’unités lexicales est envoyé à l’analyseur syntaxique. Chapitre I : introduction à la compilation Page 7 Ces interactions sont représentées à la figure I.3 [1]. Programme unités lexicales vers l’analyse Source recupUniLexSuiv sémantique Figure I.3: Interactions entre analyseur lexical et analyseur syntaxique [1]. L’analyseur lexical réalise certaines tâches secondaires comme l’élimination de caractères superflus et des blancs (commentaires, tabulations, fin de lignes…). Une autre de ces tâches est la corrélation des messages d’erreurs émis par le compilateur avec la source telles que :  Caractère inconnu.  Nombre très grand…. I. 3.2. Unités lexicales, modèle (motif) et lexèmes : Définition : a) Lexèmes : est une séquence de caractères dans le programme source qui concorde avec le modelé d’une unité lexicale [1]. Exemple : printf(X) ; Printf : est un lexème. ‘(‘ : est un lexème. ‘X’ : est un lexème. ‘)’ : est un lexème. b) Unités lexicales : est un couple constitué d’un nom d’unité lexicale et d’une valeur d’attribut optionnelle [1]. Analyse lexical Table des symboles Analyse syntaxique Chapitre I : introduction à la compilation Page 8 Exemple : Var : x,y,z ; X,y,z :sont des lexèmes de l’unité lexicale(identificateur).  Mots clés (if, elles, while…).  Identificateurs (var, ind, toto…).  Symboles des ponctuations.  Constantes numériques.  Constantes chaine. c) Modèle : est une règle associée à une unité lexicale [1]. I. 3.3. Erreurs lexicale : Il est difficile pour un analyseur lexical de dire, sans l’aide des autres composants, qu’il y a une erreur dans le code source. Par exemple, si la chaine fi est rencontrée pour la première fois dans un programme C Fi (a==f(x))… Un analyseur lexical ne peut pas dire si fi est une orthographe erronée du mot clé if ou un identificateur. Puisque fi est un lexème valide pour l’unité lexical id, l’analyseur lexical doit retourner L’unité lexicale id à l’analyseur syntaxique et laisser une autre phase du compilateur (probablement l’analyseur syntaxique, dans ce cas) gérer une erreur due à la permutation des deux lettres [1]. I. 4. Analyse syntaxique (Parser): Tout langage de programmation possède des règles qui indiquent la structure syntaxique d’un programme bien formé [1]. I. 4.1 Rôle de l’analyseur syntaxique : L’analyseur syntaxique reçoit une chaine d’unités lexicales, produites par l’analyseur lexical et vérifie que la chaine est conforme avec la syntaxe du langage à compiler et produit en sortie un arbre d'analyse. Chapitre I : introduction à la compilation Page 9 Cette vérification est faite en s’appuyant sur la grammaire qui génère le langage. Programme unités lexicales Arbre Source D’analyse Figure I.4: place de l’analyseur syntaxique dans le modèle de compilateur [1].  Arbre d’analyse (syntaxique) : C’est une représentation graphique d’une dérivation. Chaque niveau de l’arbre correspondant à une dérivation et les feuilles représentent les terminaux [1].  Propriétés d’un arbre d’analyse : A X Y Z 1-la racine est étiquetée par l’axiome. 2-chaque feuille est étiquetée par un terminal ou par ε. 3-chaque nœud interne est étiqueté par un non-terminal [1]. I. 4.2 Méthode d’analyses (syntaxique) : I. 4.2.1 Analyse descendant : Ces méthodes peuvent être vues comme une tentative pour construire un arbre d’analyse de la chaine d’entrée, en partant de la racine(l’axiome)et en allant vers les feuilles en opérant par les dérivation gauche. Les méthodes les plus efficaces connus à l’heure actuelle sont [1]:  La descente récursive.  Analyse prédictive. Analyse lexical Table des symboles Analyse Syntaxique Analyse Sémantique Chapitre I : introduction à la compilation Page 10 I. 4.2.2 Analyse ascendante: Cette méthode a pour but de construire un arbre d’analyse pour une chaine source en commençant par les ficelles (le bas) et en remontant vers la racine (le haut). Ce processus peut être considéré comme la réduction d’une chaine vers l’axiome de la grammaire. I. 5. Grammaires : Les grammaires, ou plus précisément les grammaires non contextuelles (on dit parfois grammaire BNF (pour Backus-Naur form)[7], ou grammaires algébriques, constituent le formalisme essentiel pour décrire la structure des programmes dans un langage de programmation. En principe, la grammaire d’un langage ne décrit que la structure syntaxique, mais étant donné que la sémantique d’un langage est décrite en termes de la syntaxe, la grammaire est également pour quelque chois dans la définition de la sémantique [2]. I. 5.1 Forme d’une grammaire : Une grammaire et formée d’un ensemble de règles de production et d’un symbole de départ. Chaque règle de production définit une construction syntaxique nommée. Une règle de production est formée de deux parties, la partie gauche et la partie droite, séparées par une flèche à droite [4]. a. Partie gauche : La partie gauche est le nom de la construction syntaxique. b. Partie droite : La partie droite donne une forme possible de la construction Syntaxique, Voici un exemple de production : Expression ’(’ expression opérateur expression ‘)’  Symbole terminal et non-terminal : La partie droite de la production contient des symboles de deux sortes, des symboles terminaux et des symboles non-terminaux [2].  Symbole terminal (lexèmes) : Est un point final d’un processus de génération et peut faire des chaines produites par la grammaire [2]. o La chaine vide et notée par ε. Chapitre I : introduction à la compilation Page 11  Symbole non-terminale : Doit apparaître comme la partie gauche (le nom) d’au moins une production, et ne peut pas faire parties des chaines produite par la grammaire [2].  Conventions de notation :  Les symboles suivent sont des terminaux [1]:  Les lettres minuscules du début de l’alphabet, telles que a, b et c.  Les symboles d’opérateurs tels que +,*,…, etc.  Les signes de ponctuation tels que les parenthèses, la virgule, etc.  Les chiffres 0,1, …,9.  Les symboles suivants sont des non-terminaux [1]:  Les lettres majuscules du début de l’alphabet, telles que A, B et C.  La lettre S, qui, quand elle est utilisée, est généralement le symbole de départ.  Les mots en minuscules et en italique tels qu’expr ou instr.  Pour parle de constructions de langages de programmation, on pourra utiliser des lettres majuscules pour représenter des non-terminaux dénotant ces constructions. Par exemple, les non-terminaux dénotant les expressions, les termes et les facteurs sont représentés par E, T et F. I. 5.2 Processus de dérivation : Soit la grammaire G donnée par : E → E * E /E+E /id On dit que e dérive la chaine « id+id*id » notons ceci par : E → E * E E→ E + E * E E→ id + E * E E → id + id * E E → id + id * id Figure I.5 : Dérivation gauche de la chaine id *id +id [4]. L’opération inverse de dérivation est appelée réduction, lors de la dérivation, on peut dériver gauche ou droite. Chapitre I : introduction à la compilation Page 12 I. 5.3 Formes étendues de grammaires : La notion simple pour les productions Non-terminalzéro, un ou plusieurs symboles grammaticaux Que nous avons utilisée précédemment permet en principe de spécifier n’importe quelle grammaire, mais en pratique, on utilise une notation plus riche. Tout d’abord, on à l’habitude de combiner toutes les productions qui ont la même partie gauche en une seule règle [2]. Par exemple, les productions Nα N β Nγ Sont combinées en une seule règle : Nα׀β׀γ I. 5.4 Propriétés des grammaires : Un non-terminal N est récursif à gauche si, à partir du syntagme N, nous pouvons produire un autre syntagme commençant par N. Exemple : E E ‘+’ facteur | facteur La récursivité à droite existe aussi, mais elle est moins importante. Un non-terminal N est « nullifiable » si, à partir de syntagme N, on peut dériver un syntagme vide. Exemple : E ε Un non-terminal N est inutile s’il ne permet pas de dériver une chaine de terminaux : Un exemple simple est E ‘+’ E | ‘-’ E Un logiciel de traitement de grammaire doit vérifier la présence de non-terminaux inutiles, et rejeter la grammaire s’il en trouve. Une grammaire est ambiguë si elle permet de produire deux arbres de dérivation différents, Avec les mêmes feuilles dans le même ordre [2]. Chapitre I : introduction à la compilation Page 13 Exemple : Soit la chaine suivent : id *id+ id peuvent correspondre plus d’un arbre [4]. Figure I.6 : Deux arbres de dérivation pour id +id * id [4]. I. 5.5 Définition d’une grammaire : L’unité de base des grammaires formelles est le symbole (identificateurs, lettres simples,…). La prochaine unité de construction des grammaires formelles est la production (règle). étant donné deux ensembles de symboles VN et VT, une production est le couple (N,α)tel que N ∈VN, α∈VT La production comme le couple (N,α) mais plutôt comme Nα. Chapitre I : introduction à la compilation Page 14 Une grammaire G est donnée par Un quadruplet G= (VN, VT, S, P), où:  VT est un ensemble des symboles terminaux, notés a, b, etc.  VN est un ensemble de symboles non-terminaux, notés A, B, etc.  S ∈ V est le symbole de départ(ou axiome).  P est un ensemble de productions (règle de langage) de la forme A → w, où w dénote un mot sur l’alphabet VN∪VT . [2] Exemple de grammaire algébrique:  VT= {int, (, ), +, -, *, /}.  VN = {E}.  S = E.  L’ensemble P des productions est : E → E + E E → E / E E → E – E E → (E) E → E * E E → int Chapitre I : introduction à la compilation Page 15 I. 6. LES OUTILS LEX & YACC : LEX (LEXical parser) &YACC (Yet Another Compiler-Compiler) sont des outils qui engendrent des programmes d’analyse de texte. Les programmes générés offrent des fonctionnalités de reconnaissance, de structuration, de traduction d’un texte écrit dans un langage donné [5]. Le schéma d’utilisation de ces outils est montré à la figure I.7. Figure I.7: principe d’utilisation des utiles Lex & yacc [5]. Les deux outils sont complémentaires I. 6.1 Lex, un générateur d'analyseurs lexicaux : Cet outil permet de définir un analyseur lexical en spécifiant des expirations régulières [1]. Exemple 1: L’entrée “1.2345E-10” est une constante réelle syntaxiquement conforme à l’Expression Régulière {+|-} ? {0..9} * . {0..9} * E {+|-} ? {0..9} * (Le ?signifie “0 ou 1 fois”, le*“0 ou n fois”).  La structure du fichier d’entrée pour Lex Le nom du fichier Lex est suffixé par .l : exemple.l. On trouve trois sections dans un fichier Lex : Section des définitions %% Section des règles %% Section définie par l’utilisateur Chapitre I : introduction à la compilation Page 16 Exemple: [a-z A-Z_]([a-z A-Z0-9_]) * {cout<< "C’est un identificateur\n";} [0-9]+ {cout << "C’est un entier\n";} ➢Dans la section des définitions peuvent apparaître des macro-définitions (on dit “macros”) qui servent à nommer des expressions pour simplifier les définitions des Expressions Régulières [5]. Exemple : les expressions ci-dessus peuvent être simplifiées en utilisant les macros suivantes: LETTRE [a-z A-Z_] CHIFFRE [0-9] %% {LETTRE}({LETTRE}|{CHIFFRE} )* { cout<< "Identificateur\n"; } {CHIFFRE}+ { cout<< "Entier\n"; } ➢Dans la section définie par l’utilisateur, on place des variables, fonctions ... nécessaires au fonctionnement du programme [5].  Lex fait l’analyse lexicale,  Yacc fait l’analyse syntaxique. Les applications principales de Lex sont :  Analyse statique: vérifications diverses.  Formateur: mise en page de texte.  Traducteur /compilateur.  Interprète. I. 6.2 Yacc, un générateur d'analyseurs syntaxiques : Le principe de Yacc est le même que celui de Lex, Mais l’outil est plus puissant que Lex dans la mesure où il permet de générer des analyseurs de langages descriptibles par des grammaires libres de contexte (contexte-free ou algébriques). Ces grammaires sont constituées de règles de la forme [5] A (non terminal) → w. Chapitre I : introduction à la compilation Page 17 Exemple 1 : l’entrée “((a+b)+c)” est un mot du langage : S → Expr Expr → (Expr) / Expr op Expr / Ident Op → + / - Ident → a / b / ... / z  La structure du fichier d’entrée pour yacc Le format d’un fichier Yacc exemple.y est le suivant : Section des définitions %% Section des règles %% Section définie par l’utilisateur ➢Dans La section des définitions permet de placer des déclarations utiles au programme ou à la grammaire [5]. ➢Dans La section des règles permet d’écrire les règles de production de la grammaire du langage à reconnaître [5]. La forme générale d’une règle est : Non-Terminal : Liste_de_Symboles (Terminaux ou non) ; Exemple : A : B C D ; ➢Dans la section définie par l’utilisateur, il faut fournir le programme principal qui appelle le parser c’est-à-dire l’analyseur engendré par Yacc; une procédure yyparse() sans argument est générée.  Pourquoi utiliser des générateurs ? Pour se concentrer sur la forme des expressions à analyser sans se soucier des détails d’implantation. Cela évite l’écriture manuelle d’un analyseur [5]: ➫ Avec les risques d’erreurs. ➫ Avec le risque d’écrire un analyseur difficile à maintenir, à faire évoluer. ➫ Avec les aspects pénibles propres aux entrées/sorties d’un langage particulier. Chapitre I : introduction à la compilation Page 18  Les avantages de ces outils automatiques sont : ➫ Simplicité d’utilisation: le style est déclaratif, c’est-à-dire basé uniquement sur la description formelle du langage à reconnaître. ➫ Facilité à maintenir: on peut à tout moment enrichir la description du langage. ➫ Facilité d’introduire des actions/traitements à effectuer pour engendrer un traducteur: On sépare facilement les règles d’une grammaire et les actions sémantiques éventuelles associées à chacune des règles. I. 6.3 ANTLR (ANother Tool for Language Recognition): ANTLR est un outil pour la reconnaissance de langage. C’est un compilateur de compilateur, c'est-à-dire un programme informatique capable de produire certaines parties du compilateur (analyse lexicale et analyse syntaxique). ANTLR accepte un langage source et crée un langage cible composé des parties d’analyse lexicale et syntaxique [7]. I.7 Conclusion : Un compilateur opère en une séquence de phases transformant chacune le programme source depuis une représentation intermédiaire vers une autre. L’analyse lexicale parcourt le programme source caractère par caractère et produit en sortie une séquence d’unités lexicales qui sont en principe transmises l’une après l’autre à l’analyse syntaxique. L’analyse syntaxique prend en entrée des unités lexicales issues d’une analyse lexicale et traite les noms de l’unité lexicale comme des symboles terminaux d’une grammaire. Une grammaire est définie par un ensemble de symboles terminaux et un autre de symboles non- terminaux. Chapitre 02 : Chapitre II : Développement web. Page 19 II 1. Introduction : HTML (HyperText Markup Langage) [8] : est un langage de balises (ou "tags") utilisés pour définir les différents composants d'un document, Chaque balise est encadrée par les symboles < et >. Chaque mise en forme est présentée par une balise de début et une balise de fin , suffixé par .html ou .htm. Les documents HTML ne servent en général qu’à présenter de l’information à l’utilisateur. Rien n’était a priori prévu au départ pour que ce dernier puisse transférer de l’information dans "l’autres sens" (des utilisateurs vers le serveur de documents). Il existe une technique permettant une communication du client (utilisateur) vers le serveur : le formulaire. Associé à des scripts CGI (Common Gateway Interface), scripts JavaScript ou PHP (Personale Home Page), le formulaire permet une certaine interaction entre l’utilisateur final et le Serveur de données grâce à des zones de saisie, boutons,…  La page HTML minimum : Une page HTML est un fichier texte commençant par la balise et finissant par la balise . Elle contient également un en-tête décrivant le titre de la page, puis un corps dans lequel se trouve le contenu de la page.  L'en-tête est délimité par les balises et .  Le corps est délimité par les balises et . Ainsi la page HTML peut être représentée comme suit [10]: Le titer < /HEAD> Contenu de la page < /BODY> Chapitre II : Développement web. Page 20 II 1.1 Les formulaires HTML II 1.1.1 Définition d'un formulaire : Avant de pouvoir utiliser les différentes sortes de formulaires (ligne de texte, liste déroulante, cases à cocher...), il faut déclarer au browser qu'il devra gérer des formulaires et ce qu'il devra en faire [9].
... les formulaires proprement dit ...
Un formulaire est défini par les balises
et
. Deux paramètres doivent en outre être définis à l’ouverture du formulaire  Action: adresse d’envoi du formulaire  Method: la méthode de transmission des données (get ou post). La méthode get s’est établie comme un standard mais ne convient pas au transfert de grandes quantités de données : il faut alors utiliser la méthode post [8]. II 1.1.2 Les éléments d'un formulaire : Trois catégories :  input : champs de saisie de texte et divers types de boutons : o type="text" : zone de texte o type="password" : zone de texte caché o type="checkbox" : cases à cocher o type="radio" : minimum 2, un seul sélectionnable o type="submit" : bouton de soumission du formulaire o type="reset" : bouton de remise à zéro des champs o type="hidden" : bouton caché  select : menus déroulant, listes à ascenseurs o size="1" : un seul élément sélectionnable o size="n", n > 1 : liste à choix multiples  textarea : zone de saisie d'un texte long. Chapitre II : Développement web. Page 21 1) L’élément INPUT :Type Code RésultatSans Submit Checkbox Linux
Dos
Windows
Radio CD-ROM
Disquette
Password Reset Tableau II.1: Les éléments d'un formulaire « input » Chapitre II : Développement web. Page 22 2) L'élément SELECT : Cet élément sert à définir des listes (menus déroulants ou ascenseurs). Il est utilisé avec l'élément [8].
Si vous cliquez sur la petite flèche vers le bas, vous obtiendrez la liste déroulante où on retrouve les éléments de la liste (