Transcript
Page 1: romaingerard.files.wordpress.com · Created Date: 6/15/2010 9:21:58 PM

Rapport de stage Romain Gérard 3TID1Année 2009-2010

Coordonnées de l'entrepriseNom de l’entreprise: Belighted SPRLAdresse: Voie Cardijn, 13 1348 Louvain-la-NeuveActivité(s) de l’entreprise: Développement d’application webURL: http://belighted.comMaître de stage: Nicolas JacobeusProfesseur référent: Emeric Florence

Description de l’entrepriseBelighted est une petite entreprise composée de quatre personnes spécialisées dans le développement d’applications web en Ruby on Rails destinées aux start-up et aux en-treprises. L’entreprise travaille dans un environnement MacOS X pour faciliter le dével-oppement en Ruby on Rails. Elle utilise des méthodes et des outils pour développer chaque application de manière flexible et sur-mesure. Ceci dans une ambiance jeune, sympathique et dynamique.

Description de l’organisation du travail et de l’équipeDans l’entreprise, un des employés est formé aux techniques « Scrum » et entraine la société à utiliser ces outils. Ce sont des techniques de développement agiles. En résu-mant très fort, l’équipe de développement est capable avec ces techniques de répondre à des requêtes de la part du client très vite à tout moment du développement. Le client est toujours au courant du travail effectué par le développeur et à la possibilité de tester l’application après chaque phase de développement et ainsi introduire des requêtes en rapport avec sa vision du fonctionnement du programme web.Pour chaque nouveau projet, le temps de travail est planifié en accord avec le ou les développeur(s) désigné(s) pour y travailler. Ceci ce fait par estimation du temps néces-saire à chaque partie de l’application décrite dans les « user stories ». Ces éléments proviennent d’un découpage des fonctionnalités du site en se basant sur l’aventure d’un utilisateur à travers le site. Ensuite les développeurs réalisent chaque « user story » organisée par ordre de priorité au fil du développement. Des contacts réguliers avec le client assurent le bon développement et permet d’amener directement les corrections nécessaires pour se rapprocher un maximum des souhaits de celui-ci. La plupart du temps, ces contacts se passent entre le chef du projet et le client, pour limiter le nombre d’intervenant et simplifier la communication. Au besoin, les développeurs entrent en con-

Haute Ecole Albert Jacquard | Infographie

Page 2: romaingerard.files.wordpress.com · Created Date: 6/15/2010 9:21:58 PM

Haute Ecole Albert Jacquard | Infographie

Rapport de stage rédigé par Romain Gérard 3TID1 - Année 2009/2010

tact avec le client pour des requêtes spécifiques.Une fois le design d’une application terminé et découpé, les développeurs l’intègrent dans l’application avant le lancement en test.L’application est ensuite testée par le client et les développeurs. Chaque bug à corriger ou aménagement à effectuer est pris en charge par un développeur pour amener à la mise en production de l’application finale.Pour tout projet, un cadre de développement est fixé, mais la plupart des solutions à met-tre en place sont sous la responsabilité des développeurs.

Résumé des différentes tâches et des responsa-bilités assuméesPendant le stage, j’ai eu l’occasion de parcourir le métier en ayant plusieurs tâches très différentes à effectuer. Cela m’a permis de me placer en temps que développeur, design-er, intégrateur ou encore en relation client. De plus, j’ai pu travailler sur un certain nom-bre de projets différents pour être confrontés à toutes sortes de demandes et de clients.

Liste des tâches et responsabilités1. Réalisation d’un template pour l’interface d’administration utilisée pour chaque projet de l’entreprise. Ce projet m’a permis de maitriser HTML5, CSS3, jQuery en me basant sur un layout réalisé par Benjamin De Cock.2. Intégration du template d’administration dans les projets en cours.3. Développement du site Belighted v2 accessible à cette adresse: http://belighted.com.4. Design d’éléments respectant le layout initial pour les fonctionnalités développées dans le cadre du projet Belighted v2.5. Design de l’application de time tracking nommée « 88mph ». Ce projet est un open source et accessible sur GitHub à l’adresse: http://github.com/belighted/88mph.6. Développement de l’application de time tracking en équipe chaque vendredi.7. Réunion avec un client pour l’amélioration de l’expérience utilisateur et le design du site « Zeneo Solidaris ». Ce site est désormais fonctionnel et accessible à cette adresse: http://www.zeneo-solidaris.be.8. Prise en charges des requêtes du client « Zeneo Solidaris » lors de la phase de test du site.

Page 3: romaingerard.files.wordpress.com · Created Date: 6/15/2010 9:21:58 PM

Haute Ecole Albert Jacquard | Infographie

Rapport de stage rédigé par Romain Gérard 3TID1 - Année 2009/2010

Rapport circonstancié et chronologique repre-nant les différents rapports périodiques

Semaine 01 du 18/01/2010 au 22/01/2010

Beadmin

Intégration complète des écrans réalisés en xHTML et CSS pour le template d’administration « Beadmin ».Généralisation de l’interface pour en faire un template facilement modifiable en fonction du projet.Expérimentation et approche du CSS 3 et HTML 5 pour la tâche de conversion.Conversion de la structure des pages xHTML vers HTML 5.

Divers

