UMR 1095 Unité Amélioration et Santé des Plantes (ASP) Equipe Structure, Fonction et Evolution des Génomes de Blé Aurélien BERNARD IUT Génie Biologique Licence Pro Bioinformatique Systèmes d'informations et de modélisations appliqués à la Bioinformatique Antenne Universitaire d Aurillac Année Universitaire 2005-2006 Stage effectué du 13 février au 09 juin 2006 et encadré par Mr Philippe Leroy (IR1)
REMERCIEMENTS J aimerai remercier un certain nombre de personnes que j ai pu rencontrer ou avec qui j ai pu collaborer au cours des quatre mois de stage : - Madame Catherine Feuillet et Monsieur Philippe Leroy qui m ont donné l opportunité d effectuer mon stage au sein de l INRA. - Madame Claude Barreyre (Ingénieur Système) pour son aide lors des tests de mon interface sur le serveur Web de l INRA de Theix. - Monsieur Christophe Caron (Ingénieur Système) pour la rapidité avec laquelle il m a aidé à mettre en place TACT sur le serveur de l INRA de Jouy-en-josas dont il est l administrateur. - Monsieur Cédric Muller (CDD Génoplante dans l équipe Génome) pour la collaboration fructueuse que nous avons mis en place entre nous. - L ensemble du personnel travaillant dans le bureau bioinformatique pour leur accueil et leur bonne humeur quotidienne. Sans oublier les bénévoles et membres du forum PHP France qui ont partagé leurs connaissances avec moi.
Résumé L UMR Amélioration et Santé des Plantes est actuellement impliquée dans un projet pilote consistant à étudier l énorme génome du blé chromosome par chromosome en commençant par une analyse structurale, fonctionnelle et évolutive du chromosome 3B à partir d une banque de BAC spécifiques. Cette étude menée dans le cadre d un projet international va générer une masse de données très importante et composée de séquences de clones BAC analysés et compilés dans TriAnnot GBrowse et de gènes expertisés et compilés dans la base de données GeneFarm. Si l on rajoute à cette constatation la quantité impressionnante de données disponibles dans les grandes banques de données internationales, la nécessité de développer un outil bioinformatique permettant d accéder à l ensemble de ces informations en quelques clics devient évidente. TriAnnot Consultation Tool (TACT), troisième étape du développement du Projet TriAnnot est né pour répondre à ce besoin. TACT est une interface Web simple, conviviale et capable de s adapter à l évolution constante des langages de programmation Web et des besoins sans cesse croissants de la communauté scientifique. Elle offre aux scientifiques deux moteurs de recherches performants s appuyant sur une base de donnée optimisée et permettant un accès facilité à un nombre toujours plus important de données disponibles sur Internet.
Abstract The research team Amélioration et Santé des Plantes is currently implied in a pilot project consisting in studying the enormous genome of wheat chromosome by chromosome by starting with a structural, functional and evolutionary analysis of the chromosome 3B from a bank of specific BAC. This study, carried out within the framework of an international project, will generate a very important mass of data mainly composed of BAC clones sequences analyzed and compiled in TriAnnot GBrowse and of genes appraised and compiled in the GeneFarm database. If we add the impressive quantity of data available in the international databanks to this obervation the need for developing a bioinformatic tool giving access to all these information in a few clicks clicks becomes obvious. TriAnnot Consultation Tool (TACT), third stage of the development of the TriAnnot Project was born to fill this need. TACT is a simple and convivial Web interface able to adapt to the constant evolution of the Web programming languages and able to follow the increasing needs for new fonctionnality of the research community. It offers scientists two powerful search engines based on an optimized database allowing an easier access to an increasingly growing amount of data available on Internet.
Sommaire Introduction...p. 1 I Le stage : Contexte et Cahier des Charges...p. 2 A) L INRA...p. 2 1 ) Présentation générale...p. 2 2 ) Quelques dates et chiffres clés...p. 2 3 ) Champs de recherche...p. 3 B) L équipe Structure, Fonction et Evolution des Génomes de Blé (Génome)...p. 3 1 ) Site de Crouël UMR 1095 INRA/UBP ASP...p. 3 2 ) L équipe : Objectifs et axes de recherche...p. 4 3 ) La Bioinformatique au sein de l Equipe Génome...p. 4 C) Projet Cahier des Charges...p. 5 1 ) Le projet TriAnnot...p. 5 2 ) Cahier des Charges du stage...p. 6 II Outils et langages...p. 8 A) Quelques rappels sur le Web et sa programmation...p. 8 1 ) Le Web...p. 8 2 ) La programmation Web...p. 8 B) Outils et langages...p. 9 1 ) Outils de développement...p. 9 2 ) Langages utilisés...p. 11 3 ) Description du système de gestion de la base de données...p. 15
III Etapes du développement de TriAnnot Consultation Tool (TACT)...p. 16 A) La base de données...p. 16 1 ) Pourquoi une base de données?...p. 16 2 ) Description de la base de données...p. 16 3 ) Mise à jour et maintenance de la base de données...p. 17 B) Le codage...p. 18 1 ) Le PHP et les moteurs de recherche...p. 18 2 ) L architecture «pseudo-frame»...p. 20 C) La mise en forme...p. 21 1 ) Design et navigateurs...p. 21 2 ) Exemple de modification graphique : le menu horizontal...p. 22 IV Mise en ligne de l interface...p. 22 A) Où héberger TACT?...p. 22 B) Comment héberger une interface Web?...p. 23 C) Perspectives?...p. 24 Conclusion...p. 25 Bibliographie, Glossaire et Annexes
INTRODUCTION Les dernières années ont bien montrées que la Bioinformatique prend une place de plus en plus importante au sein des laboratoires de recherche en biologie, et ceci quel que soit leurs domaines d activité. L INRA de Clermont-Ferrand ne manque pas de proposer chaque année des stages orientés vers cette nouvelle discipline. Les quatre mois de mon stage de Licence Pro en Bioinformatique se sont ainsi déroulés au sein de l équipe «Structure, Fonction et Evolution des Génomes du Blé» coordonnée par Mme C. Feuillet et faisant parti de l UMR INRA/UBP Amélioration et Santé des Plantes présente sur le Site de Crouël de l INRA de Clermont-Ferrand. Après une semaine de discussion, les principaux objectifs du stage ont été clairement définis et mon travail de programmation de l interface Web TriAnnot Consultation Tool (TACT) a pu commencer. Le présent rapport a été écrit dans le but de rendre plus clair le travail effectué sur machine au cours des quatre derniers mois (Consultable en ligne à l adresse suivante : http://genome.jouy.inra.fr/triannot/index.php ). Dans une première partie nous aborderons tout d abord le contexte et le sujet de mon stage avant de nous pencher, dans un second temps, sur la description des différents outils nécessaires pour concevoir et tester mon interface Web. La 3 ème partie de ce rapport permettra quant à elle d expliquer le fonctionnement interne de TACT par la description de ses différentes étapes de développement. Une brève explication concernant la mise en place du design de l interface clôturera cette 3 ème partie. Enfin la 4 ème et dernière partie de ce rapport servira à clarifier le processus de mise en ligne de TriAnnot Consultation Tool. Pour faciliter la compréhension de ce rapport, un glossaire des termes techniques a été ajouté. Pour chaque mot souligné et colorisé en orange il correspondra donc une définition simple et claire dans le glossaire. 1
I Le stage : Contexte et Cahier des Charges A) L INRA 1 ) Présentation générale L INRA (Institut National de Recherche Agronomique) a été créé en 1946 dans le contexte du début d après-guerre et du projet de modernisation de l agriculture française. C est un établissement public à caractère scientifique et technologique placé sous la double tutelle des ministères en charge de l agriculture et de la recherche. Avec près de 9000 collaborateurs et un budget avoisinant les 680 millions d euros en 2005, l INRA se classe à la 2 ème position des organismes français de recherche publique et 1 er organisme européen de recherche agronomique. 2 ) Quelques dates et chiffres clés a) Dates clés 1946/1960 : L INRA est l un des acteurs majeurs de la modernisation de l agriculture. 1960/1980 : L INRA contribue par la recherche et l innovation à l essor du secteur agroalimentaire français. 1980/2000 : L Institut intègre les nouvelles technologies des sciences du vivant (biologie moléculaire, génie génétique). Depuis 2004, l INRA joue un rôle d animation de la recherche dans des programmes fédérateurs. En 2005, l Agence Nationale de la Recherche (ANR) délègue à l INRA l animation scientifique et la gestion de cinq programmes : - Agriculture et développement durable - Alimentation et nutrition humaine - Génomique animale - Génomique végétale - OGM végétaux. b) Chiffres clés 21 centres, près de 200 sites de recherche et d expérimentation dans toute la France regroupant 8 850 agents en 2004, dont 47 % sont des femmes (1 840 scientifiques, 2 360 ingénieurs, 4 640 techniciens et administratifs). 257 unités de recherche dont 145 unités mixtes de recherche (UMR) associant l INRA à d autres organismes de recherche ou d enseignement supérieur. 2 475 publications signées ou co-signées par des chercheurs INRA en 2003. Plus de 20 000 heures de cours d enseignement supérieur au sein des écoles agronomiques et vétérinaires et à l université dispensées par 1 200 chercheurs et ingénieurs. 2
3 ) Champs de recherche Les trois grands domaines de recherche de l INRA sont : - L agriculture : production d aliments et contribution à l aménagement des territoires - L environnement : mieux comprendre le fonctionnement et l évolution des milieux naturels (forêts, prairies, eaux, sols) dans l optique d une gestion durable des ressources naturelles - L alimentation : accompagner l'évolution de toute la chaîne alimentaire vers un bien-être accru des consommateurs en termes de santé, de qualité et de plaisir Ses trois champs d intervention sont déclinés en six axes de recherche : - Environnement et espace rural. - Alimentation humaine et sécurité des aliments - Qualité des produits agricoles - Connaissance du vivant - Pratiques et systèmes agricoles - Sciences sociales B) L équipe Structure, Fonction et Evolution des Génomes de Blé (Génome) 1 ) Site de Crouël UMR 1095 INRA/UBP ASP Le Centre INRA de Clermont-Ferrand est divisé en deux sites : l un à Theix et l autre à Crouël. Une unité mixte de recherche (UMR) a été crée en 2000 pour associer l INRA de Crouël (Station d Amélioration des Plantes) et l équipe dirigée par Paul Nicolas de l université Blaise Pascal (UBP). Cette unité dirigée par G. Charmet et nommée ASP (ou Unité d Amélioration et Santé des Plantes) axe à présent ses recherches sur l étude du génome du blé. L Unité est dirigée par G. Charmet. En effet, depuis Décembre 2005, l UMR 1095 de Clermont-Ferrand s est restructurée autour de deux grands projets, dont le modèle d étude est le blé tendre, (Triticum aestivum) et qui concernent des aspects de biologie structurale et évolutive d une part, (Axe 1) et des aspects de biologie intégrative et fonctionnelle d autre part (Axe 2) (Ces Axes sont détaillés en annexe (p.i)). Ces deux projets s inscrivent dans les champs thématiques prioritaires CT1, «Comprendre, conserver et valoriser la diversité génétique végétale» et CT2 «Comprendre et maîtriser le déterminisme génétique de caractères d intérêt et de ceux liés à l usage des produits» du schéma stratégique 2005-2009 du Département de Génétique et d Amélioration des Plantes de l INRA. Ces projets sont développées en partenariat national et international (notamment ETGI European Triticeae Genomic Initiative & IWGSC International Wheat Genomic Sequencing Consortium) dans les domaines de la génétique, la génomique structurale et fonctionnelle, la génomique comparée et évolutive, la biochimie, la physiologie, la bioinformatique, la modélisation et les ressources génétiques. 3
2 ) L équipe : Objectifs et axes de recherche L équipe «Structure, Fonction et Evolution des Génomes de Blé» (Equipe Génome), dirigée par Madame Catherine FEUILLET (DR), et dans laquelle j ai été intégré au cours de mon stage a pour thématique «Comprendre l organisation et les mécanismes d évolution des génomes» et ses objectifs sont les suivants : - Mieux comprendre l organisation structurale, la régulation fonctionnelle et les mécanismes d évolution des génomes du blé. - La mise en place d outils et de stratégies pour permettre le développement de marqueurs diagnostiques. - Construire des cartes physiques afin d accélérer le clonage positionnel de QTL et gènes d intérêt agronomique. - Préparer le séquençage du génome du blé dans le cadre du consortium international IWGSC (International Wheat Genome Sequencing Consortium). (http://www.wheatgenome.org/ ). Ces objectifs sont structurés autour de deux axes principaux ayant chacun trois projets. Le détail de ces axes est disponible en annexe (p.i). 3 ) La Bioinformatique au sein de l Equipe Génome Dès 1998 le besoin de mettre en place un environnement adéquat permettant d entreprendre des approches dites «in silico» (ou Bioanalyse), à la jonction des deux grands volets de l analyse du vivant (génétique et génomique), s est fait sentir. En conséquence, un Environnement bioinformatique, coordonné par Philippe Leroy, a été mis en place dès 1999 en collaboration étroite avec l URGI (Unité de recherche en Génomique Informatique) et l URGV (Unité de Recherche en Génomique Végétale). Elle bénéficie également de l apport technique de Nicolas Guilhot (Ingénieur informaticien) et de l aide logistique de l équipe de Claude Barreyre (Unité Informatique du Centre de Clermont-Theix). De nombreux programmes bioinformatiques ont été installés sur les serveurs «Saturne» et «Genome», qui constituent l essentiel des ressources machines de l environnement bioinformatique. Plus de 456 scripts ont également été écrits dans des langages aussi variés que le sont leurs applications. Un grand nombre de base de données internationales et 27 banques locales ont également été mises à la disposition du personnel du site. De plus, une base de donnée de travail pour l archivage et la gestion des données de génétique et génomique («Base de données Poaceae») a été créé par P. Leroy à l aide du logiciel Paradox afin de synthétiser toutes les informations disponibles. Enfin, P.Leroy est également à l origine de la construction d un pipeline d annotation automatique de séquences BAC, développé à l origine par B. Laubin et L. Cerutti puis amélioré récemment par E. Gicquello et F. Legeai. Ce pipeline est accessible sur le site de l URGI dans le cadre du site Web Triannot Project (http://urgi.infobiogen.fr/projects/triannot/ ). 4
Cet Environnement Bioinformatique assure ainsi un soutient important aux différentes équipes et projets de génomique développés dans l UMR, notamment pour : - L annotation et/ou la ré-annotation de gènes. - L annotation et/ou la ré-annotation de BAC et «BAC ends» et le développement in silico de marqueurs microsatellites. - La recherche de SNP (Single Nucleotide Polymorphism) à partir de plusieurs familles de gènes dans le cadre de l étude de la variabilité de populations, du déséquilibre de liaison et des approches de génétique d association. - Le développement d une base de connaissance en génomique végétale. - Toutes les applications utilisant la colinéarité entre les génomes de céréales. C) Projet Cahier des Charges 1 ) Le projet TriAnnot L UMR mène actuellement un projet pilote afin de tester la possibilité d aborder l étude de l énorme génome du blé chromosome par chromosome et non dans son intégralité. L équipe se concentre sur l analyse structurale, fonctionnelle et évolutive du chromosome 3B (Le blé est un polyploïde possédant trois génomes A, B et D) en utilisant une banque de BAC spécifique du chromosome 3B produite par «flow sorting» à partir de la variété de blé Chinese Spring. Cette banque représente 67 968 clones et est estimée à 6,2x (Chaque région du génome devrait, en théorie, être représentée 6 fois). Actuellement une carte physique du chromosome 3B est en cour de développement, ainsi que l ancrage de cette carte physique sur diverses cartes génétiques. L identification de régions d intérêt (QTL Quantitative Trait Loci) est également à l étude pour des gènes de résistance aux maladies ou des gènes impliqués dans la teneur en protéines (facteur déterminant pour la qualité boulangère). Il est aisément compréhensible qu une masse énorme de données va être générée dans les années à venir, et qu il est donc nécessaire de développer et mettre à la disposition de la communauté scientifique de nouveaux outils de bioanalyse, et notamment d annotation automatique et expertisée. C est dans cette optique et en s inspirant d un projet similaire concernant le génome du riz (RiceGAAS - http://ricegaas.dna.affrc.go.jp ) que le projet TriAnnot a vu le jour. Le projet TriAnnot a plusieurs objectifs dont certains sont déjà totalement atteints: - Mettre en place un pipeline automatisé d annotation et de ré-annotation de séquences BAC (TriAnnot Pipeline V1.0). - Un «viewer» permettant de comparer graphiquement les annotations issues de diverses sources (pipelines, experts, base de données). 5
- Une interface web permettant de trouver directement les informations concernant l annotation d une séquence BAC particulière sur TriAnnot GBrowse (et les grandes banques mondiales), ainsi que les informations disponibles pour les gènes ayant fait l objet d une expertise manuelle et existant dans la base de données GeneFarm - http://urgi.infobiogen.fr/genefarm/index.htpl (et les grandes banques mondiales) à l aide d un moteur de recherche multicritère. Ce troisième objectif constitue mon sujet de stage Licence Pro. A plus ou moins long terme le projet TriAnnot a aussi les deux objectifs suivants : - Mettre en place un «Guidelines» (ou procédure) pour l annotation des séquences génomiques de blé réalisée dans le cadre du consortium international pour le séquençage du génome du blé (IWGSC). - Tenter de créer un réseau international d annotateurs experts - Wheat International Annotator Network (WIAN), qui regrouperait l ensemble des objectifs réalisés précédemment, et fonctionnerait grâce à la participation de plusieurs spécialistes de chacun des domaines de connaissance nécessaires à la réalisation d une annotation correcte de séquences BAC. 2 ) Cahier des Charges du stage a) Evolution du Sujet Le sujet de base avait été formulé comme ceci : «Mettre au point une page WEB dynamique sous forme de tableau qu'il serait très facile de mettre à jour à partir d'un fichier ASCII tabulé. La page WEB est composée de 4 grandes colonnes (Espèces, chromosomes, BACs, Gènes) qu'il faut pouvoir trier dans l'ordre voulu et sur lesquelles il est également possible de faire une sélection à partir d'une chaîne de caractère» Après une semaine de discussion concernant les choix techniques (langages à utiliser, forme de l interface, etc..) et quelques tests permettant de voir les éventuelles impossibilités techniques et incohérences théoriques et/ou biologiques, le projet a subit plusieurs remaniements importants. Ainsi le projet final nommé «TriAnnot Consultation Tool» est caractérisé par les points suivants : - Conception d une interface Web complète constituée de plusieurs pages et non plus une seule page. Le choix d une page unique n était pas viable car ne permettait pas la mise en place d un moteur de recherche multicritère, et ne permettait pas d avoir une partie publique (consultation) et une partie privée (mise à jour, backup). - Le fichier ASCII tabulé généré à partir de Paradox ne sera pas lu directement à plat mais sera chargé dans une base de donnée mono-table grâce à une procédure automatisée. C est cette base de donnée qui sera interrogée et permettra d effectuer les recherches et de créer les liens nécessaires vers les banques de données internationales. 6
- La présentation en colonne trop peu pratique et pas assez claire à utiliser a été remplacée par un système de moteur de recherche multicritères offrant la possibilité de sélectionner entre un et trois critère(s) par recherche (dans la liste : Espèces, Chromosomes, Nom des gènes). Autre critère en faveur du moteur de recherche à trois critères face aux quatre colonnes: faire une sélection dans l une des colonnes aurait privé l une des autres de ses possibilités et le nombre de résultats pouvant être obtenu à la fin de certaines recherches s en serait retrouvé très amoindri. - Un moteur de recherche en deux parties (basées sur la même architecture) a finalement été mis en place afin d obtenir des résultats plus spécifiques et correspondant mieux aux besoins de l utilisateur à chaque recherche. Ainsi la première partie nommée «TriAnnot Search Engine» permet de lister les BACs disponibles dans TriAnnot et d obtenir une liste de liens directs vers TriAnnot GBrowse et les banques de l EBI et du NCBI. La seconde partie nommée «GeneFarm search engine» permet quant à elle de lister les gènes présents dans GeneFarm et d obtenir une liste de liens directs vers la banque GeneFarm (si disponible dans la partie publique) et les banques de l EBI, du NCBI et la banque Swissprot (parfois seulement). - Une petite fonction permettant de scanner les pages Web à distance permet au programme de ne pas afficher de lien mort ou inexistant dans la liste de résultats. - En complément de l interface visible pour le grand publique un certain nombre de fonctionnalités ont été ajoutées afin de garantir une mise à jour et une maintenance aisée de la base de données associée. Parmi ces fonctionnalités on trouve donc : o Un script de mise à jour automatique de la base de données o Une fonction de création de Backup/Sauvegarde (téléchargeable) automatique à chaque mise à jour o Une fonction de restauration des données sur erreur de mise à jour o Un script de restauration complète de la base de donnée. - Une sécurité accru par sécurisation des dossiers contenant les fichiers de configuration des connexions aux bases de données (passage en erreur 403) et verrouillage des dossiers réservés aux administrateurs par mot de passe. b) Au niveau technique Les choix techniques ont été les suivants : - Langage XHTML 1.0 plutôt que HTML 4.1 - PHP pour les gestions de la base de données. - Le Javascript délaissé au profit du CSS pour l apparence et la réactivité de l interface. - PHPMyAdmin en tant que système de gestion des bases de données. - Développement de l interface dans un premier temps en local puis hébergement en ligne. - Optimiser l interface pour les navigateurs récents comme Mozilla FireFox. 7
II Outils et langages Avant de présenter les outils et les étapes de développement du «TriAnnot Consultation Tool» TACT, un bref rappel sur le Web me semble nécessaire. A) Quelques rappels sur le Web et sa programmation 1 ) Le Web Internet est le plus connu et le plus étendu des réseaux existants, c est un WAN (pour Wide Area Network), c'est-à-dire un immense assemblage de multiples petits réseaux locaux (LAN pour Local Area Network) qui communiquent entre eux. On appelle «Web» (mot anglais signifiant «toile»), contraction de «World Wide Web» (d'où l'acronyme www), une des possibilités offertes par le réseau Internet de naviguer entre des documents reliés par des liens hypertextes. Le principe de web repose sur l'utilisation d'hyperliens (Concept créé et mis au point par Tim-Berners LEE en 1991) pour naviguer entre des documents (les «pages web») grâce à un logiciel conçu spécialement à cet effet : le navigateur. Le Web est comme un livre immense composé de millier de pages non pas identifiées par un numéro mais par leur URL (Uniform Resource Locator). L URL communément appelée adresse, car entrée dans la barre d adresse du navigateur, est utilisée pour localiser l endroit et la machine sur laquelle se trouve la page web que l on souhaite consulter. Si l on conserve l analogie avec le livre, une interface web ou un site web correspondrait à un chapitre long de une à plusieurs pages. Ainsi l URL permettant d accéder au sous-chapitre que j ai écrit dans cette immense livre est la suivante : http://genome.jouy.inra.fr/triannot/ 2 ) La programmation Web Lorsque l on navigue sur Internet à la recherche d informations sur le mot programmation la définition revenant le plus souvent est : «La programmation dans le domaine informatique est l'ensemble des activités qui permettent l'écriture des programmes informatiques». Dans cette définition le terme «programmes informatiques» est utilisé au sens le plus large du terme et peut aussi bien désigner une simple page Web qu un programme de plusieurs dizaines de milliers de lignes de code faisant parti d un logiciel complexe comme un jeu vidéo par exemple. Le créateur de site Web ou Webmaster crée, à l aide des différents langages de programmation existants, un ensemble de page web accessible à tous ou possédant un accès restreint (limitation selon les droits de l utilisateur). Chaque jour des dizaines de pages Web sont mises en ligne mais toutes n ont pas été créées par un Webmaster professionnel. De nos jours certains logiciels permettent à quelqu un ignorant tout (ou presque) de la programmation de créer de petites pages web simples sans aucune difficulté. Avec ces logiciels de type WYSIWYG («What You See Is What You Get») l utilisateur crée la page qu il souhaite obtenir de manière graphique (en cliquant sur des menus, etc..). Ce procédé bien que très convivial en reste tout de même des plus limité, et ne permet pas de créer des sites au design complexe comme l on en trouve beaucoup sur Internet. 8
Ainsi si l on souhaite créer un site Internet complet et complexe il est préférable de connaître, voir de maîtriser un nombre de plus en plus conséquent de langages de programmation web. Afin de créer une page Web aucun logiciel complexe n est obligatoirement nécessaire. Un simple bloc note suffit amplement. Néanmoins un grand nombre de logiciels «opensource» ou payants ont vu le jour pour aider le programmeur dans son travail!! Aussi avant de vous présenter les différents langages, dont la connaissance a été requise pour concevoir TACT, je m attarderai un peu sur la description des différents outils à la disposition du Webmaster. B) Outils et langages 1 ) Outils de développement a) Outils de programmation Parmi le nombre important de logiciels dédiés à la programmation Web j ai choisi d utiliser les deux logiciels suivants : Macromedia Dreamweaver 8.0 : Dreamweaver est une application permettant la conception de sites web sophistiqués s adressant tout d abord au professionnel mais utilisable par tous avec un peu d entraînement. Ce logiciel est particulièrement adapté pour la manipulation des éléments multimédia et des contenus liés aux bases de données. Ce logiciel étant considéré comme une référence dans son domaine et parfaitement adapté à la conception d interface reposant sur une base de données, c est avec lui que j en ai développé la plus grande partie de TACT. Les avantages de cette application sont nombreux : - Des assistants permettant de créer des sites simples ou complexes à partir de rien. - Un centre de support en ligne performant (FAQ, tutoriaux, forums, etc..) et un fichier d aide complet pour tout ceux qui seraient perdus. - Une colorisation syntaxique évoluée pour la plupart des langages existants. - Un accès facilité aux feuilles de styles en cascade (CSS) en les regroupant dans un nouveau panneau, avec codes couleurs et vues imbriquées. - Un système d onglet déplaçable pour ouvrir et naviguer entre plusieurs pages de code source en un clin d œil. - Plusieurs méthodes d affichage: code source seul, résultat graphique ou les deux en même temps par un système d écrans séparés horizontalement. - Un aperçu complet quasi identique à l affichage observable sur FireFox ou IE (Microsoft Internet Explorer). - Création automatique des squelettes des pages web statique (HTML, XHTML) ou dynamique (PHP) avec ajout automatique du complexe Doctype. - Possibilité de masquer une partie du code source. - Une fonction de zoom jusqu'à 6400% pour aller au plus loin dans le détail!! 9
L avantage qui fait réellement pencher la balance vers ce logiciel est sans doute sa capacité à afficher tous les attributs existants pour une balise donnée lors de sa création. Plus besoin alors de parcourir le Web à la recherche d informations sur telle ou telle balise!! Le gain de temps est énorme. La liste des avantages étant des plus longues le mieux est d aller la consulter directement en ligne : http://www.adobe.com/support/documentation/fr/dreamweaver/. Pour ceux qui n auraient pas les moyens de s acheter la licence (des plus coûteuse) de ce logiciel des versions d essai (limitée en durée) sont téléchargeables directement sur le site officiel de Macromedia. A la fin de la période d évaluation de ce logiciel des plus pratique, mais malheureusement payant dans sa version complète, j ai du me rabattre sur un logiciel beaucoup plus modeste nommé SciTE. SciTE (ou Scintilla Text Editor): (http://scintilla.sourceforge.net/scitedownload.html) Ce logiciel, comme son nom l indique est un programme léger, puissant et complet, utilisable en tant qu éditeur de texte ou de code source. Malgré sa relative simplicité et son design des plus sobre SciTE peut être utilisé en tant qu environnement de développement complet. En plus d être un logiciel libre téléchargeable gratuitement sur Internet SciTE présente de nombreux avantages : - Affichage en onglet permettant l ouverture simultanée de plusieurs fichiers - Une fonction de coloration syntaxique de plus de 40 types de fichiers différents. - Indentation des paragraphes - Affichage des messages de compilation - Auto-complétion - Accessibilité de l historique - Exportation en formats PDF, HTML, etc - Arbre de code dépliant b) Outils de test Ecrire des centaines de lignes de code est une chose, tester les pages contenant du code dynamique PHP en est une autre!! En effet, il est aisé de tester une page codée entièrement en HTML car il suffit de l ouvrir avec un simple navigateur comme Mozilla Firefox, mais ce n est pas le cas des pages contenant du code écrit en langage PHP. Pour les tester, il faut soit disposer d un serveur Web, soit d un logiciel installé sur une machine tout ce qu il y a de plus classique qui va émuler (on peut aussi dire simuler) un serveur Web apache, permettre de tester les scripts PHP et d utiliser un SGBD (système de gestion des bases de données) sans pour autant transformer la machine en serveur. Le plus connu et le plus performant de ces émulateurs : EasyPHP est disponible à l adresse suivante : http://www.easyphp.org/telechargements.php3. 10
EasyPHP est un package de logiciel gratuitement téléchargeable sur Internet créé par trois adeptes de PHP (Emmanuel Faivre, Laurent Abbal et Thierry Murail) contenant plusieurs produits incontournables de la scène PHP: Le serveur Web Apache Le moteur de scripts PHP La base de données MySQL Un outil de gestion de base de données graphique, Phpmyadmin EasyPHP est ainsi un pack fonctionnant sous Windows et permettant d'installer en un clin d'oeil les éléments nécessaires au fonctionnement d'un site Web dynamique développé en PHP. On dit qu une personne qui utilise EasyPHP travaille en «local». En effet tout ce qu il développe et teste n existe que sur sa machine et n ai pas accessible à partir d Internet. A l inverse, quelqu un qui travaille sur sa machine mais dont toutes les données sont accessibles à partir d Internet et se trouvent sur un serveur Web réel incluant apache, MySQL, PHP 4 et phpmyadmin comme module, travaille «en ligne». TACT a bien sur d abord été développé en local avant de «migrer» sur un serveur Web. 2 ) Langages utilisés Dans le monde des centaines de langues sont parlées et comportent chacune un grand nombre de dialectes. En programmation c est pareil!! Les langages de programmation sont les langues et leurs versions sont les dialectes. Tout comme il est impossible de parler toutes les langues terrestres, il est impossible de maîtriser l ensemble des langages de programmation. Devant cette prolifération de langage, il est évident qu un choix doit être fait avant de se lancer dans le développement d une application. Pour aider les Webmaster un consortium international a vu le jour. a) Rappel sur le W3C Le World Wide Web Consortium (W3C) est un consortium fondé en octobre 1994 chargé de définir les normes (appelées recommandations) du World Wide Web telles que HTML, XHTML, XML, CSS, etc... Sa gestion est assurée conjointement par le MIT aux États-Unis, l'ercim en Europe et l'université Keio au Japon. En parcourant les pages du site officiel en anglais (http://www.w3.org/) le Webmaster peut savoir quels sont les langages se développant et ceux qui sont en perte de vitesse. Ainsi on peut y apprendre que le XHTML tend peu à peu à remplacer le classique HTML ou encore que le CSS est maintenant préféré au Javascript. Le W3C permet également, grâce à un système de validation automatique, de savoir si une page est conforme ou non à une norme donnée. b) HTML et XHTML Le langage HTML ou «HyperText Markup Language» est un langage dit de marquage ou de balisage chargé de formaliser, grâce à un système complet de balise, la manière dont une page Web doit être affichée par le navigateur. 11
Le protocole HTTP permet d'accéder via le réseau à des documents repérés par l URL (voir plus haut) et donc d afficher des documents (et en particulier des pages Web) provenant de machines différentes. Il faut savoir que le langage HTML est un standard ou plutôt un ensemble de recommandations publié par le W3C. Les différentes spécifications officielles du HTML décrivent les instructions HTML mais pas la manière dont elles seront implémentées (intégrées à un programme). Néanmoins malgré un grand nombre de spécifications détaillées l affichage d une même page web peut différer selon le navigateur utilisé pour les afficher. Il est par exemple fréquent de voir une page présenter de grosses différences de design selon si on l affiche avec Mozilla Firefox, Microsoft Internet Explorer ou encore Netscape. On observe même des différences entre deux versions différentes d un même logiciel!! Il arrive même parfois que les éditeurs de logiciels ajoutent des balises dites «propriétaires» au langage HTML. Ces balises «propriétaires» qui ne font pas partie des spécifications du W3C sont des balises qui ne seront reconnues que par le navigateur qui leur est associé et illisible pour les autres. Cet épineux problème et les moyens de le contourner seront repris plus loin dans ce rapport. L HTML mis au point par Tim Berners-Lee à partir de 1989 mais on parle de langage HTML depuis 1993 grâce à l arrivée du HTML 1.0. Depuis les versions se sont succédées jusqu'à atteindre la version 4. Le XHTML est l évolution logique de l HTML. Créé en Janvier 2000, le XHTML 1.0 a pour but de se conformer à la norme XML (Extensible Markup Language) tout en conservant les propriétés du HTML 4.x. En fait le XHTML est une sorte d HTML à laquelle on aurait ajouté la rigueur de déclaration du XML. Le XHTML est donc un hybride entre HTML et XML. Pour éviter les confusions entre les versions, le World Wide Web Consortium a décidé de doter ce nouveau HTML (XHTML) basé sur XML, d'un nouveau nom et de son propre contrôle de version. Le World Wide Web Consortium a donc décidé qu'il n'y aura pas de HTML 5.0, mais un nouveau standard : le XHTML (Extensible Hypertext Markup Language).La nouvelle norme du XHTML 2.0 a été publiée en juillet 2004. TACT a été codé entièrement en XHTML. Lorsqu un programmeur décide de coder en XHTML celui-ci a le choix : - De coder totalement en XHTML en respectant l intégralité des règles de ce langage, on parle de document XHTML 1.0 Strict. - De coder de manière plus souple en respectant la rigueur de déclaration du XHTML 1.0 tout en laissant une partie du code en HTML 4, on parle de XHTML 1.0 Transitional. c) PHP Le langage PHP a été mis au point au début d'automne 1994 par Rasmus Lerdorf. A cette époque son langage de script n avait qu un seul but : conserver la trace des utilisateurs venant consulter son CV sur son site, grâce à l'accès à une base de données par l'intermédiaire de requêtes SQL. De nombreux internautes furent intéressés par son langage et Rasmus Lerdorf le mit donc en ligne en 1995 et baptisa la première version de ce programme Personal Sommaire Page Tools (PSPT), puis Personal Home Page v1.0 (PHP). 12
PHP, est un acronyme récursif, qui signifie à présent «PHP: Hypertext Preprocessor» : c'est un langage de script HTML, exécuté côté serveur. Sa syntaxe est empruntée aux langages C, Java et Perl, et est facile à apprendre. Le but de ce langage est de permettre aux développeurs web d'écrire des pages dynamiques rapidement, mais ce n est pas la seule fonctionnalité de PHP. Il est néanmoins important de noter la différence entre le PHP et les scripts CGI écrits dans d'autres langages tels que le Perl ou le C : - Un script CGI est un programme avec de nombreuses lignes de commandes afin d'afficher une page HTML. - Avec PHP vous écrivez une page HTML avec du code inclus à l'intérieur afin de réaliser une action précise (afficher du texte, se connecter à une base de données, etc. ). Le code PHP est inclus entre une balise de début (<?php) et une balise de fin (?>) qui permettent au serveur web de passer en "mode PHP". Le langage PHP est de loin le langage que j ai le plus utilisé au cours de ce stage et ceci pour de nombreuses raisons : - J avais besoin d un langage s exécutant coté serveur car c est sur le serveur de l INRA de Jouy en Josas que se trouve la base de données. Or PHP est un langage interprété s exécutant coté serveur dont la syntaxe provient des langages C, Perl et Java. C était donc le choix le plus logique pour atteindre les objectifs du programme. - Il est gratuit et son code source est disponible. - C est un langage assez simple d utilisation et d apprentissage. - On peut facilement l inclure dans du code HTML. - Il est intégré au sein de nombreux serveurs Web (apache par exemple). Mais le principal avantage de ce langage est sa simplicité d interfaçage avec les SGBD (système de gestion des bases de données) et donc la possibilité pour celui-ci de manipuler directement le contenu des bases de données. De plus la dernière version de celui-ci est intégrée au logiciel EasyPHP. d) Javascript ou CSS Lors de la création de TACT j ai eu le choix entre utiliser le Javascript ou le CSS pour créer un certain nombre d effets sur les différentes pages composant l interface (Pied de pages fixe, image au survol de liens, etc.). Je vais donc présenter brièvement ces deux langages avant d expliquer pourquoi mon choix s est porté sur le CSS. Javascript : Javascript, premier langage de script pour le web à avoir vu le jour, a été mis au point par Netscape en 1995. Dans un premier temps nommé «Livescript» et créé afin de fournir un langage de script au navigateur Netscape il a été vivement critiqué pour de nombreuses raisons (manque de sécurité, messages d erreur in explicites, etc. ). 13
Une des seules améliorations apportées à HTML par Javascript est la possibilité d'exécuter des commandes du côté client, c'est-à-dire au niveau du navigateur et non du serveur web. Javascript est donc dépendant du navigateur appelant la page contenant le script mais ne nécessite pas d être compilé. Il ne faut pas confondre le JavaScript et le Java. En effet contrairement au langage Java, le code Javascript est directement écrit dans la page HTML. CSS : C est en 1996 que le W3C publia une recommandation intitulée «Cascading StyleSheets» (ou CSS) introduisant le concept de feuille de style. Le principe de feuille de style est né afin de pallier un gros défaut du langage HTML, c'est-à-dire son incapacité à gérer de manière rapide et simple la mise en page et la présentation de plusieurs éléments d une même page ou de plusieurs pages composant un site Web. En effet, malgré un certain nombre de balises permettant de mettre en page ou de définir le style d'un texte, chaque élément possède son propre style, indépendamment des éléments qui l'entourent en HTML. Le principe des feuilles de style consiste donc à regrouper dans un même document des caractéristiques de mise en forme associées à des groupes d'éléments. Il suffit de définir dans le fichier.css, par un nom bien précis, un ensemble de caractéristiques de mise en forme et de l'appeler dans une balise HTML grâce à l attribut «class» pour l'appliquer à un élément donné. Ainsi si un Webmaster désire modifier la charte graphique de son site il aura juste à modifier la feuille de style qui le gère et non pas toutes les balises de toutes les pages qui doivent subir des modifications. Le gain de temps est considérable dans ce genre de cas. Elles sont appelées «feuilles de style en cascade» (en anglais «Cascading Style Sheets») car il est possible d'en définir plusieurs pour une même page (alternative stylesheet) que les styles peuvent être hérités en cascade. Depuis 1998 la norme officielle est le CSS 2.0. Les feuilles de style permettent notamment : d'obtenir une présentation homogène sur tout un site en faisant appel sur toutes les pages à une même définition de style. de permettre le changement de l'aspect d'un site complet entier par la seule modification de quelques lignes. une plus grande lisibilité du HTML, car les styles sont définis à part. des chargements de page plus rapides. un positionnement plus rigoureux des éléments. de faire apparaître des images au survol d un lien html. la gestion des débordements et de la visibilité des éléments. Exemple : La simple ligne CSS suivante indique aux pages qui l appellent que le contenu de chaque cellule de tableau (td) doit être centré : td { text-align:center; }. En HTML classique il aurait fallu le préciser dans chaque balise td que l on souhaitait un alignement centré. Cela serait un travail long et fastidieux. 14