Rapport Final

1. Introduction

Ce rapport présente le bilan de mon stage de deux mois effectué au sein de l’entreprise DATAMIL. Durant cette période, j’ai été intégré à une équipe de développement où j’ai pu travailler sur plusieurs projets, notamment un site internet et une application web/mobile nommée PlanDone. Mon objectif principal était de mettre en pratique mes connaissances théoriques tout en acquérant de nouvelles compétences dans le développement web moderne et la gestion d’environnements cloud. J’ai également découvert les méthodes agiles de travail en équipe, ce qui m’a permis d’appréhender concrètement les exigences du monde professionnel. DATAMIL est spécialisée dans le développement de solutions digitales adaptées aux besoins des entreprises, avec un accent particulier sur les applications web, le cloud computing et l’analyse de données. L’entreprise valorise l’innovation technologique et la collaboration au sein de ses équipes, favorisant ainsi un environnement propice à la montée en compétences et à l’échange de savoir-faire.

2. Description du projet et missions réalisées

2.1 Mission 1 : Création du site Datamil et initiation au cloud

Dans un premier temps, j’ai contribué au développement et à la maintenance du site vitrine Datamil, conçu sous la plateforme Ghost. Cette mission m’a permis d’acquérir une première expérience dans la gestion de contenu web ainsi que dans l’administration d’environnements cloud.

En effet, j’ai pu en apprendre davantage sur l’entreprise. Je me suis naturellement interrogé sur l’absence d’un site vitrine par le passé. L’entreprise fonctionnait principalement par le bouche-à-oreille et proposait quelques services, mais ne souhaitait pas s’ouvrir à un public plus large afin d’éviter un afflux de demandes. Toutefois, la mise en place d’un site vitrine permet de renforcer l’image de professionnalisme et d’expérience, tout en facilitant l’ouverture vers un public élargi.

Ce projet, relativement court car mon stage avait avant tout un objectif technique, m’a néanmoins permis de me familiariser avec l’environnement de travail, de prendre mes repères et de découvrir les outils mis à ma disposition.

J’ai découvert en particulier :
  • Le fonctionnement des machines virtuelles (VM) sur Google Cloud Platform (GCP), leur configuration et déploiement.
  • Le CMS : Ghost un open-source conçu principalement pour la publication de contenus, notamment les blogs et les newsletters. Il est axé sur la simplicité, la rapidité et l'expérience d’écriture afin de ne pas perdre trop de temps à la création.
  • La notion de serveurs, load balancing, et l’importance de la haute disponibilité dans un environnement cloud.
  • Les bases des systèmes de gestion de bases de données (SGBD) pour supporter les fonctionnalités back-end.
  • Une initiation à Angular, framework front-end que j’ai exploré dans le cadre de la maintenance du site. Ainsi que Ubuntu qui a servi à l'installation du cms.
  • Des concepts liés à la BIG DATA, notamment à travers des échanges avec les data analysts de l’équipe, ce qui m’a ouvert une nouvelle perspective sur l’exploitation des données en entreprise.

Cette mission fut pour moi une immersion dans les aspects opérationnels du cloud et des architectures modernes, complétée par un apprentissage continu sur les technologies front-end.

Illustrations associées : captures d’écran du site Datamil, console GCP avec VMs, diagrammes d’architecture cloud et de load balancing.

2.2 Mission 2 : Développement de l’application PlanDone

2.2.1 Présentation générale

PlanDone est une application web/mobile conçue pour la gestion efficace des tâches et des calendriers, combinant une interface utilisateur intuitive avec une architecture technique moderne. Elle est développée en React.js côté front-end, utilisant les dernières fonctionnalités comme React Router v7 et React Hooks, et un back-end Node.js/Express avec une base de données MongoDB. L’ensemble communique via une API REST sécurisée. Cette application répond au besoin métier de faciliter l’organisation personnelle et professionnelle des utilisateurs, en offrant des fonctionnalités avancées de gestion de tâches (création, modification, consultation), des vues calendaires dynamiques (journalière, hebdomadaire, mensuelle), et un suivi historique des actions.

2.2.2 Architecture technique et organisation du code