J’ai eu l’occasion d’assister à une réunion sur un projet en cours entre les différents col-laborateurs pour faire le point sur la situation. Ainsi, j’ai pu me rendre compte du fonc-tionnement d’une équipe professionnelle pour gérer le planning, les attentes du client et la gestion de ces attentes et contraintes en interne pour améliorer le cadre de travail et la productivité.

Semaine 02 du 25/01/2010 au 29/01/2010

Beadmin

Fin de la conversion en HTML 5 et CSS 3 de l’interface d’administration pour les projets internes.Ajout du comportement de certains éléments avec jQuery.

Belighted v2

Premier pas avec Ruby on Rails dans la pratique sur le futur site de l’entreprise Belighted en lien avec GitHub.Travail en pair programming pour réaliser le blog du site Belighted v2.

88mph

Lancement d’un projet interne de time tracking. Celui-ci sera une application Rails pour définir en temps le travail de chacun sur les différents projets. Elle sera réalisée sur plu-sieurs semaines par l’ensemble des membres de l’entreprise lors de session dédiées le vendredi après midi.

Divers

Prise en main du système GitHub pour héberger les fichiers d’un projet et travailler en collaboration avec d’autres personnes.

Page 4: romaingerard.files.wordpress.com · Created Date: 6/15/2010 9:21:58 PM

Haute Ecole Albert Jacquard | Infographie

Rapport de stage rédigé par Romain Gérard 3TID1 - Année 2009/2010

Semaine 03 du 01/02/2010 au 05/02/2010

Belighted v2

Suite de l’intégration des fonctionnalités du site « Belighted v2 ».Correction de différents éléments dans les vues.

Zeneo Solidaris

Réunion avec le designer à propos du projet « Zeneo Solidaris » en vue d’améliorer la compatibilité web du design produit.Intégration des 5 premières pages du site « Zeneo Solidaris », sans les changements qui y seront apportés à la suite de la réunion.Utilisation plus approfondie de GitHub pour le projet « Zeneo Solidaris ».

88mph

Configuration de l’application de time tracking en Rails 3.0.0 et installation de Postgresql. Test des différents plugins rails nécessaires à l’application. (compatibilité rails 3.0.0)

Semaine 04 du 08/02/2010 au 12/02/2010

Zeneo Solidaris

Fin de l’intégration du design « Zeneo Solidaris » en xHTML et CSS.Redesign de certains éléments suite à quelques soucis avec le designer. (différences de conception entre le Print design et Web design)Amélioration de l’ergonomie générale des pages pour une meilleure expérience utilisa-teur.Modification des vues pour intégrer le « slicing » aux fonctionnalités déjà en place dans l’application.

Semaine 05 du 15/02/2010 au 19/02/2010

Zeneo Solidaris

Correction à réaliser sur certaines pages pour le projet « Zeneo Solidaris » au niveau du comportement des éléments en CSS.Ajout de nouvelles fonctionnalités tel qu’un fil d’ariane.Mise en place des hacks JavaScript et CSS pour IE 7-8 dans l’application.Test de l’application et corrections dans les vues pour une meilleure compatibilité entre navigateur.

Belighted v2

Suite et fin de la réalisation en rails du blog pour le site « Belighted v2 » (Ajout/édition/suppression de posts et ajout/suppression de commentaires)Réalisation en rails du formulaire du contact avec envoi d’un mail et ajout dans la base de

Page 5: romaingerard.files.wordpress.com · Created Date: 6/15/2010 9:21:58 PM

Haute Ecole Albert Jacquard | Infographie

Rapport de stage rédigé par Romain Gérard 3TID1 - Année 2009/2010

données.Création d’un système de catégories pour les posts du blog.Ajout d’un plugin pour la gestion des tags des posts du blog.Modification des vues pour intégrer les nouveaux éléments.

88mph

Installation de Ruby on Rails 3.0.0 (beta) et des différents plugins pour le projet de time tracking.Installation propre de Postgresql sur Mac OS X.

Semaine 06 du 22/02/2010 au 26/02/2010

Belighted v2

Installation du plugin reCaptcha pour éviter que des bots rédigent des commentaires sur le blog du site « Belighted v2 ».Ajout d’un système de recherche dans le texte pour le blog (recherche sur titre et con-tenu).Ajout d’un flux RSS pour les posts du blog.Aménager un système pratique pour mettre les balises dans le contenu du blog (type parser mais simplifié).Mini galerie pour la page de présentation des réalisations de l’entreprise.Correction des divers liens dans le site.Test des fonctionnalités du site.Redesign d’éléments pour coller au layout initial.

Divers

Modification du logo Belighted pour l’appliquer sur des t-shirts et vestes.

Semaine 07 du 01/03/2010 au 05/03/2010

Belighted v2

Ajout des titres en fonction de la page en cours (simple utilisation de variable) pour le site “ Belighted v2 ”.

Beadmin

Intégration de l’interface d’administration dans un projet nommé “Pas de quartier”.Design d’éléments tels que des tableaux, des formulaires et des listes en respect avec le design initial.Validation HTML 5 et CSS3.Discussion sur la création d’un plugin d’administration pour chaque projet Belighted.Début de l’intégration de l’interface d’admin sur un autre projet appelé « Fanitude ».Pas de quartier

