## Quelques chiffres

Commençons par poser quelques chiffres : d’après [The Shift Projet](https://theshiftproject.org/wp-content/uploads/2021/03/Note-danalyse_Numerique-et-5G_30-mars-2021.pdf), en 2019, le numérique représentait 3,5% des émissions mondiales. On peut d’abord penser que cela représente une faible part mais ce chiffre est pourtant équivalent à l’empreinte carbone du trafic aérien qui est réputé pour son mauvais impact sur le climat. Et surtout, l’empreinte carbone du numérique augmente de 6% par an, ce qui veut dire qu’elle double tous les 12 ans. Les émissions carbone dues au numérique sont répartis de la manière suivante : 
- 63% pour l’utilisation de services numériques
- 37% pour la production de terminaux

Même si le développement de nouvelles fonctionnalités poussent souvent les utilisateurs à renouveler leurs appareils et donc contribue à la production de nouveaux terminaux, je vais plutôt m’intéresser ici à l’utilisation puisque c’est là que les développeurs ont un impact direct. Les émissions dues à l’utilisation du numérique sont répartis de la manière suivante :
- 60% pour les terminaux utilisateurs
- 18% pour les réseaux
- 22% pour les data center

## La Jamstack, une solution idéale ?

Comme expliqué dans mon article précédent, je me suis formé à React.js l’année dernière. Dans la foulée, j'ai découvert l'univers de la Jamstack qui consiste à pré-générer les pages sur le serveur et il ne reste plus qu’à les envoyer au client lorsqu’il visite le site.

Instinctivement, je me suis dit que cette technologie devait avoir un impact positif sur l’empreinte carbone puisqu’une fois que le client a chargé la page, il n’y a plus de requêtes envoyées au serveur. Cependant, nous avons vu plus haut que la majeure partie des émissions provient du terminal de l’utilisateur.

Cela est d’autant plus vrai avec l’utilisation des Single-Page Application où le HTML des pages est généré côté client par le JavaScript. De cette manière, on déplace donc la consommation d’énergie du serveur vers le client. Et on peut supposer que les serveurs ont un meilleur rendement que les machines des utilisateurs.

L’utilisation de la Jamstack a tout de même un impact positif grâce à l’absence de requêtes vers la base de données. Mais si l’interface utilisateur n’est pas optimisée, ce gain sera rapidement annulé. Ce n’est donc pas une solution magique mais il s’agit bien d’une bonne pratique à utiliser quand c’est possible dans une démarche globale d’éco-conception.

## Analysons la consommation de mon site

Pour aller plus loin, j’ai donc voulu tester sur un cas concret et quoi de mieux que mon propre site ? J’ai donc utilisé l’outil [GreenFrame](https://greenframe.io/) qui permet d’obtenir une estimation de l’impact carbone d’une visite sur un site.

Une visite sur mon site consomme donc 27 mg équivalent CO2, ce qui est plutôt un bon résultat. La répartition donnée par l’outil dans sa version gratuite est la suivante :
- 51% pour le CPU
- 8% pour le réseau
- 42% pour l’écran

![greenframe result.png](https://res.cloudinary.com/damqzwhnk/image/upload/v1643719366/greenframe_result_949f313b43.png)

J’ai donc deux points que je dois prioritairement améliorer : la consommation de l’écran de l’utilisateur et la consommation de son CPU.

Concernant l’écran, j’ai déjà mis en place un thème sombre qui est censé réduire la consommation des écrans utilisant la technologie OLED mais celui-ci n’est pas le thème affiché par défaut. J’ai donc défini le thème sombre en tant que thème par défaut mais ça n’a eu aucun impact sur le résultat. Il semble donc que le modèle utilisé par GreenFrame ne tienne pas compte de ce paramètre. Pour avoir un réel impact sur la consommation de l’écran, cela nécessite donc une réflexion plus profonde pour diminuer au maximum le temps passé par les visiteurs sur le site. 

Concernant le CPU, j’imagine que je pourrai améliorer mon résultat en supprimant l’animation des logos qui tombe au niveau de la première section de la page d’accueil. Cette animation utilise la librairie Matter.js et doit probablement être consommatrice d’énergie. Effectivement, la consommation du CPU est passé de 30mWh à 15mWh après cette modification, soit une diminution de moitié. J’ai finalement décidé de tout de même conserver cette animation car j’estime qu’elle apporte un plus. J’envisagerai certainement de la supprimer lorsque mon trafic atteindra plusieurs centaines de visites par mois.

## L’importance de pouvoir mesurer

Pour conclure, j’ai envie de souligner l’importance d’avoir des outils permettant de mesurer l’impact du numérique. En effet, la mesure est la base de toute action dans une démarche d’amélioration telle que celle que j’ai tentée d’appliquer dans le paragraphe précédent.

Il est également nécessaire de mesurer pour pouvoir communiquer et je pense que la communication sur les impacts de nos usages numériques est une clé pour une prise de conscience des utilisateurs et peut-être un changement des habitudes. C’est pour cette raison que j’indique dans le footer de mon site les émissions carbone provoquées par une visite sur celui-ci.

## Sources

[https://www.gatsbyjs.com/blog/static-sites-fight-climate-change/](https://www.gatsbyjs.com/blog/static-sites-fight-climate-change/)

[https://marmelab.com/blog/2020/09/21/web-developer-climate-change.html](https://marmelab.com/blog/2020/09/21/web-developer-climate-change.html)

[https://marmelab.com/blog/2020/09/22/developers-save-the-planet-the-solution.html](https://marmelab.com/blog/2020/09/22/developers-save-the-planet-the-solution.html)

[https://marmelab.com/blog/2021/03/04/argos-comparing-the-energy-consumption-of-two-web-stacks.html](https://marmelab.com/blog/2021/03/04/argos-comparing-the-energy-consumption-of-two-web-stacks.html)

[https://theshiftproject.org/wp-content/uploads/2021/03/Note-danalyse_Numerique-et-5G_30-mars-2021.pdf](https://theshiftproject.org/wp-content/uploads/2021/03/Note-danalyse_Numerique-et-5G_30-mars-2021.pdf)

En tant que développeur Web et étant sensible à la question du changement climatique, je m'intéresse forcément à l'impact des nos usages numériques sur le climat et aux bonnes pratiques pour réduire cet impact. J'ai donc voulu connaître la consommation d'énergie d'une visite sur mon site.

large_co2.png

medium_co2.png

small_co2.png

thumbnail_co2.png

co2.png

Quel est l'impact carbone de mon site ?

## Pourquoi se former sur React.js ?

Je suis développeur Web depuis ma reconversion en 2018. Jusqu'à l'année dernière, j'ai principalement développé des sites sous WordPress, d'abord en tant que salarié puis en tant que freelance depuis 2020. 

Lors de mes recherches de nouvelles missions, je me sentais limité. D'abord en terme de quantité de missions disponibles. Il y a certes beaucoup d'opportunités en création de sites WordPress (rappelons que 43% des sites fonctionnent avec WordPress) mais il y a aussi beaucoup de concurrence, ce qui fait qu'il n'est pas si simple de trouver de nouveaux clients.

Je me sentais également limité en terme de contenus des missions. Quand on regarde les missions WordPress, on trouve principalement des sites vitrines, de la maintenance ou du dépannage. Sans dénigrer ce type de missions, on tombe rapidement dans une certaine forme de routine. J’ajouterai qu’il s’agit surtout de missions de courte durée, ce qui implique de devoir chercher régulièrement des nouveaux clients et ce n’est clairement pas l’aspect que je préfère dans le métier de freelance.

J’ai donc décidé de monter en compétence en me formant sur un framework front-end. Si on réfléchit un peu, aujourd’hui, est-ce qu’on peut se dire développeur front-end sans maîtriser un des principaux frameworks (Angular, React ou Vue) ?

L’univers du développement web évolue tellement vite qu’il est de toute façon obligatoire de se former continuellement sur les nouvelles technologies. C’est d’ailleurs une des raisons qui m’ont fait choisir le freelancing, c’est la liberté de choisir sur quelle technologie je veux me former et orienter ma carrière. 

Il a donc fallu que je choisisse le framework sur lequel me former. J’ai alors effectué quelques recherches et je me suis renseigné, notamment en consultant le rapport [Malt Tech Trends 2021](https://www.malt.fr/resources/reports/tech-data-2021) qui fait le point sur les tendances des différentes technologies utilisés pour les missions sur la plateforme de freelancing Malt. 

Il en ressort que Vue est actuellement moins utilisé que React et Angular mais en forte croissance. Le plus utilisé est donc React qui est également en croissance alors que Angular semble sur le déclin. J’ajouterai que la courbe d’apprentissage d’Angular semble plus raide, au moins au début, que pour React et Vue. J’ai donc choisi de m’orienter sur React.

## Pourquoi ne pas s’autoformer ?

Il est vrai que tout le savoir nécessaire est disponible gratuitement ou presque sur internet. Avec de la méthode et de la discipline, on peut facilement s'auto-former. C'est d'ailleurs ce que j'ai fait quand j'ai entamé ma reconversion et c'est ce qui m'a permis de décrocher mon premier job de développeur Web.

Et c'est justement parce que j'ai acquis la plupart de mes connaissances tout seul que j'avais envie de les confronter avec des formateurs et d’autres apprenants. Je voulais pouvoir échanger avec les autres étudiants et avoir un retour sur mon niveau et sur les dernières bonnes pratiques de la part des formateurs. Le fait d’avoir un cadre plus formel permet aussi de progresser plus vite.

Il a donc fallu de nouveau faire un choix mais pour l’organisme de formation cette fois. Il en existe énormément qui proposent de se former au métier de développeur web avec des formations courtes entre 3 et 6 mois mais il en existe beaucoup moins qui proposent à des développeurs qui ont déjà de l’expérience de se former sur une technologie spécifique.

C’est le cas d’O’Clock qui a des parcours de spécialisation en React, API, Symfony et WordPress. En pratique, ces parcours sont proposés aux étudiants O’Clock après 4 mois de formation sur les bases du développement web mais ils sont également accessibles directement pour les personnes ayant déjà de l’expérience.

Concrètement, la formation est basée sur le principe du télé-présentiel dans une salle de cours virtuel. C’est-à-dire qu’on a les avantages d’avoir un vrai formateur en direct qui peut voir notre code et répondre à nos questions et également les avantages d’être chez soi avec des cookies et de la pâte à tartiner à volonté ! Avec l’essor du télétravail, je pense également que savoir travailler en équipe à distance est maintenant une vraie compétence valorisable.

Alors, parlons des choses qui fâchent : évidemment la formation a un coût. Dans mon cas, ça a coûté 2900€ mais c’est finançable par le CPF ou également par des organismes d’aide à la formation. Petite astuce si vous êtes indépendants dans le domaine du développement web comme moi, vous cotisez probablement à l’[AGEFICE](https://communication-agefice.fr/). Vous pouvez faire une demande de prise en charge du coût de la formation à partir du moment où vous avez cotisé plus de 10€ auprès de cet organisme.

## Mon avis sur la formation O'Clock

Au niveau du rythme de la formation, c’était globalement adapté même si parfois un peu lent pour moi mais il faut bien s’assurer que tous les étudiants suivent. Je tire d’ailleurs mon chapeau aux étudiants qui 4 mois avant cette formation n'avaient pratiquement jamais codé, faire rentrer autant de nouveaux concepts en si peu de temps dans un cerveau, c’est incroyable !

Rien à redire au niveau du formateur qui était très compétent et pédagogue, c’était parfait. Les journées sont découpées en deux parties : une partie “cours” en direct avec le formateur et une partie “challenge” le soir qui permet d’appliquer les notions apprises durant la journée.

Le deuxième mois de la formation est entièrement consacré au développement d’un projet en équipe en appliquant la méthode Scrum. Dans mon cas, il s’agissait d’une plateforme d’échange de compétences entre des mentors et des apprenants : [Mentor Me](https://www.thibault-barrat.com/projects/mentor-me). C’est une très bonne mise en situation où l’important est certainement autant le travail collaboratif sur un projet que les aspects purement techniques.

Après la formation, O’Clock permet également à ses étudiants de passer le Titre Professionnel Développeur Web et Web Mobile et la certification Opquast en “Maîtrise de la qualité en projet Web” que j’ai pu obtenir avec un score de 915 points sur 1000 attestant d’un niveau expert. 

Au final, aucun regret d’avoir fait cette formation, il reste maintenant à concrétiser en décrochant mes premières missions en React.

J'ai suivi une formation React.js dispensé par l'école O'Clock de septembre à novembre 2021. Je vais donc expliquer pourquoi j'ai voulu faire cette formation, pourquoi avec O'Clock et ce que j'en ai pensé. 

large_0x0.png

medium_0x0.png

small_0x0.png

thumbnail_0x0.png

0x0.png

Mon avis sur la formation React.js par O’Clock

Articles sur des sujets en rapport avec l'univers du développement web

large_couverture-linkedin.jpg

medium_couverture-linkedin.jpg

small_couverture-linkedin.jpg

thumbnail_couverture-linkedin.jpg

couverture-linkedin.jpg

Blog

Thibault Barrat - Développeur Web Freelance  - Nancy, Lorraine

%s | Thibault Barrat - Développeur Web Freelance  - Nancy, Lorraine

logo1-fond blanc.ico

Thibault Barrat - Développeur Web Freelance - Nancy, Lorraine

Liste de mes projets web personnels ou réalisés pour des clients.

medium_avatar-linkedin-banniere copie.png

small_avatar-linkedin-banniere copie.png

thumbnail_avatar-linkedin-banniere copie.png

avatar-linkedin-banniere copie.png

Projets

| Logo | Nom |
| ---- | ---- |
| ![Logo HTML5](https://res.cloudinary.com/damqzwhnk/image/upload/w_25,c_scale/v1637663299/544px_HTML_5_logo_resized_svg_52c765c23c.png) | HTML5 |
| ![Logo CSS3](https://res.cloudinary.com/damqzwhnk/image/upload/w_25,c_scale/v1637239234/1200px_CSS_3_logo_and_wordmark_svg_90f71bd3c6.png) | CSS3 |
| ![Logo JavaScript](https://res.cloudinary.com/damqzwhnk/image/upload/w_25,c_scale/v1637239233/Java_Script_logo_5b583eb95d.png) | JavaScript |
| ![Logo react](https://res.cloudinary.com/damqzwhnk/image/upload/w_25,c_scale/v1637241884/1200px_React_icon_svg_3011cbf2ca.png) | React.js |
| ![Logo Redux](https://res.cloudinary.com/damqzwhnk/image/upload/w_25,c_scale/v1637239340/5848309bcef1014c0b5e4a9a_7da1a7a202.png) | Redux |
| ![Logo Next.js](https://res.cloudinary.com/damqzwhnk/image/upload/w_25,c_scale/v1637239340/next_js_logo_8_FCFF_51_DD_2_seeklogo_com_c18930e63b.png) | Next.js |
| ![Logo WordPress](https://res.cloudinary.com/damqzwhnk/image/upload/w_25,c_scale/v1637239341/Word_Press_logotype_simplified_bb96690b13.png) | WordPress |
| ![Logo Git](https://res.cloudinary.com/damqzwhnk/image/upload/w_25,c_scale/v1637239340/5847f981cef1014c0b5e48be_dbb9becd1d.png) | Git |




Compétences

**Certification Maîtrise de la qualité en projet web (niveau Expert)** - Opquast  
2021

**Formation React.js** - Ecole O'clock  
2021

**HTML5/CSS3** - OpenClassrooms  
**JavaScript** - OpenClassrooms  
**Git/GitHub** - OpenClassrooms  
**Animations CSS** - OpenClassrooms  
2020

**Ingénieur généraliste** - Polytech Nancy  
2011




Diplômes & Certifications

**Développeur Web Freelance**  
2020 - Actuellement

**Webmaster** - Harmonie Mutuelle  
2018 - 2020

**Chef de Projet** - Goupe Fives, Separex, ER Ingenierie  
2012 - 2018

Expérience

Passionné depuis toujours par le monde du numérique, j’ai décidé de me reconvertir dans ce domaine après avoir obtenu un diplôme d'ingénieur généraliste et occupé des postes de Chef de Projet dans l'industrie. Je suis donc Développeur Web depuis 2018, d'abord au sein d'Harmonie Mutuelle, et maintenant en tant que Freelance. Mon expérience professionnelle me permettra d’être à votre écoute afin d’analyser et de définir clairement vos besoins. Je sais également que la réactivité est un point important pour vous, je mettrai donc un point d’honneur à répondre rapidement à toute question ou demande.

A propos de moi

Vous trouverez ici mes articles sur des sujets en rapport avec l'univers du développement web.

Vous cherchez un freelance pour travailler sur un de vos projets ? Discutons-en !
Vous pouvez me contacter via mes coordonnés ou via le formulaire de contact ci-dessous.

Contact

Bonjour

Je m'appelle Thibault Barrat

Je suis

large_photo détouré.png

medium_photo détouré.png

small_photo détouré.png

thumbnail_photo détouré.png

photo détouré.png

Voici la liste de mes projets web personnels ou réalisés pour des clients.

Mes projets

Vous trouverez ci-dessous les services que je peux proposer. Dans tous les cas, n'hésitez pas à me contacter pour discuter en détails de la faisabilité de votre projet et obtenir un devis (gratuit).

- Intégration d'une maquette fournie
- HTML5 / CSS3
- Possibilité d'intégration dans un thème WordPress



Intégration web

- Développé sous WordPress ou Strapi/Next.js
- Choix du thème graphique parmi une sélection
- Site responsive
- Intégration des contenus (textes & images) fournis
- Formulaire de contact
- Mise en place des statistiques Google Analytics
- Mise en ligne
- Formation à l'utilisation du site

Site vitrine standard

- Développé sous WordPress ou Strapi/Next.js
- Développement d'un thème graphique personnalisé
- Site responsive
- Intégration des contenus (textes & images) fournis
- Formulaire de contact
- Mise en place des statistiques Google Analytics
- Mise en ligne
- Formation à l'utilisation du site

Site vitrine personnalisé

- Développé sous WordPress avec Woocommerce ou Strapi/Next.js avec Snipcart
- Développement d'un thème graphique personnalisé
- Site responsive
- Intégration des contenus (textes & images) fournis
- Formulaire de contact
- Mise en place des statistiques Google Analytics
- Mise en ligne
- Formation à l'utilisation du site

Site e-commerce

- Complètement sur-mesure
- Possibilité de développer des applications web avec React & Redux

Développements spécifiques

Mes services

## Fonctionnalités
Il s'agit d'une section "commentaires" où le visiteur peut augmenter ou diminuer le score des commentaires.  
Pour écrire un commentaire ou répondre à un commentaire, il doit créer un compte et se connecter.  
Il a également la possibilité de supprimer ou d'éditer ses commentaires.

![Comments section screenshot{1777x1134}](https://res.cloudinary.com/damqzwhnk/image/upload/v1644574900/Firefox_Screenshot_2022_02_11_T08_56_18_148_Z_3f00aa9540.png)

## Technologies utilisées
Pour ce projet, j'ai utilisé pour la première fois TypeScript pour développer la partie front-end avec React.js. Étant donné qu'il s'agit d'un petit projet, j'ai choisi de ne pas utiliser Redux pour gérer le state. A la place, j'ai tulisé les hooks React `useContext` et `useReducer`.  
Concernant le back-end, il s'agit d'une API REST développé avec ExpressJS couplée avec une base de données PostgreSQL.  
La partie authentification utilise les JSON Web Token avec un accessToken et un refreshToken.

Développement du back-end et du front-end d'une section commentaires selon un design fourni par Frontend Mentor.

large_Firefox_Screenshot_2022-02-11T09-37-51.323Z.png

medium_Firefox_Screenshot_2022-02-11T09-37-51.323Z.png

small_Firefox_Screenshot_2022-02-11T09-37-51.323Z.png

thumbnail_Firefox_Screenshot_2022-02-11T09-37-51.323Z.png

Firefox_Screenshot_2022-02-11T09-37-51.323Z.png

Comments section

Il s'agit du projet réalisé à la fin de la formation React.js que j'ai suivi au sein de l'école O'clock. Il a été réalisé avec 4 autres étudiants pendant 4 semaines avec la répartition suivante : 3 développeurs front-end et 2 développeurs back-end.

![Capture d'écran du site Mentor Me{1905x942}](https://res.cloudinary.com/damqzwhnk/image/upload/v1639058156/Firefox_Screenshot_2021_12_09_T13_41_15_888_Z_ffd4fce464.png)

## Fonctionnalités
Un utilisateur qui souhaite devenir mentor et proposer un cours dans une compétence donnée ou suivre un cours proposé par un autre mentor peut s'inscrire sur le site.  
Lorsqu'il se connecte, il a la possibilité d'effectuer une recherche parmi les cours proposés, de proposer un nouveau cours ou bien d'ajouter certains cours à ses favoris pour y les retrouver facilement.  
Depuis sa page profil, il a la possibilité de voir et supprimer ses favoris, de supprimer les cours qu'il a lui même proposé et également de mettre à jour les données de son profil.  
Il y a également une gestion des droits, avec un rôle "administrateur" qui valide les cours proposés avant qu'ils soient visible sur le site et qui a la possibilité de supprimer tous les cours et tous les utilisateurs.

## Technologies utilisés
Concernant la partie back-end, il s'agit d'une API REST créée avec une basse de données PostgreSQL et le framework ExpressJS.  
Pour la partie front-end, nous avons utilisé React.js couplé avec Redux pour la gestion des actions, des appels à l'API et du store. Nous avons également implémenté la librairie Leaflet pour localiser sur une carte les cours proposés.  
L'authentification des utilisateurs est assurée par les JWT avec un accessToken stocké dans le state de l'application qui permet d'authentifier les requêtes et un refreshToken stocké dans le localStorage qui permet de conserver l'utilisateur connecté et de récupérer un nouveau accessToken.

## Présentation Youtube
Ce projet a fait l'objet d'une présentation Youtube d'une quinzaine de minutes disponible [en cliquant ici](https://youtu.be/2S5FSWNPA5g?t=4591).


Développement d'une plateforme d'échanges de compétence gratuite.

large_banniere-mentor-me.png

medium_banniere-mentor-me.png

small_banniere-mentor-me.png

thumbnail_banniere-mentor-me.png

banniere-mentor-me.png

Mentor Me

Il s'agit du portfolio que vous consultez actuellement. J'ai décidé de refaire complètement mon portfolio en 2021 pour deux principales raisons :
- l'ancien portfolio ne me convenait plus au niveau du design et des technologies utilisés (jQuery et bootstrap notamment)
- je souhaitais ajouter une section blog me permettant de publier régulièrement des articles
## Technologies utilisés
Ce nouveau portfolio a également été l'occasion de mettre en pratique une partie de ce que j'ai pu apprendre lors de ma formation React.js. En revanche, j'ai voulu utiliser un framework et non directement React pour profiter des gains en SEO apportés par l'utilisation des deux principaux frameworks React (Next.js et Gatsby) et également des gains de performances apportés par la génération de sites statiques. Après avoir comparé Gatsby et Next.js, mon choix s'est finalement porté sur Next.js.

En ce qui concerne la partie backend, mon souhait d'avoir une section blog implique fortement l'utilisation d'un CMS headless. Mon choix s'est porté sur Strapi, qui a été assez facile à mettre en place et configurer.
## Ce que ce projet m'a appris
D'abord, à travers ce projet, j'ai découvert Strapi et Next.js que je pense réutiliser pour d'autres projets. Cette approche me semble bien plus adapté au web moderne en terme de performances, sécurité, expérience utilisateur et expérience développeur comparé à des solutions basées sur WordPress.  
Plus précisément, les petits challenges de ce projet ont été l'utilisation de la librairie Matter.js pour créer les logos HTML, CSS, JS et React qui tombent et qui interagissent avec la souris dans la première section de la page d'accueil et également la mise en place d'un dark thème qui était une première pour moi.

![Capture d'écran de la première section de la page d'accueil{1893x699}](https://res.cloudinary.com/damqzwhnk/image/upload/v1637761806/Firefox_Screenshot_2021_11_24_T13_49_13_047_Z_4343db05f8.png)

## Les futures évolutions
Dans le futur, j'aimerai mettre en place le plugin internationalisation proposé par Strapi afin de mettre à disposition une version anglophone de mon site. Mais cela nécessite d'abord un gros travail de traduction de tous les contenus donc ce ne sera pas fait dans l'immédiat.

[UPDATE 10 Décembre 2021] La fonctionnalité d'internationalisation a été implémentée, vous pouvez maintenant choisir entre les versions anglaise et française du site.



Développement de mon portfolio avec une nouvelle partie blog et la mise en application des connaissances acquises lors de ma formation React.js

Portfolio

L'objectif de ce projet était de partir d'un thème WordPress existant, en l'occurence le thème [Bridge](https://bridge250.qodeinteractive.com/) et de le personnaliser afin d'être conforme à la charte graphique du client et également cohérent avec les contenus du site.  
Ce projet m'a également permis de tester l'utilisation du plugin WPML pour mettre en place les versions multilingues des contenus.

![Capture d'écran du site heem.lu{1905x942}](https://res.cloudinary.com/damqzwhnk/image/upload/v1637612914/Firefox_Screenshot_2021_11_22_T20_25_37_881_Z_1d3188d392.png)



Personnalisation d'un thème WordPress et mise en place de l'internationalisation pour une société de services à la personne

large_Firefox_Screenshot_2021-11-23T10-44-29.386Z.png

medium_Firefox_Screenshot_2021-11-23T10-44-29.386Z.png

small_Firefox_Screenshot_2021-11-23T10-44-29.386Z.png

thumbnail_Firefox_Screenshot_2021-11-23T10-44-29.386Z.png

Firefox_Screenshot_2021-11-23T10-44-29.386Z.png

Heem

L'objectif de ce projet était de créer un thème WordPress complètement sur mesure selon le design fourni par le client. Ce qui a été intéressant dans ce travail, c'est surtout la construction du design qui est minimaliste et moderne et qui, bien qu'il s'agisse d'un site sous WordPress, a le même comportement qu'une Single-Page Application.  
C'est à dire que l'arrière plan du site est constitué d'un carrousel présentant différents design de salle de bains et la navigation entre les différentes pages ne recharge pas la page mais va modifier le contenu affiché dans l'onglet qui s'ouvre à droite de la page.  
La mise en place de cette fonctionnalité a été facilité par l'utilisation d'une librairie JavaScript : [Pjax](https://github.com/MoOx/pjax)

![Capture d'écran du site New Bath{1920x942}](https://res.cloudinary.com/damqzwhnk/image/upload/v1637762642/Firefox_Screenshot_2021_11_24_T13_56_45_641_Z_cc7543a1be.png)



Développement d'un thème WordPress sur mesure pour une entreprise spécialisée dans la conception de salle de bains

Bonjour Je m'appelle Thibault Barrat Je suis |