Front-end :

  • La structure React est organisée en composants fonctionnels et dossiers thématiques (task, calendar, user...) pour une modularité et une maintenabilité accrues.
  • La navigation est prise en charge par React Router v7, utilisant et pour gérer le routage SPA, avec des routes privées sécurisées par un composant PrivateRoute qui protège les pages sensibles (profil, dashboard, tâches) en vérifiant l’authentification via le contexte AuthProvider.
  • La gestion de l’état global (authentification, tâches en cours, filtres) est réalisée avec le Context API de React, évitant l’utilisation de solutions plus lourdes comme Redux pour ce projet.
  • La gestion des formulaires (création ou mise à jour des tâches) utilise des contrôles React classiques et une validation simple côté client avant envoi.

Back-end :

  • Le serveur Express expose des endpoints REST pour chaque ressource principale : utilisateurs (/api/users), tâches (/api/tasks), calendriers (/api/calendar), historiques (/api/history).
  • Les requêtes sont sécurisées par un middleware qui vérifie la validité du token JWT, garantissant que seules les requêtes authentifiées peuvent accéder aux données sensibles.
  • La communication entre client et serveur s’appuie sur JSON, avec des structures claires et typées.

2.2.3 Gestion de la base de données

La base de données relationnelle MongoDB est modélisée avec plusieurs tables principales : La base de données relationnelle MongoDB est modélisée avec plusieurs tables principales :

  • Users : stockage des informations utilisateurs (nom, email, mot de passe hashé avec bcrypt, rôle, date d’inscription).
  • Tasks : contient les tâches avec attributs tels que titre, description, statut, priorité, date d’échéance, utilisateur associé via une clé étrangère user_id.
  • CalendarEvents : représente les événements calendaires liés aux tâches ou à des rappels personnalisés.
Les relations entre tables assurent l’intégrité des données (par exemple, suppression en cascade des tâches si un utilisateur est supprimé).

2.2.4 Fonctionnalités principales développées

Gestion des tâches :

  • Création de tâches via un formulaire React, avec envoi au serveur via Axios/Fetch POST.
  • Visualisation des détails de chaque tâche avec possibilité de modification ou suppression.
  • Mise à jour du statut (en cours, terminé, en attente).
  • Calendrier multi-vues :
  • Vue quotidienneaffichant les tâches du jour.
  • Vue hebdomadaire avec répartition des tâches sur 7 jours.
  • Vue mensuelle pour une vision à long terme.
  • Ces vues sont construites avec des composants réutilisables et l’utilisation de librairies de gestion de dates comme date-fns pour manipuler les affichages.
  • Historique des actions :
  • Chaque modification ou création de tâche génère une entrée dans la table historique, consultable dans une section dédiée.
  • Cette fonctionnalité aide à la traçabilité et à la transparence.

2.2.5 Sécurité et authentification

Utilisation du JSON Web Token (JWT) pour sécuriser les échanges :

  • Lors de la connexion, le serveur délivre un token signé qui est stocké côté client (via cookie sécurisé ou localStorage selon le choix).
  • Ce token est envoyé dans l’en-tête Authorization des requêtes REST, vérifié côté serveur via un middleware.
  • Ce mécanisme permet une authentification stateless, ce qui améliore la scalabilité.

Le mot de passe utilisateur est haché avec bcrypt avant stockage, évitant la conservation de données sensibles en clair.

2.2.6 Utilisation de Postman pour les tests API

Postman a été utilisé pour simuler toutes les requêtes API, permettant :

  • Le test des routes sécurisées avant implémentation front-end.
  • La validation des schémas de données et des réponses JSON.
  • La simulation des erreurs pour garantir une robustesse et une bonne gestion des codes HTTP.

Ces tests ont faciliter le débogage et assurent la conformité fonctionnelle entre front et back.

2.2.7 Gestion de projet et méthodes agiles

Le projet a été géré via GitHub avec une méthodologie Kanban :

  • Les issues étaient classées par colonne (À faire, En cours, Fait) pour un suivi visuel clair.
  • Les commits étaient liés aux issues pour garder une traçabilité du travail.

Les revues de code régulières avec le maître de stage ont permis d’améliorer la qualité et de corriger rapidement les anomalies.

Une formation Udemy offerte par le maître de stage a permis un apprentissage accéléré de React.js, ce qui a facilité la montée en compétence rapide et la contribution efficace au projet.

3. Planning