Page 6: romaingerard.files.wordpress.com · Created Date: 6/15/2010 9:21:58 PM

Haute Ecole Albert Jacquard | Infographie

Rapport de stage rédigé par Romain Gérard 3TID1 - Année 2009/2010

Redéfinition des classes d’un plugin pour en améliorer l’affichage au sein du projet.

88mph

Création d’un fragment du projet 88mph (application de time-tracking) qui permet de créer, éditer et visualiser les projets sur lesquels une entreprise travaille.Semaine 08 du 08/03/2010 au 12/03/2010

Beadmin

Suite de l’intégration des différents éléments de l’interface d’administration dans le projet « Fanitude ».Création d’un logo pour l’administration « Beadmin »Ajout de nouveaux éléments requis dans l’administration pour les projets « Fanitude » et « Pas de quartier ».Design de l’élément dashboard.

88mph

Première version du design pour l’application interne de time tracking.Ajout de liens pour permettre le test de l’application de time tracking.Suite du design après réunion autour du projet.

Zeneo Solidaris

Corrections de l’application « Zeneo Solidaris » suite à quelques requêtes de la part du client.

Divers

Réalisation d’une courte video de 10 secondes dans la cadre de la sponsorisation d’un évènement pas Belighted.

Semaine 09 du 15/03/2010 au 19/03/2010

Zeneo Solidaris

Cacher champ description.Ajouter Allemand aux langues dans les langues parlées par le partenaire.Afficher les dates uniquement si offre temporaire (proposer radio buttons).Afficher prix avant remise sur la fiche partenaire.Dans la prestataire, afficher l’onglet photos par défaut et un première position.Faute de frappe dans recherche zone admin (Cecher).Ajouter check_box “featured” dans recherche zone admin et permettre une recherche en fonction de ce paramètre.Afficher la première catégorie par défaut.Transformer le bouton ‘Nouvelle catégorie’ en lien ‘Autre domaine’ (en-dessous du pre-mier choix).

Page 7: romaingerard.files.wordpress.com · Created Date: 6/15/2010 9:21:58 PM

Haute Ecole Albert Jacquard | Infographie

Rapport de stage rédigé par Romain Gérard 3TID1 - Année 2009/2010

Correction des requêtes SQL pour améliorer le fonctionnement de la recherche d’élément featured.Mise en place du contenu des pages “contact” et “conditions d’utilisation”.Résolution d’un bug qui empêchait d’afficher le menu d’un partenaire si un prix (option-nel) n’était pas fixé.Ajout d’un lien de retour sur la fiche d’un avantage pour permettre une navigation plus aisée à travers les recherches.Réunion avec le client “Zeneo Solidaris”. J’ai pu faire une réunion seul avec un client afin de parcourir le site actuel et dégager des pistes pour améliorer l’expérience utilisateur.Réunion avec le responsable du projet pour lui faire un compte rendu de ma réunion avec le client et valider les modifications à réaliser dans le projet.

88mph

Suite du design de l’application de time tracking.Amélioration du système de création de projet.

Semaine 10 du 22/03/2010 au 26/03/2010

Zeneo Solidaris

Pagination des éléments dans la zone d’administration pour une navigation plus aisée.Modification de l’emplacement des éléments du site pour améliorer la navigation.Changements des couleurs du site en fonction de la catégorie de l’avantage en cours d’affichage.Modification des informations présentes dans chaque pavé d’avantages en fonction du type de navigation (recherche, catégorie, featured, homepage, …)Intégration des nouvelles pages contact et conditions.Ajout d’un lien vers le catalogue format PDF.Améliorations générales du design pour une meilleure lisibilité.Mise en staging de la nouvelle version du site « Zeneo Solidaris » afin que le client pui-sse la tester.

88mph

Suite de l’intégration du design en html5 et css3.Ajout de comportement en jQuery pour les checkboxes et les boutons de type radio. Session de pair programming sur 88mph pour réaliser le calcul du temps passer sur un projet par un utilisateur dans une fenêtre de temps donnée.Semaine 11 du 29/03/2010 au 02/04/2010

Zeneo Solidaris

Traitement de diverses requêtes mineures pour améliorer la lisibilité de certains éléments du site « Zeneo Solidaris ».Mise en production des derniers changements et lancement du site.

Page 8: romaingerard.files.wordpress.com · Created Date: 6/15/2010 9:21:58 PM

Haute Ecole Albert Jacquard | Infographie

Rapport de stage rédigé par Romain Gérard 3TID1 - Année 2009/2010

Réflexion avec le client sur des améliorations futures du projet.

88mph

Intégration du design dans toutes les fonctionnalités mise en place.Amélioration du script pour le comportement des éléments de formulaire.Corrections de différents problèmes dans les vues du site avec les nouvelles fonctionnal-ités de fenêtre de temps.

Divers

Entrevue avec mon maitre de stage pour discuter du déroulement stage, connaitre mes impressions, mes motivations, et mes opportunités futures.

