Bivwak

BNP Paribas - JuST Institute , Paris – ( Février 2024 - En cours )

Création et développement de l’application Digital Training Tool pour JuST Institute outils pour permettre aux agriculteurs sur les 5 continents d’obtenir un crédit pour effectuer leurs transitions vers une production agricole durable.

  • FRONT-END:
    • Création et optimisation d’interfaces utilisateurs avec Next.js, incluant la gestion et l’implémentation des différentes stratégies de rendu : Static Site Generation (SSG), Server-Side Rendering (SSR), et Client-Side Rendering (CSR), pour maximiser les performances et l’expérience utilisateur.

    • Implémentation de formulaires interactifs et gestion d’états complexes à l’aide d’outils tels que React Query et Context API.

    • Intégration des API back-end dans les composants front-end

    • Tests et débogage de l’interface pour s’assurer qu’elle fonctionne correctement sur tous les navigateurs et appareils

    • Optimisation des performances web : Implémentation des meilleures pratiques pour optimiser les Core Web Vitals (FCP, LCP, CLS, FID) afin d’améliorer l’expérience utilisateur et les performances de l’application Digital Training Tool et le site UPYA Connect :

      • Optimisation des images : Compression d’images avec des formats comme WebP et Lazy Loading pour réduire le temps de chargement des éléments visuels et améliorer le First Contentful Paint (FCP) et le Largest Contentful Paint (LCP).
      • Minification et regroupement des ressources : Minification des fichiers JavaScript et CSS et regroupement des ressources pour réduire le nombre de requêtes réseau, permettant d’accélérer le chargement initial de la page.
      • Mise en cache efficace : Implémentation de stratégies de cache avancées pour les ressources statiques afin de limiter les requêtes répétées vers le serveur, ce qui améliore les temps de chargement lors des visites répétées.
      • Priorisation du contenu essentiel (Critical Rendering Path) : Chargement prioritaire du contenu essentiel visible (au-dessus de la ligne de flottaison) pour améliorer la rapidité d’affichage, surtout pour le FCP et le LCP.
      • Amélioration du temps de réponse des serveurs : Optimisation des requêtes vers la base de données et déploiement de serveurs proches des utilisateurs (CDN) pour réduire les délais et améliorer le First Input Delay (FID).
      • Évitement des sauts de contenu : Gestion du dimensionnement des images et des iframes pour stabiliser l’affichage, réduisant ainsi les Cumulative Layout Shift (CLS).
  • BACK-END:
    • Développement d’API REST avec Strapi
    • Mise en place de l’authentification et gestion des sessions utilisateurs (JWT).
    • Sécurisation des routes et données échangées entre le front-end et le back-end (gestion des CORS, HTTPS, etc.)
    • Mise en place cache coté serveur
  • DESIGN UI/UX:
    • Recherches UX/UI : Étudier les besoins utilisateurs, analyser les concurrents, et définir des wireframes pour optimiser l’expérience.
    • Création d’Interfaces : Conception des maquettes haute-fidélité, en respectant les guidelines (charte graphique, typographie, etc.) et en assurant la cohérence visuelle.
    • Prototypage : Mise en place de prototypes interactifs pour tester et valider les flux utilisateurs.

Contexte: Mission free-lance

Stack: React, Node, Typescript, Git, Docker, Strapi, React Query, Figma, HTML/ CSS, Styled-Component

2024-11-28
reactnodetypescriptgitdockerstrapireact queryfigmahtml/ cssstyled-componentpointer-manipulationmemory-managementprogramming-language