Réalisation d'un intranet dédié à faciliter la communication interne et mise en place d'une nouvelle charte graphique dans une application de signature en ligne. 1 / 59
J'autorise les responsables de l'iut à publier mon rapport sur l'intranet de l'établissement. 2 / 59
1. REMERCIEMENTS Je tiens à remercier mon maître de stage Alain MARCOZ pour son accueil au sein d'almerys et pour le suivi accordé à mon stage. Je tiens également à remercier Sophie BARDET, chef de projet de l'application de signature, qui m'a pris en charge durant les trois dernières semaines de mon stage. Je remercie également l'ensemble des membres de l'équipes ECDC pour leur accueil chaleureux ainsi que pour la disponibilité accordée à mes projets. 3 / 59
Sommaire 1.REMERCIEMENTS...3 2.INTRODUCTION GÉNÉRALE...6 3.COMPTE RENDU D EXPÉRIENCE PROFESSIONNELLE...8 4.PRÉSENTATION DE L'ENTREPRISE...10 5.RÉALISATION D'UN INTRANET POUR L'ÉQUIPE EC-DC...13 5.1Analyse des besoins de l'équipe...13 5.2Choix de l'outil de conception utilisé pour la réalisation...14 5.3Réalisation de la maquette et des spécifications...16 5.4Architecture fonctionnelle de l'intranet...17 5.5Architecture technique de l'intranet...22 5.5.1.Principe de taxonomie...22 5.5.2.Spécialisation de nœud...23 5.5.3.Utilisation de modules complémentaires...25 5.5.4.Le module «Views»,création de pages dynamiques...25 5.5.5.Le module «calendar», création de calendrier...26 5.5.6.Développement d'un module de redirection d'url...29 5.6Déploiement et évolutions futures...31 6.PORTAGE DE L'INTERFACE GRAPHIQUE DE L'APPLICATION EBEESIGN...33 6.1Présentation du projet...33 6.2Fonctionnement...34 6.3Les objectifs...35 6.4Transfert de compétences...35 6.5Mise en place du nouveau design...36 6.6Portage du javascript...37 6.6.1.Utilisation du module DatePicker pour Jquery...38 4 / 59
6.6.2.Utilisation du module DataTable pour Jquery...39 6.7Mise en place de nouvelles spécifications métier...41 6.7.1.Algorithme de validation de RIB...43 7.CONCLUSION...45 8.RÉSUMÉ EN ANGLAIS...47 9.LEXIQUE...48 10.BIBLIOGRAPHIE...50 10.1Drupal...50 10.2Javascript et Jquery...50 11.TABLE DES ANNEXES...51 12.ANNEXES...52 RÉSUMÉ...59 5 / 59
2. INTRODUCTION GÉNÉRALE Durant mon année de licence informatique à l'iut informatique de Clermont-Ferrand, j'ai effectué un stage d'une durée de seize semaines au sein d'almerys. Je commencerai donc par vous présenter cette entreprise dans laquelle j'ai effectué mon stage. Au cours de ces seize semaines j'ai été amené à travailler sur deux missions différentes. La première, au début de mon stage, fut réalisée en autonomie et avait pour but de réaliser un intranet pour l'équipe dont je faisais partie. En effet, cette équipe grandit rapidement et de nombreux membres présents depuis très peu de temps ne connaissent pas toujours l'ensemble des autres membres, ni les procédures à suivre pour chaque situation. L'objectif était donc de fournir un site web interne à l'entreprise, facilitant la circulation d'informations importantes et renforçant la connaissance interne des projets et des techniques utilisées au sein de l'équipe. Le site devait être facile à utiliser, dynamique et évolutif afin de rester à jour en toutes circonstances. Je devais pour cela réaliser l'ensemble du projet, de la collecte des besoins auprès des utilisateurs jusqu'au choix des solutions techniques à mettre en place pour répondre à la problématique en passant par l'architecture interne de l'application. La deuxième mission s'inscrit dans un projet déjà en cours de développement et comprenant une équipe d'une petite dizaine de membres. Il s'agit d'une application de signature en ligne à destination de clients. L'objectif était d'assurer la continuité entre deux développeurs afin de mettre en place le nouveau design de l'application ainsi que de porter certains codes javascript d'un framework vers un autre. Ce processus s'inscrit dans un phénomène d'industrialisation de l application qui vise à la rendre la plus générique possible tout en offrant la possibilité de la spécialiser pour chaque client. Je présenterai d'abord les différentes parties qui ont composé la réalisation de l'intranet. En partant des besoins qui ont été collectés auprès des membres de l'équipe j'exposerai ensuite les choix qui ont permis de décider quel outil serait utilisé pour réaliser l'intranet. À partir de 6 / 59
là, je développerai les spécifications fonctionnelles puis techniques de l'application en précisant les mécanismes mis en place afin de répondre à certaines des problématiques rencontrées. Enfin, je terminerai par les différentes évolutions possibles envisagées pour l'avenir de l'application. La suite du rapport sera consacrée à la mission sur l'application de signature. Je commencerai donc par présenter le contexte du projet ainsi que l'application de signature en elle-même. Ensuite seront abordées les différentes transformations au niveau de l'interface graphique, puis les différentes problématiques rencontrées pour mettre en place le nouveau framework javascript. Pour finir, nous verrons quels changements ont été apportés permettant de rajouter un ensemble de nouveaux champs à l'application ainsi que les changements impactés au contrôleur afin d'intégrer leurs nouvelles règles de validation. 7 / 59
3. COMPTE RENDU D EXPÉRIENCE PROFESSIONNELLE Durant ces seize semaines de stage j'ai pu intégrer pour la première fois une société privée d'une assez grande importance, travaillant de façon dominante dans le domaine de l'informatique. En effet, mes stages précédents ayant eu lieu dans un organisme public et dans une PME, ce stage me permet donc d'enrichir mon expérience professionnelle de façon diversifiée. J'ai découvert une société de taille importante ayant de fortes contraintes liées à la sécurité de par ses activités. Cela m'a permis de comprendre le mécanisme et les rôles des différentes procédures de sécurité mises en place, l'importance de sécuriser son poste de travail ainsi que les données qu'il contient. Mon expérience professionnelle au sein de l'entreprise a été marquée par les deux missions que j'ai dues réaliser. En effet, lors de la première mission que j'ai eu à effectuer, je devais concevoir un intranet de façon autonome. Cela m'a laissé une grande liberté sur les décisions techniques à prendre face aux différentes problématiques. Cela m'a également servi à mieux comprendre le cycle de vie d'un projet informatique en entreprise. Malgré mon autonomie sur les aspects techniques du développement, j'ai eu l'opportunité de travailler avec l'ensemble des membres de l'équipe. Au début cela a demandé un temps d'adaptation afin de bien intégrer l'organisation de l'entreprise. Mais rapidement, au cours de mes différents entretiens avec les membres des équipes, développeurs ou chefs de projet, j'ai pu mieux comprendre les différents projets développés au sein de l'équipe, ainsi que les besoins auxquels devra répondre l'intranet. La deuxième partie de mon stage s'est déroulée au sein d'une équipe de développeurs, ce qui implique une communication différente. En effet, au sein de cette équipe, un mécanisme de suivi quotidien du travail est mis en place. Il se présente sous la forme d'un debriefing qui a lieu chaque matin et au cours duquel est exposé l'ensemble des tâches réalisées par l'équipe la veille. Cela présente différents avantages : il permet de tenir l'équipe du projet au 8 / 59
courant de l'avancée de chacun des membres et également de fixer les objectifs de la journée de façon quantifiée et donc de prévoir plus facilement l évolution du projet. Ce mode de fonctionnement, très différent du travail en autonomie, m'a permis d'apprendre à mieux quantifier la durée des différentes tâches que j'ai été amené à réaliser. De plus, le travail en équipe m'a confronté aux expériences variées de l'équipe et m'a donc amené à découvrir de nouveaux outils ou astuces partagés par les membres de l'équipe. Pour moi ces deux expériences ont été complémentaires et m'ont donné différentes opportunités toutes très enrichissantes. 9 / 59
4. PRÉSENTATION DE L'ENTREPRISE Almerys, filiale de France Télécom sous l appellation «solutions santé d Orange Business Services», est positionnée sur le marché de la santé qui est en forte croissance. Créée en 2000, la société se place aujourd hui en tant que leader des services temps réel et infrastructures de confiance sur le marché du Tiers Payant et des services santé. Almerys se positionne en tant que Tiers de Confiance, ce qui permet la gestion d informations pour le compte d un tiers. La société facilite la gestion du Tiers Payant pour le Régime Complémentaire (RC), opère les remboursements des Professionnels de Santé (PS) pour le compte de nos clients (mutuelles, assureurs complémentaires et courtiers d assurance santé). Schéma explicatif : Illustration 1: Principe de tiers de confiance Almerys dispose d une infrastructure technique permettant la gestion de la complexité du Tiers Payant avec le respect des règles de sécurité liées à la gestion d informations de santé. Son siège social se situe à Clermont-Ferrand et ses deux filiales sont à Paris et Toulouse. 10 / 59
Employant 230 personnes sur le site de Clermont-Ferrand en janvier 2011, Almerys développe et opère des services de gestion novateurs qui modifient et améliorent chaque jour les rapports entre assurés sociaux, professionnels de santé, complémentaires santé, Sécurité Sociale et banques. Le dossier médical du patient en ligne, la prévention à grande échelle, les services en temps réel de devis et prise en charge dans le domaine de la santé font partie de ses axes stratégiques de développement. Premier opérateur de tiers payant étendu (toutes professions de santé), Almerys représente 140 000 professionnels de santé conventionnés (toutes spécialités confondues) et plus de 12 millions de bénéficiaires en janvier 2011. Les services associés au tiers payant tels que les prises en charge en ligne (hospitalière, optique, dentaire et audioprothèse) et le tiers payant dit de 3e génération (gestion de l information en temps réel) sont adaptables et utilisables sur tous les réseaux de tiers payant. Fort de son savoir-faire en dématérialisation et en sécurisation de données, Almerys propose également des solutions de signature électronique, de votes électroniques et de coffres-forts électroniques dans les conditions de sécurité requises par la loi. Aujourd hui et grâce à ses infrastructures, la société a développé des services santé centrés sur l individu tels que les carnets de santé électroniques qui permettent le suivi de la vaccination, optique, pathologies chroniques (diabète, cholestérol) et suivi du sportif de haut niveau. Mon stage s'est déroulé au sein de l'équipe ECDC (Échange Certifié et Dématérialisation de Confiance) en charge de développer les solutions de signature, vote ou bien parapheur en ligne. Mon maître de stage, Alain Marcoz, étant le responsable de domaine en charge de l'équipe ECDC j'ai été directement rattaché à l'équipe et non à l'un de ses projets. 11 / 59
Illustration 2: Organigramme de l'équipe ECDC. 12 / 59
5. RÉALISATION D'UN INTRANET POUR L'ÉQUIPE EC-DC L'objectif principal de mon stage au sein d'almerys a été de réaliser un intranet pour l'équipe EC-DC. En effet, cette équipe regroupe un nombre important de membres (environ 20 25) et nécessitait donc de disposer d'un moyen de communication interne à l'équipe. Mon maître de stage m'a donc demandé de mener ce projet dans son intégralité. L'objectif étant de déterminer l'ensemble des besoins exprimés par les différents membres de l équipe afin de proposer un outil y répondant au mieux. 5.1ANALYSE DES BESOINS DE L'ÉQUIPE Dans un premier temps, l'objectif de mon stage a été de collecter l'ensemble des besoins des utilisateurs, puis de les synthétiser. Pour cela j'ai rencontré les membres de l équipe de façon individuelle dans le but de déterminer leurs attentes face à un tel outil. Cette première confrontation avec le personnel m'a aussi permis de me renseigner sur l'organisation de l'équipe ainsi que sur les différents projets qu'elle porte. À ce stade, je disposais d'un ensemble de problématiques formulées par les membres de l'équipe, à savoir : Besoin de pouvoir accéder à des informations sur les autres projets de l'équipe afin de pouvoir suivre leur avancement et se tenir au courant de nouveaux projets ; Pouvoir déterminer qui a réalisé telle ou telle partie d'un projet ; Avoir accès facilement à des documentations souvent utilisées ; Présenter des liens d accès rapide vers les différents outils en ligne utilisés par les différents projets (qualité du code, gestion de version etc.) ; 13 / 59
Faciliter l'arrivée de nouveaux arrivants au sein de l'équipe en regroupant les différents documents de présentation ainsi que les procédures à utiliser (demande de congés, suivi des activités, réservation de salles etc.) ; Présentation de l'organigramme de l'équipe ; Rendre plus visible les différentes dates butoirs des projets (mise en production, visite clients etc.) ; Rendre plus visible les congés des membres de l'équipe ; Proposer un lieu de discussion annexe afin de pouvoir organiser des événements externes (repas d'arrivée / de départ etc.) ; Faciliter la communication au sein de l'équipe en proposant un trombinoscope de l'ensemble des membres ; Permettre au responsable du pôle ainsi qu'aux chefs de projets de publier des billets sur l avancement des projets ou sur des nouveautés au sein du pôle. Une fois les grandes problématiques à résoudre déterminées, je devais proposer une maquette fournissant un aperçu de la solution choisie afin de pouvoir la présenter à l'équipe et obtenir des retours. 5.2CHOIX DE L'OUTIL DE CONCEPTION UTILISÉ POUR LA RÉALISATION Parallèlement à la collecte des besoins de l'équipe, ma tâche consistait aussi à déterminer quel outil serait utilisé pour la réalisation de la solution. Étant seul pour développer l'intranet, mon maître de stage et moi-même avons décidé de s'orienter vers un CMS*. En effet, ce type d'outil permet de s'abstenir d'une grande partie du développement en spécialisant un ou des outils déjà existants. Mon maître de stage me laissait libre de choisir l'outil qui me semblait le plus approprié pour cette réalisation. N'ayant pas une grande connaissance des différents CMS proposés sur le marché, j'ai donc dû commencer par réaliser un comparatif afin de déterminer le plus adapté. 14 / 59
Almerys ayant déjà l'habitude de travailler avec Wordpress, ce CMS a donc fait partie de la liste des outils envisageables. J'ai ensuite continué en dressant une liste des autres CMS potentiellement utilisables en me basant sur leur réputation, ce qui m'a permis d'obtenir cet ensemble de CMS fortement plébiscités par la communauté internet : Wordpress Joomla! Drupal SPIP JAHIA Afin de déterminer quel outil était le plus à même de répondre au mieux aux problématiques à résoudre, j'ai commencé par essayer de diminuer les CMS possibles à trois outils dans le but de pouvoir les essayer sans trop consommer de temps. Les trois outils retenus ont alors été Wordpress, Joomla! et Drupal. En effet, SPIP, bien que disposant d'une bonne réputation, est un outil relativement ancien qui utilise des techniques de fonctionnement de plus en plus désuètes et il est donc peu adapté à une évolution dans le temps. JAHIA est quant à lui un CMS réalisé en Java et donc plus gourmand en ressources, de plus, après discussion avec différents développeurs web d'almerys, il est apparu que JAHIA manquait fortement de documentations de qualité. Afin de déterminer l'outil le plus adapté à la réalisation de l'intranet j'ai installé les trois autres CMS afin de pouvoir appréhender directement leur utilisation. Joomla! est vite apparu comme l'outil le moins poussé et plutôt orienté grand public, il a donc été éliminé. Wordpress étant à la base un moteur de blog ayant subi des ajouts de fonctionnalités variées au fur et à mesure du temps, ses capacités sont suffisantes pour la réalisation de l'intranet, mais son architecture force à l'utilisation de techniques détournées pour arriver à certains résultats. 15 / 59
Drupal dispose quant à lui d'une architecture beaucoup plus modulaire qui convient pratiquement à tous types de projets. De plus, lors du début de mes tests, Drupal venait de sortir dans une toute nouvelle version apportant une refonte globale de son architecture. Cette nouvelle version (7) venait répondre à toutes les anciennes critiques faites à l égard des versions précédentes. C'est donc Drupal qui a été retenu comme CMS de base servant à la réalisation de l'intranet. 5.3RÉALISATION DE LA MAQUETTE ET DES SPÉCIFICATIONS Ayant déterminé quels étaient les besoins prédominants ainsi que l'outil à utiliser pour y répondre, je devais réaliser une maquette de ce projet à l'aide d'un logiciel de prototypage : «Just In Mind»*. Pour cela j'ai essayé de déterminer une architecture simple et efficace afin de répondre aux différentes problématiques soulevées tout en conservant une simplicité d'utilisation accrue. J'ai donc décidé de regrouper un grand nombre d'informations autour des projets en euxmêmes telles que les membres de chaque équipe, les projets qui y sont rattachés, etc. À côté de cet ensemble de projets, certaines parties sont communes à tout le pôle et sont donc présentées à la racine du site, c'est le cas du trombinoscope, de l'organigramme ou bien des ressources dédiées aux nouveaux arrivants. La page d'accueil regroupe quant à elle les informations les plus importantes : les rappels sur les prochains événements ainsi que les différentes actualités du pôle. Cette maquette a ensuite été présentée à l'ensemble de l'équipe afin d'obtenir des retours et a été rapidement validée par les membres de l'équipe ainsi que par mon maître de stage. Une fois l'architecture ainsi que la présentation de base de l'application mises en place l'étape suivante a été de réaliser les différentes spécifications. Les spécifications fonctionnelles regroupent l'ensemble des fonctions et des contrôles que l'outil développé devra respecter. Les spécifications techniques viennent quant à elles définir la solution technique utilisée de façon détaillée pour chaque composante de l'intranet. Ces deux 16 / 59
documents permettent de cadrer le projet. De manière plus concrète on retrouve dans les spécifications fonctionnelles les différents droits des utilisateurs, les possibilités offertes pour les différents contenus ainsi que les étapes de chaque cas d'usage. Les spécifications techniques définissent concrètement les modules Drupal qui seront utilisés et la manière de les agencer afin d obtenir l'intranet définitif. 5.4ARCHITECTURE FONCTIONNELLE DE L'INTRANET Afin de pouvoir évoluer dans le temps, l'intranet doit être modifiable directement par les utilisateurs que ce soit pour maintenir l'existant ou bien créer de nouveaux contenus. Cette notion implique donc de définir des règles concernant les droits que les utilisateurs possèdent. En effet tous les contenus ne doivent pas être modifiés par tout le monde. Pour cela il a fallu définir l'ensemble des différents profils ainsi que leurs droits. Les cinq profils utilisateurs suivants ont été identifiés : 17 / 59
Nom du profil Droits Utilisateur anonyme - Consulter la présentation de l'équipe EC L'intranet étant accessible seulement en interne, les DC. utilisateurs anonymes correspondent à tous les - Consulter les présentations des projets. employés ne faisant pas partie de l'équipe EC/DC Développeur** - Consultation de tous les contenus. - Modification des pages communes. - Commentaires des contenus. - Maintenir son profil. - Maintenir ses compétences. - Création de pages de ressources (liens utiles, nouvel arrivant...) Chef de projet** - Rédiger les présentations de projets. - Rédaction d'un bilan hebdomadaire pour chaque projet (appelé «check-up»). Responsable de domaine** - Création des actualités de l'équipe EC DC. - Création de sondages. - Créer de nouveaux utilisateurs. - Attribuer les droits des utilisateurs. Administrateur** - Tous les droits sur l'intranet. - Les droits d administrer Drupal. (**) : Les profils héritent des droits des profils précédents. Par exemple le responsable de domaine possède aussi les droits de chef de projet, développeur ainsi qu'utilisateur anonyme. L'intranet comprend des contenus liés soit à l'équipe EC DC dans son ensemble, soit liés plus précisément à un projet. C'est pour cela que deux types de pages différents sont nécessaires : un type de page simple présenté directement depuis l'accueil du site, et 18 / 59
également un type de pages liées à un projet. À chaque nouveau projet, toutes les pages de type liées à un projet devront pouvoir lui être associées. Les pages communes du site comprennent les 12 types suivants : Page Détails Actualités de l'équipe ECDC L'ensemble des actualités posté sur l'intranet Calendrier des événements Le calendrier contenant les différents événements de l'équipe et des projets. Calendrier des congés Le calendrier contenant les congés des membres de l'équipe. Compétences des membres de l'équipe L'ensemble des compétences de l'équipe avec la possibilité de faire des recherches. Forum Liens utiles Ensemble des pages contenant des liens vers des ressources utiles. Par exemple des pages de documentation interne. Nouvel arrivant Ensemble des indications au pages bon contenant déroulement les d'une nouvelle embauche. Recherche Page de recherche par mot clé et par type. Sondages Outil de sondages pour les membres de l'équipe. Organigramme Présentation de l'organigramme de l'équipe ECDC. Outils Ensemble des pages contenant des liens vers des outils web internes tels que des outils de qualimétrie, gestion de code etc. Trombinoscope Page contenant la photo et une présentation succincte de chaque membre de l'équipe. 19 / 59
Illustration 3: Menu de navigation dans les pages communes 20 / 59
Pour chaque projet viennent se rajouter huit pages supplémentaires : Page Détails Présentation La présentation du projet Calendrier Le calendrier ne contenant que les événements liés au projet. Check-up Les différents points hebdomadaires du projet. Documentation Les différentes documentations du projet sous forme de liens vers des documents issus du réseau interne. Équipe Vue du trombinoscope ne contenant que les membres de l'équipe et de façon plus détaillée. Outils Les différents outils liés au projet. Produits Les produits issus du projet. Réalisation Les différentes réalisations faites par les membres de l'équipe pour le projet. Ces différentes sections se présentent comme des onglets présents pour chacun des projets créés par le responsable de domaine. Illustration 4: Différentes pages accessibles pour chaque projet Les différentes pages d'administration sont quant à elles créées et gérées directement par Drupal. Chaque type de données aura une page de création propre directement déduite par Drupal des types qui la composent. 21 / 59
5.5ARCHITECTURE TECHNIQUE DE L'INTRANET L'intranet est réalisé avec Drupal, il s'agit d'un outil de gestion de contenu. Pour fonctionner, Drupal définit un ensemble de règles et est basé sur des principes. L'architecture de Drupal repose sur l'utilisation de modules, le cœur de Drupal comprend lui-même différents modules pouvant être ou non activés. De plus, de nombreux modules sont téléchargeables librement afin d étendre les capacités fournies de base. Drupal utilise également un type de contenu de base pour tous les types que l'utilisateur souhaite créer, ce type est nommé «node» (nœud). Drupal permet à l'administrateur du site de créer des nouveaux contenus basés sur le node en lui ajoutant les différents champs qu'il souhaite comme, par exemple, la possibilité d'ajouter un champ date à un type. 5.5.1.Principe de taxonomie Drupal intègre de façon native un outil très intéressant qui se nomme la taxonomie. Il s'agit d'un module qui permet de créer des vocabulaires distincts. Chaque vocabulaire se compose d'un ensemble de termes qui peut ou non être hiérarchisé. Grâce à ce mécanisme il devient extrêmement simple d'associer un choix de termes de vocabulaire à un nouveau type de données. Dans le cas de l'intranet quatre vocabulaires sont utilisés : Vocabulaire Compétences Détails Contient l'ensemble des compétences utilisées par les utilisateurs, permet de proposer des compétences déjà renseignées lors de l'ajout de compétences par les utilisateurs. États de check-up Correspond à une valeur de 0 à 5, sert à noter un bilan hebdomadaire. Niveaux de compétences Contient les niveaux de compétences sur une échelle de 0/5 à 5/5. Projets Contient l'ensemble des projets de l'équipe ECDC ainsi que leur hiérarchie. 22 / 59
Ces différents termes de taxonomie serviront à créer des types plus facilement. En effet, il sera possible de proposer par exemple des listes à cocher de termes directement lors de la création d'un nouvel élément de ce type. De plus, les vocabulaires étant regroupés au sein d'une unique interface de gestion, il est très aisé de modifier les termes de chacun des vocabulaires. Illustration 5: Interface de gestion de taxonomie 5.5.2.Spécialisation de nœud Pour pouvoir réaliser les différents types qu'il est possible de créer dans l'intranet il faut spécialiser le nœud de base. Cela se fait simplement depuis l'interface d'administration de Drupal. Un nœud se compose de différents champs de différents types. Chaque nœud peut exposer l'ensemble de ses champs lors de l affichage ou n'en présenter qu'une partie. Cela permet de faciliter la création de types complexes tels que les «réalisations» effectuées par les utilisateurs. En effet, ce type sert à faire le lien entre un projet et un utilisateur en lui offrant la possibilité de détailler ses réalisations au sein d'un projet. L'utilisateur qui crée un nouveau nœud de type «réalisation» est automatiquement sauvegardé par Drupal en tant que créateur du nœud et sera donc associé à la «réalisation» créée, le champs «Body» servant de description de la réalisation. 23 / 59
Illustration 6: Interface de gestion des champs d'un nœud Les «réalisations» sont affichées à différents endroits du site : sur les pages projets ou sur les pages de profil des utilisateurs. En effet, en fonction de la page - projet ou utilisateur seules les «réalisations» concernées seront affichées. Par exemple, sur un profil utilisateur sera affiché l'ensemble des réalisations effectuées par l'utilisateur. À l'inverse les pages projets afficheront l'ensemble des utilisateurs ayant réalisé ce projet. Illustration 7: Vue des réalisations d'un utilisateur 24 / 59
5.5.3.Utilisation de modules complémentaires Drupal propose par défaut un ensemble de fonctionnalités qui ne répondent pas forcément à toutes les problématiques et il est dans ce cas possible d'utiliser des modules complémentaires proposés librement ou de les développer. Parmi les besoins de l'intranet, plusieurs ne pouvaient être réalisés à l'aide du simple cœur de Drupal. En effet, afin de pouvoir créer différents affichages du site, j'ai eu recours à un module spécifique. De plus, afin de faciliter la création de nouveaux projets à l'aide de termes de taxonomie j'ai été amené à développer un module simple. 5.5.4.Le module «Views»,création de pages dynamiques Le module «Views» est l'un des plus utilisés lors de la réalisation de projet à l'aide de Drupal. Il permet de créer différents types de pages ou de parties de pages qui puissent afficher des informations issues de nœuds. Il est par exemple possible de créer une liste contenant l'ensemble des utilisateurs du site ou également d'afficher l'ensemble des compétences sur son profil. Le module «Views» ouvre donc de grandes possibilités en termes d'affichage du contenu et a été utilisé dans de nombreuses parties de l'intranet telles que : Le trombinoscope : il affiche l'ensemble des utilisateurs inscrits sur le site avec, pour chacun d'eux, leur photographie, leur nom et leur équipe. Il est construit dynamiquement en fonction des utilisateurs inscrits au moment de la consultation de la page afin d éviter de devoir mettre à jour le trombinoscope à chaque inscription. Les membres qui participent à un projet : Cette vue découle du trombinoscope en se contentant de lui appliquer un filtre afin de ne sélectionner que les utilisateurs appartenant au projet. Les informations affichées sont quasiment identiques à celles du trombinoscope, seule la présentation change. De plus «Views» facilite l accès aux données affichées en proposant la mise en place des champs de recherche dynamique sur le contenu. Par exemple, il est possible d'afficher la liste des liens utiles contenant une certaine chaîne de caractères directement depuis la page affichant tous les liens utiles. 25 / 59
Illustration 8: Exemple de recherche dans la page de liens utiles 5.5.5.Le module «calendar», création de calendrier Pour réaliser un calendrier sous Drupal deux parties sont nécessaires : un affichage présentant le calendrier sous forme de mois, semaines ou jours ainsi qu'un type correspondant à un événement. Un événement se compose de deux dates et heures, le début et la fin de l événement, d'un titre, de la possibilité de préciser des détails sur l événement et d'un projet d'appartenance facultatif. La création de calendrier étant un usage relativement courant, il existe un module de Drupal fournissant exactement ces deux composantes indispensables. Drupal offre la possibilité aux modules d être dépendants les uns des autres et le module «Calendar» exploite cette possibilité en exploitant le module «Views» afin de fournir les vues citées précédemment. Une fois ces deux modules installés, un nouveau type est fourni : il s'agit du type «date» qui peut être spécialisé. Par défaut ce type ne comprend que les dates et les titres mais aucune description. Le type «événements» sera donc créé en lui ajoutant un champ de type texte correspondant à la description de l'événement ainsi qu'un champ de taxonomie issu du vocabulaire des projets. Avec le module «Calendar» une vue d'exemple est fournie, elle permet d'afficher l'ensemble des types «date». En créant une copie de cette page il devient alors très facile de spécialiser les différents calendriers de l'intranet. Un premier permet d'afficher l'ensemble 26 / 59
des événements de l'équipe ECDC directement à la racine du site. Tous les événements liés ou non à un projet y sont présentés. Le deuxième calendrier fonctionne en filtrant les événements pour un unique projet et est donc accessible depuis l'une des pages projet. Ce calendrier se présente sous la forme d'une unique vue pour tous les projets. Pour fonctionner la vue doit pouvoir déduire le projet concerné. Cela se fait en indiquant un paramètre à l'url de la page, ce mécanisme est prévu par «Views». Illustration 9: Réglage de l'url d'une vue, ici le calendrier des projets Le symbole «%» indique la présence d'un paramètre qui peut varier dans l'url*. Si l'url demandée par l'utilisateur répond à la définition alors «Views» déterminera la valeur du paramètre qui pourra être fournie à la page. Voici un exemple d'url possible pour accéder au calendrier d'un projet : Projet concerné URL du calendrier ebee Sign http://intranet-ecdc/drupal/projet/ebeesign/fullcalendar ebee Vote http://intranet-ecdc/drupal/projet/ebeevote/fullcalendar Afin de limiter les erreurs, il est possible de limiter les valeurs possibles pour un paramètre. Par exemple dans le cas du calendrier, le seul paramètre attendu doit forcément appartenir à un des termes du vocabulaire «projet» issu du module taxonomie. Cette règle peut être fournie au module «Views» directement depuis l'interface de configuration de la vue. 27 / 59
Illustration 10: Interface de configuration du paramètre que le calendrier reçoit depuis l'url On peut clairement voir sur la capture d'écran que l'on souhaite appliquer une règle de validation sur le fait d'appartenir à des termes de classification (taxonomie), que le vocabulaire concerné est le vocabulaire «projet». Les résultats seront filtrés en utilisant l'identifiant unique de chaque terme. Enfin, nous voyons la gestion d'erreurs : si le terme demandé dans l'url n'existe pas alors la page redirige sur l'erreur «page non trouvée». 28 / 59
Illustration 11: Vue du calendrier avec un événement de projet 5.5.6.Développement d'un module de redirection d'url Afin de bénéficier d'un outil simple à utiliser dans le temps, il était impératif de faciliter la création de nouveaux contenus et surtout de modifications plus importantes telles que l'arrivée d'un nouveau projet. Pour faciliter cela les projets ont été répertoriés grâce au module de taxonomie, le but étant de pouvoir créer l'ensemble des vues nécessaires seulement en rajoutant le terme. Le choix a donc été d'utiliser le module Views présenté précédemment et qui fournit l'avantage de gérer les termes de taxonomie comme des 29 / 59
arguments. La problématique a été de trouver un moyen de créer automatiquement les liens dans le menu à destination des pages associées au nouveau projet. Pour cela un module existe, il permet de créer un menu possédant l'ensemble des termes d'un vocabulaire et propose un lien vers le détail du terme. Malheureusement ce module ne permet pas de modifier l'url de redirection des termes. Pour palier ce problème j'ai donc créé un module très simple qui permet d'identifier si l'url demandée correspond à la description d'un terme du vocabulaire projet et à rediriger la page à destination de la page projet regroupant les différentes sections d'un projet. Cela offre l'avantage de bénéficier du nom du projet dans l'url et donc d'identifier depuis la page projet le projet concerné. Cette solution présente également l'avantage de s'adapter de façon dynamique à la création d'un nouveau projet. Cela évite donc la contrainte de mettre à jour le menu du site à chaque nouveau projet. La création de nouveaux modules pour Drupal est très simple. En effet, il suffit de créer au minimum deux fichiers : l'un sert à présenter le module dans la page d'administration des modules ainsi qu'à préciser les versions de Drupal compatibles, l'autre contient le code PHP* servant de base au module. Afin de faciliter l'intégration des modules complémentaires avec le cœur de Drupal, un système d'api* a été mis en place afin de fournir un ensemble de méthodes capables de faciliter le développement. Pour ce module j'ai utilisé un mécanisme nommé «hook» et qui permet de surcharger une méthode appelée par le cœur du système. Cela a été utile afin de détecter avant le chargement de la page quelle URL a été demandée. Ceci afin de changer la redirection avant le chargement. La documentation en ligne, pour développeurs, fournit tous les «hook» existants et la technique permettant de les surcharger. La méthode que j'ai utilisée pour ce module est la suivante : Cette méthode est appelée à chaque fois qu'une URL est demandée par un utilisateur. Elle permet au système de gérer les URL de façon plus intelligible pour les utilisateurs. Afin d'ajouter une fonctionnalité à cette méthode, il suffit de déclarer une méthode portant le 30 / 59
même nom précédé par le nom du module. Le module créé ici se nomme «rewrite_taxo_url», la méthode doit donc posséder le nom : «rewrite_taxo_url_url_outbound_alter». Cette méthode utilise une expression régulière pour trouver les pages issues des termes du vocabulaire projet dont l'url doit être modifiée. Illustration 12: Méthode appelée dans le but de modifier l'url des pages projet. 5.6DÉPLOIEMENT ET ÉVOLUTIONS FUTURES Une fois l'ensemble des pages et des types nécessaires créé, le site devait être mis en production afin de le soumettre aux utilisateurs. Lors des phases de préparation et de développement, l'ensemble du travail avait été réalisé sur un serveur virtuel en local sur mon poste de travail. L'intranet devait donc être déplacé sur le serveur de production sur lequel il serait hébergé. Grâce à une procédure de sauvegarde et de restauration directement intégrée à Drupal, il m'a été très simple de migrer le système développé sur le serveur de production. En effet, Drupal permet de récupérer une archive de toutes les données créées en base sous forme de script SQL*. Quant aux modules, ils peuvent être directement sauvegardés dans une archive puis copiés sur le serveur. Depuis la mise en place, certains retours sont apparus de la part des utilisateurs comme l'absence de notifications lors de création de contenu. L'intranet étant construit sur une base modulaire, il est très simple d implémenter de nouvelles fonctionnalités. Pour répondre à la 31 / 59
problématiques des notifications la première solution mise en place a été de proposer de s'abonner à différents flux RSS* directement depuis le site, l'avantage étant de ne pas surcharger les boîtes de réception e-mail en utilisant un autre logiciel de notifications dédié à la consultation de flux RSS. Mais l'on pourrait imaginer d'autres fonctionnalités de notifications de nouveaux contenus très variés, telles qu'un bilan journalier de l'activité sur le site envoyé par e-mail, ou bien une intégration avec le logiciel de messagerie interne afin d'augmenter la réactivité sur l'intranet. 32 / 59
6. PORTAGE DE L'INTERFACE GRAPHIQUE DE L'APPLICATION EBEESIGN À la fin de mon stage j'ai pris part à un deuxième projet qui vient s'inscrire au sein d'une des équipes du pôle EC-DC : l équipe ebeesign, en charge de développer un système de signature électronique. 6.1PRÉSENTATION DU PROJET Ce projet a pour objectif de fournir un outil en ligne de signature électronique de documents se composant d'un back-office dédié aux employés d'une société, par exemple une banque ainsi que d'un front-office accessible pour signer les documents par les clients de cette société. L'objectif étant de faciliter la contractualisation de vente de la part du client en proposant à ses clients un outil en ligne simple et sécurisé permettant la signature de documents ayant la même valeur juridique qu'une signature classique. Ce projet est réalisé grâce aux langages Java* et JSP*, le tout fonctionnant grâce à un serveur d'application WebSphère*. L'application utilise également le framework Java Spring*. Ce projet a déjà été développé pour un client d'almerys et est déjà fonctionnel. Il doit maintenant être rendu générique afin d'industrialiser sa production pour de nouveaux clients. L'une des tâches nécessaire à la généricité du projet était de procéder à une refonte graphique de l'application en intégrant le nouveau design développé par les designers d'almerys. Il fallait également porter le framework javascript* utilisé (Yahoo UI*) vers un autre framework (Jquery*). 33 / 59
6.2FONCTIONNEMENT L'application est répartie entre deux interfaces, la première est accessible seulement par les salariés de l'entreprise et permet de fournir les informations client ainsi que les documents à proposer à la signature. La deuxième interface est quant à elle dédiée aux clients qui souhaitent accéder aux documents et les signer. Diagramme 1: Cas nominal de signature d'un document 34 / 59
6.3LES OBJECTIFS Ce projet de refonte était porté par l'un des développeurs web d'almerys qui devait être appuyé d'un stagiaire dans cette tâche. Malheureusement leurs périodes de congés se chevauchant, il leur était compliqué de réaliser un suivi de leurs activités. Mon rôle a été de réaliser le transfert de compétences nécessaires entre ces deux personnes. De plus je devais prendre part au portage jusqu'à la fin de mon stage (quatre dernières semaines). 6.4TRANSFERT DE COMPÉTENCES Dans un premier temps j'ai donc eu à découvrir le cadre du portage ainsi que l'existant. Pour cela ma première semaine fut consacrée à me documenter sur l'application de signature développée ainsi que sur les différents changements à effectuer. En parallèle de cela je devais aussi me mettre d'accord sur la procédure à suivre durant la période où le porteur du projet serait absent. Nous avons donc déterminé ensemble différentes règles de bonne conduite permettant d'obtenir un outil web plus respectueux des standards. De plus, il était important de réaliser la solution la plus optimisée possible afin de ne pas alourdir l'existant. Pour cela, les différentes règles suivantes devaient être mises en place : Chargement des gros fichiers javascript en fin de transfert (commencer par envoyer au client les données visibles du site (HTML, images) avant l'envoi du code javascript afin d accélérer le rendu) ; Utilisation de fonctions javascript anonymes dans toutes les situations où cela est possible (l'objectif étant de rendre ces méthodes inaccessibles depuis les autres méthodes) ; Respect des contraintes de validation du W3C tant au niveau du HTML, du CSS que du javascript ; Rendre l'application identique sous Firefox, Chrome et Internet Explorer 8 et supérieur. 35 / 59
Dans un second temps j'ai dû transmettre ces différents objectifs et règles au stagiaire qui travaillait avec moi sur le projet. Cette phase s'est déroulée sans problèmes, ce qui nous a permis de commencer rapidement les différentes tâches à réaliser. 6.5MISE EN PLACE DU NOUVEAU DESIGN La première étape de ce portage a été de mettre en place le nouveau design de l'application développé par le designer. Pour cela nous disposions d'une maquette de ce projet réalisée de façon statique. L'objectif était donc de conserver cette présentation visuelle tout en garantissant un fonctionnement total de la partie métier sous-jacente. Le nouveau design se compose d'un fichier CSS* servant à décrire l'ensemble des informations de rendu du site. Pour que ce fichier CSS puisse s appliquer au site web il faut rajouter les différentes classes CSS définies par le designer au niveau du code de l'application ainsi que respecter l'architecture définie par la charte graphique telle que l'ordre des sections du site. Illustration 13: Ancien visuel de suivi des ventes 36 / 59
Illustration 14: Nouveau visuel de suivi des ventes 6.6PORTAGE DU JAVASCRIPT Utilisation de plug-in Jquery : Datatable et datepicker Pour fonctionner, l'application web comporte un ensemble de codes réalisés en Javascript. Ces codes ont été réalisés à l'aide du framework Yahoo UI (YUI). L'objectif de la refonte comprenait également de porter ces codes vers un autre framework Javascript plus performant : Jquery. En effet, Jquery est un framework plus léger que YUI tout en fournissant les mêmes possibilités techniques. Au sein de l'application, le javascript est utilisé pour différents objectifs, à savoir : 37 / 59
Fournir une interface dynamique (possibilité de minimiser certains blocs, menu toujours présent sur le haut de la page, utilisation de modal en cas d'attente etc.) ; Fournir un moyen de sélection de date plus élégant (affichage d'un calendrier de saisie lors d'un clic dans un champ de type date) ; Permettre à certaines données d être chargées de façon asynchrone (tableau dont les données sont chargées en AJAX*). Jquery se présente comme un unique fichier fournissant l'ensemble des méthodes utilisables à l'aide du framework. Dans le but d étendre ses capacités, il est possible de lui adjoindre un ou des modules afin de répondre à des problématiques plus précises. Dans le cas de l'application de signature, deux modules supplémentaires ont été utilisés. 6.6.1.Utilisation du module DatePicker pour Jquery Le module Jquery DatePicker fournit un moyen simple et efficace de remplir un champ de type date. En effet ce module permet d'afficher un petit calendrier et de récupérer la valeur que l'utilisateur sélectionne. Illustration 15: DatePicker Le module datepicker définit déjà un ensemble de règles permettant la sélection d'une date. Pour le mettre en place il suffit d'indiquer les champs qui permettront son affichage de la manière suivante : 38 / 59
Illustration 16: Exemple d'utilisation de DatePicker sans option Dans l application de signature l'utilisation n'était pas aussi simple puisqu'un certain nombre d'options doivent être définies en plus telles que des informations de validation, d'initialisation ou d'internationalisation. Illustration 17: Définition du DatePicker utilisé au sein de l'application 6.6.2.Utilisation du module DataTable pour Jquery Au sein de l'application de signature, différents tableaux doivent être capables de se mettre à jour de façon asynchrone. Pour cela le mécanisme utilisé est l'ajax. Afin de faciliter l'utilisation de cet ensemble de technologies, il existe un module Jquery spécifique. Ce module se nomme DataTable et permet de créer facilement des tableaux asynchrones. Tout comme le module DatePicker son utilisation peut aller du très basique jusqu'à un niveau de complexité élevé grâce à la présence d'options facultatives. 39 / 59
Le code suivant correspond à la définition du tableau présent dans la page de suivi des ventes. Illustration 18: Code du DataTable de suivi des ventes de l'application Ce code permet d'obtenir le résultat suivant : 40 / 59
Illustration 19: Tableau de suivi des ventes Ce tableau contient l'ensemble des transactions passées ainsi que leurs statuts actuels. Il fournit l'avantage de pouvoir être rechargé de façon dynamique et donc de faciliter par exemple le tri d'une colonne par un simple clic sur son entête. 6.7MISE EN PLACE DE NOUVELLES SPÉCIFICATIONS MÉTIER Afin de répondre aux demandes de nouveaux clients, certains aspects métiers étaient à revoir. En effet, dans l'existant, certaines informations n'étaient pas traitées telles que le numéro de sécurité sociale ainsi que la possibilité de saisir un RIB (Relevé d'identité Bancaire) pour les clients. Ces deux informations ont dû être ajoutées à la vue présentée sur le back office lors de la création, la modification ou la consultation d'une vente. 41 / 59
Illustration 20: Zone d'informations client du nouveau visuel Ces informations (numéro de sécurité sociale et RIB) répondent à des règles strictes de validité. En effet, le RIB ainsi que le numéro de sécurité social possèdent tous les deux une clé. Cette clé correspond aux deux derniers chiffres de chaque numéro et sert à vérifier la validité des précédents. Il devient donc nécessaire de recalculer ces clés à l'aide de l'algorithme prévu à cet effet et de les comparer à celle renseignée afin d éviter toute erreur de recopie ou tentative de fraude. En cas d'erreur, la création de la vente est impossible et les champs invalides sont indiqués à l'utilisateur. 42 / 59
6.7.1.Algorithme de validation de RIB Afin de pouvoir valider un numéro de RIB voici la procédure à suivre : Dans un premier temps le numéro de RIB doit être converti en chiffres au cas où des lettres seraient présentes grâce au tableau suivant : Illustration 21: Correspondance des lettres en chiffres pour le calcul de la clé RIB Une fois toutes les lettres remplacées, il devient possible d appliquer le calcul mathématique permettant l'obtention de la clé. Un numéro de RIB se présente de la manière suivante : Illustration 22: Répartition des différents champs d'un RIB R correspond au numéro de RIB B correspond au code Banque G correspond au code Guichet C correspond au numéro de Compte client K correspond à la clé 43 / 59
Le calcule s'effectue de la manière suivante : Illustration 23: Valeur de la clé RIB en fonction du numéro L opérateur mathématique «mod» correspond au reste de la division entière et se nomme modulo. Une fois la clé calculée à partir des informations saisies par l'utilisateur, il devient très simple de comparer la clé calculée à celle fournie par l utilisateur. En cas de différence l'utilisateur est alors averti de l'erreur de saisie. Par contre cette méthode ne garantit en rien que le numéro saisi existe : en effet, il est possible de calculer une clé valide pour un numéro n appartenant à personne. On voit donc ici la limite de cette technique qui ne sert principalement qu'à éviter toute erreur de saisie. 44 / 59
7. CONCLUSION Ces seize semaines passées en entreprise ont été riches d'expérience et d'apprentissage. J'ai pu découvrir une entreprise privée travaillant dans le domaine de l'informatique. Cela m'a permis de prendre conscience des attentes fortes en termes d'analyse de projet et de la rigueur nécessaire au développement d'applications fortement orientées sécurité. J'ai eu la chance d'aborder ce stage à travers deux missions fondamentalement différentes. Cela m'a permis de découvrir des méthodes de travail variées. Durant la réalisation de l'intranet j'ai eu à mener l'ensemble du projet depuis l'analyse jusqu'au développement de l'application en autonomie. J'ai donc eu la chance de pouvoir mettre en œuvre les différentes parties que compte un cycle de développement logiciel dans son ensemble. Pour cela, il m'a été nécessaire de rencontrer un grand nombre d'interlocuteurs techniques et de m'adapter à leurs besoins. Responsable des choix techniques de réalisation, j'ai eu l'opportunité de mettre en avant mes capacités de décision. Ce projet a été pour moi un défi important car il s agissait de ma première application web réalisée dans un cadre professionnel. En effet, mes seules expériences dans ce domaine se limitaient jusqu'à présent à la réalisation de petits projets lors de ma formation. Cette expérience très enrichissante m'a ouvert aux problématiques de la communication interne en entreprise et aux moyens que l'on peut mettre en place pour y répondre. L'intranet étant un projet à vocation évolutive, le projet ne peut pas être déclaré terminé. Effectivement, durant les dernières semaines de mon stage, de nouvelles fonctionnalités ont été demandées par différents chefs de projet. Ayant mis en œuvre un outil modulaire, ces différents ajouts sont simples à réaliser et pourront être mis en place dans l'avenir de façon simple. J'ai également eu la chance de pouvoir intégrer un projet dont le cycle de vie était déjà entamé. En effet, il est très courant qu'un développeur ait à rejoindre une équipe déjà existante dans le but de participer à un projet en cours de développement. Cette expérience nouvelle pour moi m'a permis de mettre en avant mes capacités d'adaptation. En effet, afin 45 / 59
de prendre part au projet dans les meilleures conditions possibles j'ai eu à comprendre les tenants et aboutissants de la mission qui m était confiée au sein de ce projet. Il m'a également été nécessaire d effectuer un travail de formation sur les technologies nouvelles pour moi, tout en gardant à l'esprit le cadre de leur utilisation. Durant ce projet, j'ai également découvert les méthodes de travail en équipe nécessaires au bon déroulement d'un projet d'une aussi grande ampleur. Cela m'a permis de prendre conscience de l'importance de l'organisation nécessaire au développement d'applications en entreprise. À la fin de mon stage, le portage n était pas totalement terminé et certaines tâches restaient encore à réaliser par les autres membres de l'équipe. Ce stage a donc été pour moi riche en découvertes et en expériences nouvelles en m'offrant la chance de découvrir les différentes problématiques auxquelles un développeur est soumis au quotidien dans une entreprise privée. 46 / 59
8. RÉSUMÉ EN ANGLAIS During this year of license at l'iut informatique de Clermont Ferrand, I have completed an internship in the company called Almerys. This was my first practical experience into a private company with a high number of employees. I had the chance to approach this course through two fundamentally different missions. This allowed me to explore various ways of working. The fist part of my course was to create an intranet tool for my team in order to increase the way that the team communicate internally. This project was developed in a total autonomy and I had to decide of all aspects of the application. I choose to use the Drupal CMS in order to build this tool. This was for me a new experience because it was my first web application built alone. This project made me work on all the aspects of an application life cycle and was really rewarding. The second part of my course was to integrate an already begin project that is created by a team. In order to participate in the project in the best conditions I had to understand the ins and outs of the mission entrusted to me in this project. He also was required to perform work training on new technologies for me, bearing in mind the context of their use. During this project I have also discovered methods of teamwork needed to conduct a project of such great magnitude. This project was about porting an old application graphical interface to a new interface. It also needs to port the javascript framework to a new one. This internal ship has given me new experiences by offering me the chance to discover the various issues that a developer is subjected on a daily basis in a private company. 47 / 59
9. LEXIQUE AJAX : (Asynchronous Javascript and XML) : Permet de fournir des interfaces web ne nécessitant pas de rechargement de la page pour modifier le contenu du site web. API : Application Programming Interface : Interface fournie par un programme et qui permet de s'interfacer avec celui-ci. Se présente généralement comme un ensemble d'objets et de méthodes permettant d'utiliser l'application depuis un module ou une application externe. CMS : Content Management System (Système de gestion de contenu) : Logiciel web fournissant une base pour la réalisation de site web avec en général une partie d'administration. CSS : Cascading style sheet (feuilles de styles en cascade) : Permet de définir l'ensemble du design d'un site web au sein d'un ou plusieurs fichier(s). Fournit l'avantage de séparer le contenu du rendu visuel à lui appliquer. Flux RSS : Rich Site Summary (Résumé de site riche) : Fichier XML contenant les nouveaux contenus publiés sur le site de façon globale ou thématique. Permet d'utiliser un logiciel pour surveiller l apparition de nouveaux contenus sur le site. Java : Langage de programmation orienté objet fonctionnant grâce à une machine virtuelle. JavaScript : Langage de script utilisé pour les applications web. Permet l'exécution de code directement sur la machine du visiteur. Notamment utilisé pour réaliser des interfaces dynamiques, des contrôles ainsi que des transferts de données asynchrones par exemple dans le cas de l'ajax. 48 / 59
Jquery : Framework javascript. Fournit un ensemble de méthodes et d'objets permettant de développer en javascript plus facilement. Ce framework est développé par John Resig depuis 2006. JSP : Le JavaServer Pages ou JSP est une technique basée sur Java qui permet aux développeurs de générer dynamiquement du code HTML, XML ou tout autre type de page web. «Just In Mind» : Logiciel de prototypage. Permet de facilement créer des interfaces de présentation ayant l'avantage de pouvoir répondre à des comportements tels que des clics, des conditions (page seulement accessible connectée etc.). Cela dans le but de fournir une prévisualisation de l'outil et des différents cheminements possibles à l intérieur de celui-ci. PHP : Langage de script utilisé très massivement pour développer des sites internet. Il s'agit d'un langage peu typé et orienté objet. Script SQL : Fichier contenant un ensemble de commandes SQL servant à effectuer des actions sur une base de données. Peut être utilisé pour sauvegarder puis restaurer une base de données. Spring : Framework libre pour construire et définir l'infrastructure d'une application java. URL : Uniform Resource Locator (localisateur uniforme de ressources) correspond à l'adresse d'une ressource réseau soit sur internet soit sur un réseau interne. Par exemple : www.google.com est une URL. WebSphère : Serveur d'application web Java développé par IBM. Yahoo UI : Framework javascript. Fournit un ensemble de méthodes et d'objets permettant de développer en javascript plus facilement. Ce Framework est réalisé par la société Yahoo depuis 2005. 49 / 59
10. BIBLIOGRAPHIE 10.1 DRUPAL http://drupal.org/ Documentation officielle de Drupal. http://drupalfr.org/ Communauté française de Drupal. http://drupal.org/project/views La documentation du projet Views. http://drupal.org/developing/modules Le guide de développement de module Drupal. 10.2 JAVASCRIPT ET JQUERY http://jquery.com/ : Documentation officielle de Jquery. http://www.eyecon.ro/datepicker/ : Documentation du module Jquery Date picker. http://www.datatables.net/ : Documentation du module Jquery Datatable. 50 / 59
11. TABLE DES ANNEXES Annexe 1: Comparatif des CMS issu du site cmsmatrix.org...52 Annexe 2: Maquette de l'intranet - accueil non connecté...53 Annexe 3: Maquette de l'intranet - accueil connecté...54 Annexe 4: Maquette de l'intranet - page projet non connectée...55 Annexe 5: Maquette de l'intranet - page projet connectée...56 Annexe 6: Maquette de l'intranet - page trombinoscope...57 Annexe 7: Maquette de l'intranet - fiche utilisateur...58 51 / 59
12. ANNEXES Annexe 1: Comparatif des CMS issu du site cmsmatrix.org 52 / 59
Annexe 2: Maquette de l'intranet - accueil non connecté 53 / 59
Annexe 3: Maquette de l'intranet - accueil connecté 54 / 59
Annexe 4: Maquette de l'intranet - page projet non connectée 55 / 59
Annexe 5: Maquette de l'intranet - page projet connectée 56 / 59
Annexe 6: Maquette de l'intranet - page trombinoscope 57 / 59
Annexe 7: Maquette de l'intranet - fiche utilisateur 58 / 59
RÉSUMÉ Mots clés : Intranet Drupal CMS JSP - Javascipt Jquery Dans un premier temps j'ai travaillé à la réalisation d'un intranet d'équipe à l'aide d'un CMS libre : Drupal. Sont donc présentés les besoins collectés auprès des utilisateurs, les principes de base de Drupal ainsi que différentes réalisations spécifiques aux besoins de l'intranet par le biais de modules libres ou bien de modules développés directement pour ce projet. Dans un deuxième temps, j'ai traité de ma seconde mission intégrée en fin de stage : la mise en place d'un nouveau design pour une application de signature en ligne. Les différents changements impactés par le changement de framework javascrpit au profit de Jquery sont également présentés. 59 / 59