Problèmes rencontrés durant le stage et solutions apportéesAvant le stage pour pallier au problème de la non-connaissance du langage que j’allais devoir utiliser tout au long de la période, j’ai commandé plusieurs livres pour apprendre les bases du Ruby on Rails en suivant les conseils de mon maitre de stage.Très vite j’ai perçu le besoin d’avoir sous la main un agenda précis pour répartir correcte-ment mon travail sur la semaine et ainsi éviter tout débordement du temps de travail sur mes soirées et week-end. Un simple agenda Google avec une liste des tâches m’ont permis de structurer mes activités.

Avis personnel sur l’expérience de stage

Aspect socialLors de ma recherche de stage, et principalement lors des entrevues, j’ai beaucoup insisté sur la dimension sociale du stage. Je voulais faire partie d’une équipe et travailler avec eux plus que sur de petits projets isolés. Chez Belighted, dès le départ, j’ai été in-tégré aux équipes de développeurs pour réaliser et intégrer le design de la partie admin-istration pour les nouveaux projets, ceci en vue de la création d’un plugin d’administration pour chacun des projets de l’entreprise.Les membres des différentes équipes me permettait d’assister à leurs réunions, de pren-dre part à la conversation et d’échanger mes idées et mes points de vue. De cette façon, je me sentais parfaitement intégrer à l’entreprise, presque comme si je travaillais des ces bureaux depuis plusieurs mois.De plus, cette entreprise emploie aussi bien des francophones, que des néerlando-phones, ce qui permet d’avoir des échanges intéressants entre des visions différentes du monde, du travail et de la société en général. Pour encore augmenter ce senti-ment, chaque vendredi, l’entreprise organise ce qu’elle appelle l’ « English Friday », une journée où chacun s’exprime exclusivement en anglais pour permettre un meilleur

Page 9: romaingerard.files.wordpress.com · Created Date: 6/15/2010 9:21:58 PM

Haute Ecole Albert Jacquard | Infographie

Rapport de stage rédigé par Romain Gérard 3TID1 - Année 2009/2010

échange entre la Belgique et l’étranger lors de meetings.L’expérience sociale a donc été, pour moi, un des points les plus positifs lors de ce stage.

Aspect du métierDu point de vue du métier en lui-même, j’ai du faire face au choix que j’avais pris avant le stage. Cette entreprise utilisant un autre langage de programmation et un autre sys-tème d’exploitation que ceux dont j’avais l’habitude, il m’a fallut m’adapter rapidement pour être opérationnel. Après une petite formation accélérée avant le stage et quelques jours d’acclimatation sur Mac, je pense avoir relever le défi. Dans tout ce qui concerne l’intégration visuelle, j’ai pu dépasser les attentes de l’entreprise jusqu’à avoir la possibili-té d’échanger directement avec le client en vue de l’amélioration du projet en cours avec celui-ci. J’ai vu en cette opportunité une marque de confiance de l’entreprise envers mes aptitudes en graphisme, ergonomies et intégration de pages web en html, css et jquery.Pour ce qui est de la programmation en tant que tel, j’ai appris énormément durant ce stage. Cet apprentissage m’a permis de comprendre le langage et son fonctionnement et ainsi, pouvoir programmer quelques parties de projets seul ou accompagné de mon maitre de stage pour les sections les plus complexes. Dans ce domaine, que je voudrais améliorer encore, mon maitre de stage me permet de continuer à apprendre en dehors du stage grâce à son aide en vue de devenir un vrai développeur Ruby on Rails.Pour gérer au mieux cette période de stage, j’ai du faire face à mon plus grand défaut, la gestion du temps. Cette mauvaise gestion vient de plusieurs facteurs et notamment des soucis de santé. Pour cette partie, j’ai du trouver avant le stage une manière de gérer le problème et que celui-ci ne m’empêche pas de travailler correctement. Plusieurs de sport par semaine, m’ont permis de pouvoir travailler correctement chaque jour durant toute la journée sans aucun problème majeur. Pour ce qui est de l’organisation, j’ai eu recours à la construction d’une liste de tâches associées à un agenda pour ne pas perdre de vue mon objectif en fin de chaque semaine. J’ai vu une évolution dans la quantité de travail que je pouvais gérer au début du stage et en fin de stage. En plus de cela, cela m’a permis de retrouver une motivation à travailler tant de manière professionnelle que pour les travaux demandés par l’école.Au niveau du matériel, l’entreprise m’a fournis un MacBook Pro pour le travail sur place et a choisi de me le confier pour mes propres travaux à la maison, autant pendant le stage qu’après le stage, jusqu’à ce que je sois en mesure de me procurer ce même matériel.Il apparait également, que l’entreprise me laissait énormément de liberté quand à la solu-tion a apporter au différents problèmes graphiques ou techniques qu’elle me confiait au fil des semaines.

Aspect humain

De nature calme et conciliant, je n’ai jamais eu d’énorme soucis à m’intégrer personnelle-ment avec quelques groupes que ce soit. Je suis aussi timide en général mais le fait de

Page 10: romaingerard.files.wordpress.com · Created Date: 6/15/2010 9:21:58 PM

Haute Ecole Albert Jacquard | Infographie

Rapport de stage rédigé par Romain Gérard 3TID1 - Année 2009/2010

