Stage à Capgemini
Du 8 janvier au 2 février 2024
Capgemini est une entreprise multinationale de services informatiques et de conseil, d’origine française. L’entreprise offre une gamme étendue de services, notamment le conseil en technologie, la transformation numérique, la gestion des technologies de l’information, l’externalisation des processus métier, le développement de logiciels, le cloud..
L’entreprise propose à ses clients des solutions innovantes pour les accompagner dans leur transformation numérique, leur performance opérationnelle et leur compétitivité. Ses activités s’étendent sur un très grand nombre de secteurs tels que ceux de l’aéronautique et la défense, la santé, l’automobile, l’hôtellerie, le secteur public, la télécommunication, les médias et bien d’autres.
Le programme Érable, initié en 2015, ne concernait alors que l’offre d’un service Cloud aux clients désireux d’héberger des solutions sur une plateforme avec un ensemble de services clé en main. Le programme s’est élargi et cette première partie du programme est aujourd’hui rattachée à la direction PFC (Plateformes Cloud) d’Orange.
Le programme s’est ensuite enrichi avec des équipes développant des enablers (applications appelées par d’autres briques du SI d’Orange et qui rendent un service dédié). C’est ici que les équipes FEDS et FIRE, créées en 2019, travaillent sur le développement de ces applications. Elles ont intégré le train SAFe Identité Numérique qui a pour mission de garantir un accès simple et sécurisé aux clients d’Orange pour l’ensemble de leurs services.
Lors de la journée d’accueil, on m’a fourni un sac à dos contenant un PC portable ainsi que tout l’équipement me permettant de travailler aussi bien à distance que sur site.
Capgemini a intégré la méthode agile à tous les niveaux de son organisation, faisant de cette approche de gestion de projet une composante fondamentale de sa culture d’entreprise. De la conception des projets à leur mise en œuvre, l’agilité guide les équipes dans une approche itérative, favorisant la collaboration, la réactivité aux changements et la livraison continue de solutions de qualité. J’ai moi-même pu assister à de nombreux types de réunion, qui démontrent la place centrale de l’agilité dans la vie de l’écosystème de Capgemini, dont les « Daily meetings » de début de journée, durant lesquelles chaque membre de l’équipe informe les autres du travail qu’il a effectué la veille et de ce qu’il compte faire dans la journée.
Mission 1 – semaine du 8 au 12 janvier
Formation sur le framework Angular
Contexte (suite)
L’équipe FIRE a développé plusieurs applications dont :
- “Invitation” qui permet aux clients de générer des invitations et des procurations sur leurs comptes et services
- “RAM” (Remote Acess Management) qui a permis dans un premier temps de connecter les Smart TV au compte Orange des clients. Ce mécanisme a ensuite été réutilisé pour permettre une authentification déportée du client sur son smartphone en boutique (meilleur service au client et travail simplifié pour les conseillers)
- “APAM” qui a pour fonction de fournir un mot de passe sécurisé pour l’accès aux boîtes mail d’Orange de façon automatique.
La partie qu’il m’est demandé d’étudier sur les web components est portée par le souhait d’Orange de réemployer des vues des différentes applications développées par l’équipe FIRE sans avoir à dupliquer ou refaire les développements. Le but est d’encapsuler ces vues dans d’autres briques du SI d’Orange.
Réalisation
Suite à ma première journée de stage qui consistait en une journée d’accueil pour les nouveaux arrivants (diverses présentations, du programme onBoarding aux engagements RSE en passant par la présentation de l’écosystème de Capgemini) j’ai directement débuté au sein de l’équipe FIRE chargée du développement et l’on m’a fourni quelques pistes de documentation sur Angular (angular components, web components..).
J’ai également mis en place mon environnement de travail (projet front Angular, Mock server, librairie ob1, packages..) avec l’aide d’un membre de l’équipe.
(captures d’écran de la mise en place de l’environnement de travail à venir)
Il s’agit dans un premier temps pour moi de me former sur Angular pour mieux comprendre son fonctionnement et les web components fabriqués avec cet outil. On m’a donc donné pour mission de continuer mes recherches pour créer un projet Angular, développer un web component puis un package du projet.
Compétences mobilisées pour la réalisation de cette mission
– B1.4 : travailler en mode projet
– B1.6 : organiser son développement professionnel
Mission 2 – semaines du 15 au 26 janvier
Suite de la formation à Angular et recherche de solutions d’évolution
Contexte
La première semaine de mon stage m’a servi à me familiariser au framework Angular et aux différentes notions associées pertinentes dans le cadre de ma mission (composants Angular, composants web, librairie Angular). Il s’agit maintenant pour moi de passer à la pratique et de renforcer mes connaissances afin de commencer à trouver des solutions pour satisfaire le besoin qui justifie l’objectif de ma mission de stage : adapter un projet Angular en librairie réutilisable dans n’importe quelle application.
Réalisation
Ma première mission cette semaine consistait à créer mon projet Angular, créer un composant Angular et créer un package du projet (librairie Angular).
Après avoir accompli les deux premières étapes de ma mission sans trop de difficulté, je me suis intéressé à la création d’un package avec la prise en main de l’outil ng-packagr qui permet de créer des librairies Angular dans un projet et d’y ajouter des composants Angular.
La partie la plus compliquée sur laquelle je n’ai pas fini de travailler concerne l’étude sur la faisabilité de l’utilisation d’une librairie Angular et ses composants, développés pour une application spécifique, dans n’importe quelle autre application. Il s’agit de rendre cette librairie réutilisable dans de multiples applications, ce qui m’amène au véritable objectif de mon stage : essayer de faire avancer la documentation sur cette étude de faisabilité, proposer des solutions pour la faire aboutir.
Ma première piste dans ce sens est celle de la gestion des imports (composants et modules) entre les fichiers principaux du projet et ceux de la librairie afin d’intégrer les composants à une application. Mais cette méthode ne permet d’adapter la librairie qu’à une seule application : celle dans laquelle on importe les composants et les modules de la librairie.
Mes récentes recherches m’ont également amené à découvrir Angular Elements, une fonctionnalité d’Angular permettant la réutilisation des composants Angular sous forme d’éléments web autonomes dans n’importe quelle application, indépendamment du framework utilisé. Je développerai sérieusement cette piste à partir de la semaine suivante.
Au cours de ma mission de formation, j’ai commencé la réalisation d’un petit compte-rendu que j’ai illustré avec des captures d’écran.
Contexte – semaine 3 (du 29 janvier au 2 février)
Dans la continuité de mon travail sur la recherche de solutions d’adaptation de vues d’applications en composants web réutilisables, j’ai donc avancé sur cette voie durant cette semaine.
Réalisation
J’ai développé la piste que j’avais trouvée la semaine dernière sur Angular Elements. Il s’agit essentiellement de créer un Custom Element (composant Angular encapsulé en tant qu’élément HTML) référençant le composant Angular et qui pourra donc être utilisé dans n’importe quel contexte.
J’ai documenté le processus de création d’un web component à partir d’un composant Angular avec Angular Elements. J’ai suivi les étapes, ajouté la dépendance Angular Elements, et configuré le module. Cependant, j’ai rencontré des obstacles lors de l’exécution de la commande ng build.
La commande ng build est essentielle dans la création d’un web component avec Angular Elements car elle compile le code source Angular, génère les fichiers nécessaires, et permet d’obtenir une version autonome du composant prête à être utilisée dans n’importe quelle application web.
J’ai travaillé à la résolution de certains problèmes (fichiers non générés) tout en continuant d’alimenter mon compte-rendu et un petit support de présentation en vue d’un point sur mes recherches en fin de semaine suivante.
Compétences mobilisées pour la réalisation de cette mission
– B1.4 : travailler en mode projet
– B1.6 : organiser son développement professionnel
– B2.1 : concevoir et développer une solution applicative
(accès restreint)
Mission 3 – semaine du 29 janvier au 2 février
Suite des recherches et proposition de solutions d’évolution
Contexte
Dans le cadre de la recherche de solutions d’adaptation de vues Angular en composants web, deux membres de l’équipe s’étaient penchés sur une piste qui m’a été donnée en début de stage pour m’orienter dans ma recherche, en me laissant libre de trouver de meilleures alternatives, s’il y en a, en cours de route.
Réalisation
Cette première piste concerne ng-packagr, un outil de publication et d’empaquetage pour les bibliothèques Angular. Il permet de créer facilement des packages Angular réutilisables sous forme de bibliothèques npm (Node Package Manager). Il s’agit de configurer son projet Angular en définissant les paramètres de génération dans un fichier spécifique ng-package.json puis d’utiliser la commande ng-packagr pour compiler en empaqueter la bibliothèque. On obtient alors un package prêt à être intégré dans d’autres projets Angular.
C’est en poursuivant mes recherches que j’ai découvert que cette première piste n’était peut-être pas la plus adaptée pour répondre au besoin exprimé, car ng-packagr est spécifiquement conçu pour les bibliothèques Angular et leur intégration dans des frameworks non-Angular peut s’avérer laborieuse. C’est dans le même temps que j’ai trouvé une nouvelle piste de recherche, à savoir Angular Elements.
C’est une fonctionnalité d’Angular qui permet de créer des web components réutilisables, également appelés custom elements. Il s’agit ici de convertir un composant Angular classique en custom element à l’aide de la fonction createCustomElement( ) fournie par Angular puis de compiler le projet (application) Angular, avec la commande ng build, en tant que package indépendant pouvant être intégré dans d’autres projets, indépendamment du framework utilisé.
J’ai approfondi cette deuxième piste en travaillant sur un projet créé par moi-même, d’abord sur un composant à vue statique (page HTML) puis un composant à vue dynamique (calculatrice) qui requiert des manipulations supplémentaires (gestion des inputs et outputs). Dans le même temps, j’ai travaillé sur une petite présentation synthétisant mon travail d’auto-formation et de recherche au cours des 4 dernières semaines et ma conclusion sur la comparaison entre les deux outils.
C’est au terme de ma présentation en présence du reste de l’équipe que les retours m’ont aidé à mieux cerner le besoin exprimé par le correspondant d’Orange travaillant avec l’équipe FIRE. Et le besoin est très complexe, d’autant plus que les composants de l’application RAM (ou d’autres applications développées par l’équipe) sont autrement plus complexes que les petits composants sur lesquels j’ai travaillé.
J’ai au moins le mérite d’avoir relancé la discussion sur la meilleure approche à adopter pour atteindre cet objectif mais il reste encore beaucoup de travail de recherche à effectuer. A la lumière de ces nouveaux éléments (qui restent encore à éclaircir), je vais utiliser cette dernière semaine pour avancer dans ce sens et essayer de trouver un usage aux deux outils (ng-packagr et Angular Elements) pour obtenir un résultat satisfaisant.
Compétences mobilisées pour la réalisation de cette mission
– B1.4 : travailler en mode projet
– B1.6 : organiser son développement professionnel
– B2.1 : concevoir et développer une solution applicative