Semaine Dates Tâches prévues
Semaine 1 24/03 - 28/03 Prise de contact avec l’entreprise, installation des outils de développement (WAMP, GitHub, éditeurs). Découverte de l’environnement technique.
Démarrage du projet datamil.fr : étude des besoins, structure du site, premiers tests locaux.
Semaine 2 31/03 - 04/04 Poursuite du projet datamil.fr (création d’un CRUD, déploiement local, tests).
Premiers essais de configuration serveur (NGINX, clés SSH) et découverte des cloud providers (GCP, AWS).
Semaine 3 07/04 - 11/04 Démarrage du projet Plandone : définition des besoins, objectifs de l’app, veille concurrentielle sur les apps de productivité.
Choix de l’architecture technique (Node.js, Vue.js, PostgreSQL).
Semaine 4 14/04 - 18/04 Création de la base de données mongodb, modélisation des entités.
Mise en place du projet backend (API REST avec Express), premières routes (CRUD de routines, utilisateurs...).
Semaine 5 21/04 - 25/04 Avancement du backend : sécurisation des routes, tests, intégration Docker.
Mise en place du projet Vue.js (environnement, pages de base, structure du front).
Semaine 6 28/04 - 02/05 Connexion back/front : intégration API Vue.js / Node.js.
Développement des formulaires utilisateurs, affichage des données, interaction avec les routines.
Semaine 7 05/05 - 09/05 Ajout de fonctionnalités avancées (tableaux de bord, suivi des objectifs, API externes).
Travail sur la gestion des erreurs, UX, navigation.
Semaine 8 12/05 - 16/05 Finalisation du front-end (design responsive, composants Vue, animations).
Tests, feedback du tuteur, correction des bugs.
Semaine 9 19/05 - 21/05 Derniers ajustements.
Rédaction de la documentation technique, préparation au rendu final.
Présentation du projet.

4. Analyse du travail réalisé : points forts, points d'amélioration et actions correctives

Le projet PlanDone a été développé en utilisant la méthodologie Agile, plus précisément un tableau Kanban, qui a structuré notre manière de travailler. Cette organisation visuelle des tâches nous a permis de suivre précisément l’état d’avancement des différentes fonctionnalités, de gérer les priorités et de maintenir une communication fluide au sein de l’équipe.

Mon maître de stage m’a guidé dans la gestion des tickets, de la prise en charge à la résolution, ce qui m’a permis de développer une discipline rigoureuse. J’ai appris à découper les fonctionnalités en tâches claires, à documenter mes commits Git avec soin, et à utiliser des branches spécifiques pour chaque fonctionnalité, facilitant ainsi la relecture du code et l’intégration continue.

Par ailleurs, la liberté accordée pour expérimenter localement m’a encouragé à adopter une démarche proactive : tester, déboguer, et valider chaque modification avant de la soumettre. J’ai aussi intégré l’utilisation d’outils comme Postman pour vérifier les endpoints API indépendamment du front-end.

Le suivi régulier via les réunions d’équipe et les feedbacks m’a permis d’ajuster mon travail en continu, et d’améliorer la qualité de mon code. Ce cadre méthodologique m’a non seulement aidé à être plus efficace, mais aussi à mieux comprendre l’importance d’une organisation rigoureuse dans la réussite d’un projet collaboratif.

Au cours de mon stage, j’ai été confrontée à des situations variées qui m'ont permis de prendre du recul sur mes pratiques, d’identifier mes points forts mais aussi mes lacunes techniques.

Points forts :

L’un de mes atouts majeurs a été ma capacité d’adaptation. Dès les premières semaines, j’ai su m’approprier l’environnement technique de l’entreprise, malgré une stack relativement dense (React, Node.js, PostgreSQL). J’ai rapidement su gérer la prise en charge, structurer mon travail par branches Git dédiées, et documenter correctement mes commits.

Mon autonomie s’est développée naturellement grâce à une bonne organisation personnelle, notamment grâce à l’usage d’un Kanban, à la gestion du temps sur les tâches, et à mon initiative dans les phases de test via Postman ou le terminal.

Points d’amélioration :

L’aspect qui m’a le plus challengée a été la lecture et la compréhension du code. Dans les premiers temps, j’avais tendance à hésiter longuement avant de faire une modification, par peur d’introduire une régression.