me retrouver dans un environnement agréable et rempli de savoir-vivre, je n’ai pas eu de problème pour me sentir tout à fait à l’aise durant toute la période du stage.Avec mes soucis de santé antérieur, je craignais d’avoir quelques problèmes de ponctual-ité, mais grâce au travail réalisé avant le stage au niveau de ma santé, seul les différents problèmes des trains me faisaient parfois arriver avec un peu de retard. Mais jamais en dehors du règlement de l’entreprise et surtout à chaque fois que cela s’est produit, je restais plus tard pour compenser les minutes perdues le matin dans le train. Je me suis parfois mis à travailler à l’aller et au retour dans le train pour ne pas perdre de temps inutile.Mon projet étant d’apprendre le Ruby on Rails et ainsi acquérir des connais-sances uniques dans le domaine du développement d’application web, mon désir d’apprentissage était grand. Je n’hésitais pas à passer plusieurs heures le soir pour comprendre les différents programmes sur lesquels mes collègues travaillaient et ainsi pouvoir moi-même réaliser des scripts similaires. Je pense avoir bien montré ma volonté d’apprendre chaque jour.

ConclusionA la fin de ce stage, j’ai eu l’opportunité de dialoguer avec mon maitre de stage de l’entièreté du stage pour en faire une évaluation, selon mes critères et les siens. Ceci afin d’améliorer les futurs stages que cette entreprise pourrait organiser et me permet-tre de prendre connaissance du point de vue de mon maitre de stage sur les différents aspects cités.A la fin de ce dialogue, il m’a proposé si les conditions dans les mois à venir le permettent de m’engager comme intégrateur web et développeur et de continuer à me former dans le développement d’application. J’assumerais aussi une fonction dans l’ergonomie des différents projets que Belighted me confierait.

Page 11: romaingerard.files.wordpress.com · Created Date: 6/15/2010 9:21:58 PM

Haute Ecole Albert Jacquard | Infographie

Rapport de stage rédigé par Romain Gérard 3TID1 - Année 2009/2010

Annexes

Page 12: romaingerard.files.wordpress.com · Created Date: 6/15/2010 9:21:58 PM

Rapport de stage du 18/01/2010 au 22/01/2010

Nom du professeur référent: Nom de l'étudiant:Classe: Nom de l'entreprise:

Emeric FlorenceRomain Gérard3TID1Belighted

Tâches assignées:- Intégration d’une interface d’administration pour un projet existant en xHTML et CSS.- Généralisation de l’interface pour l’associer à d’autres projets. (Template d’administration)- Conversion en HTML 5 et CSS 3 pour utilisation sur des projets internes à l’entreprise.

Tâches réalisées:- Intégration complète des écrans réalisées en xHTML et CSS.- Généralisation de l’interface.- Expérimentation et approche du CSS 3 et HTML 5 pour la tâche de conversion.- Conversion de la structure des pages xHTML vers HTML 5.

Autres: - J’ai eu l’occasion d’assister à une réunion sur un projet en cours entre les différents collaborateurs pour faire le point sur la situation. Ainsi, j’ai pu me rendre compte du fonc-tionnement d’une équipe professionnelle pour gérer le planning, les attentes du client et la gestion de ces attentes et contraintes en interne pour améliorer le cadre de travail et la productivité.

- Pour débuter le stage correctement, je me suis former grâce au livre : Agile Web Devel-opment with Rails (Third Edition). Un soucis technique avec mon système d’exploitation m’a empêché de réaliser l’exercice proposé dans le livre ainsi je dois attendre la se-maine suivante pour bénéfi cier d’un Macbook Pro et réellement me mettre à Ruby on Rails dans la pratique. Ce framework, après lecture du livre, me semble très intéressant pour la réalisation de mon propre TFE.

Apprentissage :

- Approfondissement des techniques HTML 5 et CSS 3 à travers les tâches assignées.- Compréhension du fonctionnement d’une équipe autour d’un projet.- Relation entre l’équipe de développeur et le manager.- Résolution des problèmes liés à différentes contraintes d’un projet.

Page 13: romaingerard.files.wordpress.com · Created Date: 6/15/2010 9:21:58 PM

Rapport de stage du 25/01/2010 au 29/01/2010

Nom du professeur référent: Nom de l'étudiant:Classe: Nom de l'entreprise:

Emeric FlorenceRomain Gérard3TID1Belighted

Tâches assignées:- Fin de la conversion en HTML 5 et CSS 3 de l’interface d’administration pour les projets internes.- Ajout du comportement de certains éléments avec jQuery.

Tâches réalisées:- Fin de la conversion en HTML 5 et CSS 3 de l’interface d’administration pour les projets internes.- Ajout du comportement de certains éléments avec jQuery.

Autres: - Prise en main du système GitHub pour héberger les fi chiers d’un projet et travailler en collaboration avec d’autres personnes.- Premier pas avec Ruby on Rails dans la pratique sur le futur site de l’entreprise Be-lighted en lien avec GitHub.- Travail en pair programming pour réaliser le blog du site Belighted v2.- Lancement d’un projet interne de time tracking. Celui-ci sera une application Rails pour défi nir en temps le travail de chacun sur les différents projets. Elle sera réalisée sur plusieurs semaines par l’ensemble des membres de l’entreprise lors de session dédiées le vendredi après midi.- Un vendredi sur deux, l’entreprise organise une journée “English Friday” où chacun s’exprime exclusivement en anglais.

Apprentissage :

- Approfondissement des techniques CSS 3 et HTML 5.- Apprentissage basique du fonctionnement du système GitHub pour le “social coding”.- Mise en pratique des techniques Ruby on Rails, MCV, POO, relation avec la base de données à travers les modèles, et modifi cations des vues.- Mise en chantier d’un nouveau projet par la défi nition de ses fonctionnalités et de l’expérience utilisateur. Séquençage du travail en fonctionnalité simple.

Page 14: romaingerard.files.wordpress.com · Created Date: 6/15/2010 9:21:58 PM

Rapport de stage du 01/02/2010 au 05/02/2010

Nom du professeur référent: Nom de l'étudiant:Classe: Nom de l'entreprise:

Emeric FlorenceRomain Gérard3TID1Belighted

Tâches assignées:- Continuation du site Belighted v2 pour intégrer les fonctionnalités au design.- Intégration d’un design pour el site “Solidaris Zeneo” xHTML Strict et CSS.

Tâches réalisées:- Suite de l’intégration des fonctionnalités du site Belighted v2.- Correction de différents éléments dans les vues.- Réunion avec le designer à propos du projet Zeneo Solidaris en vue d’améliorer la compatibilité web du design produit.- Intégration des 5 premières pages du site Solidaris Zeneo ( sans les changements qui y seront apportés à la suite de la réunion. )

Autres: - Utilisation plus approfondie de GitHub pour le projet Solidaris Zeneo.- Setting de l’application de Time tracking en Rails 3.0.0 et installation de Postgresql. Test des différents plugins rails nécessaires à l’application. (compatibilité rails 3.0.0)

Apprentissage :

- Meilleure approche des techniques POO et MCV.- Techniques pour solutionner les problèmes de compatibilité IE 6-7-8 rencontrés lors de l’intégration des pages pour Solidaris Zeneo- Nouvelles techniques jQuery.- Installation base de données sur Mac OS X.- Différents principes de fonctionnement Mac OS X. (Unix)

Page 15: romaingerard.files.wordpress.com · Created Date: 6/15/2010 9:21:58 PM

Rapport de stage du 08/02/2010 au 12/02/2010

Nom du professeur référent: Nom de l'étudiant:Classe: Nom de l'entreprise:

Emeric FlorenceRomain Gérard3TID1Belighted

Tâches assignées:- Fin de l’intégration du design Zeneo Solidaris en xHTML et CSS.- Redesign de certains éléments suite à quelques soucis avec le designer (Différences de conception entre le Print design et Web design)- Amélioration de l’ergonomie générale des pages pour une meilleure expérience utilisa-teur.- Modifi cation des vues pour intégrer le “slicing” aux fonctionnalités déjà en place dans l’application.

Tâches réalisées:- Fin de l’intégration du design Zeneo Solidaris en xHTML et CSS.- Redesign de certains éléments suite à quelques soucis avec le designer (Différences de conception entre le Print design et Web design)- Amélioration de l’ergonomie générale des pages pour une meilleure expérience utilisa-teur.- Modifi cation des vues pour intégrer le “slicing” aux fonctionnalités déjà en place dans l’application.

Autres: - Discussion à propos de JavaScript et différentes pratiques à adopter.

Apprentissage :

- Différentes techniques utilisées en Ruby on Rails.

Page 16: romaingerard.files.wordpress.com · Created Date: 6/15/2010 9:21:58 PM

Rapport de stage du 15/02/2010 au 19/02/2010

Nom du professeur référent: Nom de l'étudiant:Classe: Nom de l'entreprise:

Emeric FlorenceRomain Gérard3TID1Belighted

Tâches assignées:- Correction à réaliser sur certaines pages pour le projet Zeneo Solidaris au niveau du comportement des éléments en css.- Ajout de nouvelles fonctionnalités tel qu’un breadcrumb.- Mise en place des hacks JavaScript et CSS pour IE 7-8 dans l’application.- Test de l’application et corrections nécessaires.- Suite du projet de site Belighted v2.

Tâches réalisées:- Correction à réaliser sur certaines pages pour le projet Zeneo Solidaris au niveau du comportement des éléments en css.- Ajout de nouvelles fonctionnalités tel qu’un breadcrumb.- Mise en place des hacks JavaScript et CSS pour IE 7-8 dans l’application.- Test de l’application et corrections dans les vues pour une meilleure compatibilité entre navigateur.- Suite et fi n de la réalisation en rails du blog pour le site Belighted v2 (Ajout/édition/sup-pression de posts et ajout/suppression de commentaires)- Réalisation en rails du formulaire du contact avec envoi d’un mail et ajout dans la base de données.- Création d’un système de catégories pour les posts du blog.- Ajout d’un plugin pour la gestion des tags des posts du blog.- Modifi cation des vues pour intégrer les nouveaux éléments.

Autres: - Installation de rails 3.0.0 (beta) et des différents plugins pour le projet de time tracking.- Installation propre de Postgresql sur Mac OS X.

Apprentissage :

- Différents nouveaux concepts dans Rails 3.- Setup d’une base de données Postgresql pour être compatible avec Heroku.

Page 17: romaingerard.files.wordpress.com · Created Date: 6/15/2010 9:21:58 PM

Rapport de stage du 22/02/2010 au 26/02/2010