De plus, mes connaissances en base de données relationnelle étaient théoriques ; j’ai donc dû progresser sur la modélisation, les relations entre tables (hasMany, belongsTo...), et l’écriture de requêtes complexes.

Actions correctives mises en place :

Pour faire face à ces difficultés, j’ai mis en place plusieurs méthodes concrètes :

  • J’ai systématisé l’utilisation du debugger dans Visual Studio Code pour observer les comportements du code en temps réel.
  • J’ai pris l’habitude de consulter la documentation dès que j’étais bloquée côté BDD.
  • J’ai isolé mes tests en local pour expérimenter des modifications sans impacter l’environnement de production.
  • Enfin, j’ai appris à poser des questions techniques ciblées à mon maître de stage lorsque j’avais identifié clairement un point d’ombre, ce qui a permis des échanges plus efficaces et formateurs.

Ce processus de remise en question continue m’a permis de m’améliorer rapidement, tout en consolidant mes acquis et en respectant les bonnes pratiques du développement en équipe.

5. Bilan personnel

Ce stage de deux mois a été une immersion riche et intense dans le monde professionnel du développement web. Dès le début, j’ai dû m’adapter à un environnement technique complexe et à des outils que je découvrais, comme React, MongoDB, ainsi que la gestion d’API REST avec Postman. Grâce à l’accompagnement de mon maître de stage et à l’accès à des explications sur Udemy, j’ai pu progresser rapidement et monter en compétences sur ces technologies.

L’utilisation de la méthodologie Kanban pour organiser notre travail a été particulièrement formatrice : j’ai appris à découper le projet PlanDone en tâches précises, à suivre leur avancement via des tickets, et à communiquer régulièrement avec l’équipe. Cette expérience m’a permis de comprendre l’importance d’une bonne organisation et d’une collaboration fluide dans un projet logiciel professionnel .

Le code front-end React, notamment avec la gestion avancée des routes et des composants (comme PrivateRoute pour la sécurité), ainsi que le back-end Node.js avec la base de données MongoDB, nécessitaient une bonne compréhension des interactions entre chaque couche. J’ai donc passé beaucoup de temps à analyser le code, pour bien comprendre la logique avant d’effectuer des modifications.

Postman a été un outil précieux pour tester les endpoints et vérifier le bon fonctionnement des appels API avant l’intégration front-end.

D’un point de vue humain, cette expérience a été tout aussi enrichissante. J’ai su m’intégrer rapidement dans l’équipe grâce à ma curiosité. J’ai appris à poser des questions claires, à écouter les conseils et à ajuster mon travail en fonction des retours. J’ai aussi bénéficié d’échanges avec des collègues spécialisés en Big Data et data analysis, ce qui m’a ouvert à d’autres domaines de l’informatique et m’a donné une vision plus large de l’écosystème technologique.

Les difficultés rencontrées, comme la compréhension du code existant ou la gestion des contraintes liées à la production, m’ont poussé à développer mon autonomie. J’ai acquis des réflexes professionnels : tester chaque modification en local, effectuer des commits précis, gérer les branches Git correctement, et suivre une démarche rigoureuse pour éviter les erreurs.

En résumé, ce stage a été un véritable tremplin dans ma carrière. Il m’a permis de mettre en pratique mes connaissances, d’en acquérir de nouvelles, et surtout de comprendre le fonctionnement concret d’un projet en entreprise. Je repars avec une confiance renforcée, des compétences techniques solides, et la certitude que je peux contribuer efficacement à un projet logiciel professionnel.

Remerciements

Je tiens à remercier Monsieur BAYRAMOV, mon maître de stage, pour son encadrement bienveillant et son accompagnement tout au long de cette expérience. En plus de son rôle de dirigeant, Monsieur Bayramov a été mon maître de stage, m’accompagnant tout au long de cette expérience. Son encadrement m’a permis d’approfondir mes compétences techniques, de découvrir des méthodologies de travail professionnelles, et de développer mon autonomie sur des projets concrets et variés.

Ce stage a été une grande étape dans ma formation, et je suis reconnaissante d’avoir pu évoluer dans un environnement stimulant et riche en apprentissages.

Symfony PHP Docker Google Cloud Nginx Node.js Express Vue.js GitHub MongoDB Angular Postman