Nom du professeur référent: Nom de l'étudiant:Classe: Nom de l'entreprise:

Emeric FlorenceRomain Gérard3TID1Belighted

Tâches assignées:- Installation du plugin reCaptcha pour éviter que des bots rédigent des commentaires sur le blog du site Belighted v2- Ajout d’un système de recherche dans le texte pour le blog (recherche sur titre et con-tenu)- Ajout d’un fl ux RSS pour les posts du blog belighted.- Aménager un système pratique pour mettre les balises dans le contenu du blog (type parser mais simplifi é)- Mini galerie pour la page de présentation des réalisation Belighted- Correction des divers liens dans le site.- Test des fonctionnalités du site.

Tâches réalisées:- Installation du plugin reCaptcha pour éviter que des bots rédigent des commentaires sur le blog du site Belighted v2.- Ajout d’un système de recherche dans le texte pour le blog (recherche sur titre et con-tenu).- Ajout d’un fl ux RSS pour les posts du blog belighted.- Aménager un système pratique pour mettre les balises dans le contenu du blog (type parser mais simplifi é).- Mini galerie pour la page de présentation des réalisation Belighted- Correction des divers liens dans le site.- Test des fonctionnalités du site.- Redesign d’éléments pour coller au layout initial.

Autres: - Modifi cation du logo Belighted pour l’appliquer sur des t-shirts et vestes.

Apprentissage :

- Utilisation et implémentation de moteurs de recherche avec et sans indexation.- Création d’un fl ux RSS et utilisation.- Méthode pour parser du texte. (en lien avec les expressions régulières)

Page 18: romaingerard.files.wordpress.com · Created Date: 6/15/2010 9:21:58 PM

Rapport de stage du 01/03/2010 au 05/03/2010

Nom du professeur référent: Nom de l'étudiant:Classe: Nom de l'entreprise:

Emeric FlorenceRomain Gérard3TID1Belighted

Tâches assignées:- Ajout des titres en fonction de la page en cours (simple utilisation de variable) pour le site Belighted v2.- Intégration de l’interface d’administration commencée en début de stage dans un projet en cours.- Design des éléments manquant pour cette application dans l’interface d’administration.

Tâches réalisées:- Ajout des titres en fonction de la page en cours (simple utilisation de variable) pour le site Belighted v2.- Intégration de l’interface d’administration dans un projet nommé “Pas de quartier”.- Design d’éléments tels que des tableaux, des formulaires et des listes en respect avec le design initial.- Redéfi nition des classes d’un plugin pour en améliorer l’affi chage au sein du projet.- Validation HTML 5 et CSS3.- Début de l’intégration de l’interface d’admin sur un autre projet appelé “Fanitude”.

Autres: - Création d’un fragment du projet 88mph (application de time-tracking) qui permet de créer, éditer et visualiser les projets sur lesquels une entreprise travaille.- Discussion sur la création d’un plugin d’administration pour chaque projet Belighted.

Apprentissage :

- Nouvelles notions de html 5 et css 3.- Nouvelles notions de Rails 3 (beta) sur le projet 88mph.

Page 19: romaingerard.files.wordpress.com · Created Date: 6/15/2010 9:21:58 PM

Rapport de stage du 08/03/2010 au 12/03/2010

Nom du professeur référent: Nom de l'étudiant:Classe: Nom de l'entreprise:

Emeric FlorenceRomain Gérard3TID1Belighted

Tâches assignées:- Suite de l’intégration des différents éléments de l’interface d’administration dans le pro-jet “Fanitude”- Création dun logo pour l’administration “beadmin”- Ajout de nouveaux éléments requis dans l’administration pour les projets “Fanitude” et “Pas de quartier”- Dashboard design de la “beadmin”- Search interface dans la “beadmin”- Timetracker 88mph design- Corrections de l’application “Solidaris” suite à quelques requêtes de la part du client.

Tâches réalisées:- Suite de l’intégration des différents éléments de l’interface d’administration dans le pro-jet “Fanitude”- Création dun logo pour l’administration “beadmin”- Ajout de nouveaux éléments requis dans l’administration pour les projets “Fanitude” et “Pas de quartier”- Dashboard design de la “beadmin”- Première version du design pour l’application interne de time tracking.- Ajout de liens pour permettre le test de l’application de time tracking.- Suite du design après réunion autour du projet.- Corrections de l’application “Solidaris” suite à quelques requêtes de la part du client.

Autres: - Réalisation d’une courte video de 10 secondes dans la cadre de la sponsorisation d’un évènement pas Belighted.- L’interface de recherche a été mise en suspend pour discussion autour de la fonction-nalité en Ajax.

Apprentissage :

- Notion de base d’Ajax dans rails.- Notion de base dans Motion 4 (Texte, camera, mouvement, …)

Page 20: romaingerard.files.wordpress.com · Created Date: 6/15/2010 9:21:58 PM

Rapport de stage du 15/03/2010 au 19/03/2010

Nom du professeur référent: Nom de l'étudiant:Classe: Nom de l'entreprise:

Emeric FlorenceRomain Gérard3TID1Belighted

Tâches assignées:- Traitement des requêtes du client sur le projet “Zeneo Solidaris”.- Modifi cation du projet en fonction de ces même requêtes.- Rendez-vous avec le client de “Zeneo Solidaris” afi n d’améliorer l’expérience utilisateur et partenaire sur le site.- Amélioration de la zone d’administration de “Zeneo Solidaris” pour en améliorer l’expérience utilisateur.

Tâches réalisées:1. Solidaris- Cacher champ description.- Ajouter Allemand aux langues dans les langues parlées par le partenaire.- Affi cher les dates uniquement si offre temporaire (proposer radio buttons).- Affi cher prix avant remise sur la fi che partenaire.- Dans la prestataire, affi cher l’onglet photos par défaut et un première position.- Faute de frappe dans recherche zone admin (Cecher).- Ajouter check_box “featured” dans recherche zone admin et permettre une recherche en fonction de ce paramètre.- Affi cher la première catégorie par défaut.- Transformer le bouton ‘Nouvelle catégorie’ en lien ‘Autre domaine’ (en-dessous du pre-mier choix).- Correction des requêtes SQL pour améliorer le fonctionnement de la recherche d’élément featured.- Mise en place du contenu des pages “contact” et “conditions d’utilisation”.- Résolution d’un bug qui empêchait d’affi cher le menu d’un partenaire si un prix (option-nel) n’était pas fi xé.- Ajout d’un lien de retour sur la fi che d’un avantage pour permettre une navigation plus aisée à travers les recherches.

2. 88mph- Suite du design de l’application de time tracking.- Amélioration du système de création de projet.

Page 21: romaingerard.files.wordpress.com · Created Date: 6/15/2010 9:21:58 PM

Autres: - Réunion avec le client “Zeneo Solidaris”. J’ai pu faire une réunion seul avec un client afi n de parcourir le site actuel et dégager des pistes pour améliorer l’expérience utilisa-teur.- Réunion avec le responsable du projet pour lui faire un compte rendu de ma réunion avec le client et valider les modifi cations à réaliser dans le projet.

Apprentissage :

- Nouvelle notions de ruby on rails 2 et 3.- Amélioration de requête SQL.- Nouvelle notions de jQuery.

du 15/03/2010 au 19/03/2010Rapport de stageRomain Gérard 3TID1

Page 22: romaingerard.files.wordpress.com · Created Date: 6/15/2010 9:21:58 PM

Rapport de stage du 22/03/2010 au 26/03/2010

Nom du professeur référent: Nom de l'étudiant:Classe: Nom de l'entreprise:

Emeric FlorenceRomain Gérard3TID1Belighted

Tâches assignées:- Suite du traitement des requêtes du client validées par le responsable du projet.- Suite et fi n du design de l’application de time tracking “88mph”.- Intégration du design.

Tâches réalisées:1. Solidaris :- Pagination des éléments dans la zone d’administration pour une navigation plus aisée.- Modifi cation de l’emplacement des éléments du site pour améliorer la navigation.- Changements des couleurs du site en fonction de la catégorie de l’avantage en cours d’affi chage.- Modifi cation des informations présentes dans chaque pavé d’avantages en fonction du type de navigation (recherche, catégorie, featured, homepage, …)- Intégration des nouvelles pages contact et conditions.- Ajout d’un lien vers le catalogue format PDF.- Améliorations générales du design pour une meilleure lisibilité.

2. 88mph :- Suite de l’intégration du design en html5 et css3.- Ajout de comportement en jQuery pour les checkboxes et les boutons de type radio.

Autres: - Mise en staging de la nouvelle version du site “Zeneo Solidaris” afi n que le client puisse la tester.- Session de pair programming sur 88mph pour réaliser le calcul du temps passé sur un projet par un utilisateur dans une fenêtre de temps donnée.

Apprentissage :

- Nouvelles notions de html5 et css3 afi n de réduire au maximum l’utilisation d’images dans le projet “88mph”.- Notions de jQuery plus avancées pour modifi er le comportement et l’affi chage d’éléments de formulaire.- Notions avancées de gestion de données de temps et de durée en Rails et SQL.

Page 23: romaingerard.files.wordpress.com · Created Date: 6/15/2010 9:21:58 PM

Rapport de stage du 29/03/2010 au 02/04/2010

Nom du professeur référent: Nom de l'étudiant:Classe: Nom de l'entreprise:

Emeric FlorenceRomain Gérard3TID1Belighted

Tâches assignées:- Suite et fi n du traitement des requêtes du client sur “Zeneo Solidaris” avant la mise en production.- Déploiement du site en production.- Suite de l’intégration du design du time tracker.

Tâches réalisées:Solidaris:- Traitement de diverses requêtes mineures pour améliorer la lisibilité de certains élé-ments du site “Zeneo Solidaris”.- Mise en production des derniers changements et lancement du site.- Réfl exion avec le client sur des améliorations futures du projet.

88mph:- Intégration du design dans toutes les fonctionnalités mise en place.- Amélioration du script pour le comportement des éléments de formulaire.- Corrections de différents problèmes dans les vues du site avec les nouvelles fonction-nalités de fenêtre de temps.

Autres: - Entrevue avec mon maitre de stage pour discuter du déroulement stage, connaitre mes impressions, mes motivations, et mes opportunités futures.

Apprentissage : - Nouvelles notions de rails 3.- Optimisation de script jQuery.


Recommended