fix: handle translation with lingui

The previous method was not working so I tried a different approach.
Translation is loaded but I'm still getting warnings:
* Plurals for locale undefined aren't loaded
* Text content did not match
I can't figure how to fix them...

19 files changed, 1231 insertions, 173 deletions

diff --git a/src/i18n/en/messages.js b/src/i18n/en/messages.js
new file mode 100644
index 0000000..13e59d8
--- /dev/null
+++ b/src/i18n/en/messages.js
@@ -0,0 +1,214 @@
+/*eslint-disable*/ module.exports = {
+  messages: {
+    '1 comment': '1 comment',
+    'All fields marked with * are required.':
+      'All fields marked with * are required.',
+    'All posts in {0}': ['All posts in ', ['0']],
+    'An error occurred:': 'An error occurred:',
+    'Animations:': 'Animations:',
+    'Back to top': 'Back to top',
+    Blog: 'Blog',
+    'Blog: development, open source - {0}': [
+      'Blog: development, open source - ',
+      ['0'],
+    ],
+    'CC BY SA': 'CC BY SA',
+    'CV Front-end developer - {0}': ['CV Front-end developer - ', ['0']],
+    'Close menu': 'Close menu',
+    'Close {type}': ['Close ', ['type']],
+    Collapse: 'Collapse',
+    Comment: 'Comment',
+    Comments: 'Comments',
+    'Comments:': 'Comments:',
+    Contact: 'Contact',
+    'Contact form - {0}': ['Contact form - ', ['0']],
+    'Contact me': 'Contact me',
+    "Contact {0} through its website. All you need to do it's to fill the contact form.":
+      [
+        'Contact ',
+        ['0'],
+        " through its website. All you need to do it's to fill the contact form.",
+      ],
+    'Copied!': 'Copied!',
+    Copy: 'Copy',
+    'Created on': 'Created on',
+    'Dark theme': 'Dark theme',
+    'Discover search results for: {query}': [
+      'Discover search results for: ',
+      ['query'],
+    ],
+    'Discover the curriculum of {0}, front-end developer located in France: skills, experiences and training.':
+      [
+        'Discover the curriculum of ',
+        ['0'],
+        ', front-end developer located in France: skills, experiences and training.',
+      ],
+    "Discover the legal notice of {0}'s website.": [
+      'Discover the legal notice of ',
+      ['0'],
+      "'s website.",
+    ],
+    'Discover {0} projects. Mostly related to web development and open source.':
+      [
+        'Discover ',
+        ['0'],
+        ' projects. Mostly related to web development and open source.',
+      ],
+    "Discover {0}'s writings. He talks about web development, Linux and open source mostly.":
+      [
+        'Discover ',
+        ['0'],
+        "'s writings. He talks about web development, Linux and open source mostly.",
+      ],
+    'Download <0>CV in PDF</0>': 'Download <0>CV in PDF</0>',
+    Email: 'Email',
+    Error: 'Error',
+    'Error 404: Page not found - {0}': ['Error 404: Page not found - ', ['0']],
+    Expand: 'Expand',
+    'Failed to load.': 'Failed to load.',
+    'Filter by': 'Filter by',
+    'Find me elsewhere': 'Find me elsewhere',
+    Free: 'Free',
+    'Front-end developer': 'Front-end developer',
+    Home: 'Home',
+    'If you think this path should work, feel free to <0>contact me</0> with the necessary information so that I can fix the problem.':
+      'If you think this path should work, feel free to <0>contact me</0> with the necessary information so that I can fix the problem.',
+    'Introduction:': 'Introduction:',
+    'Last updated on': 'Last updated on',
+    'Leave a comment': 'Leave a comment',
+    'Legal notice': 'Legal notice',
+    'Legal notice - {0}': ['Legal notice - ', ['0']],
+    License: 'License',
+    'Light theme': 'Light theme',
+    Linux: 'Linux',
+    'Load more?': 'Load more?',
+    'Loading...': 'Loading...',
+    Message: 'Message',
+    Name: 'Name',
+    'No comments': 'No comments',
+    'No comments yet.': 'No comments yet.',
+    'No results found.': 'No results found.',
+    'Number of articles loaded out of the total available.':
+      'Number of articles loaded out of the total available.',
+    Off: 'Off',
+    On: 'On',
+    'Open menu': 'Open menu',
+    'Open {type}': ['Open ', ['type']],
+    'Open-source projects': 'Open-source projects',
+    'Other formats': 'Other formats',
+    'Other thematics': 'Other thematics',
+    'Other topics': 'Other topics',
+    'Page not found': 'Page not found',
+    'Please fill the form to contact me.':
+      'Please fill the form to contact me.',
+    Popularity: 'Popularity',
+    Projects: 'Projects',
+    'Projects: open-source makings - {0}': [
+      'Projects: open-source makings - ',
+      ['0'],
+    ],
+    'Published in': 'Published in',
+    'Published on:': 'Published on:',
+    'Read more': 'Read more',
+    'Read more articles about:': 'Read more articles about:',
+    'Read more here:': 'Read more here:',
+    'Reading time:': 'Reading time:',
+    'Related thematic': 'Related thematic',
+    'Related thematics': 'Related thematics',
+    'Related topic': 'Related topic',
+    'Related topics': 'Related topics',
+    Reply: 'Reply',
+    Repositories: 'Repositories',
+    Resume: 'Resume',
+    Search: 'Search',
+    'Search for a post on {0}.': ['Search for a post on ', ['0'], '.'],
+    'Search results for: {query}': ['Search results for: ', ['query']],
+    'Seen on {domainName}:': ['Seen on ', ['domainName'], ':'],
+    Send: 'Send',
+    Settings: 'Settings',
+    Share: 'Share',
+    'Share on {name}': ['Share on ', ['name']],
+    'Skip to content': 'Skip to content',
+    'Sorry, it seems that the page you are looking for does not exist.':
+      'Sorry, it seems that the page you are looking for does not exist.',
+    Subject: 'Subject',
+    Subscribe: 'Subscribe',
+    'Table of contents': 'Table of contents',
+    Technologies: 'Technologies',
+    'Technologies:': 'Technologies:',
+    'Thanks for your comment! It is now awaiting moderation.':
+      'Thanks for your comment! It is now awaiting moderation.',
+    'Thanks. Your message was successfully sent. I will answer it as soon as possible.':
+      'Thanks. Your message was successfully sent. I will answer it as soon as possible.',
+    'Thematic:': 'Thematic:',
+    Thematics: 'Thematics',
+    'Thematics:': 'Thematics:',
+    'Theme:': 'Theme:',
+    'This comment is awaiting moderation.':
+      'This comment is awaiting moderation.',
+    'Topic:': 'Topic:',
+    Topics: 'Topics',
+    'Topics:': 'Topics:',
+    'Total:': 'Total:',
+    'Updated on:': 'Updated on:',
+    'Use Ctrl+c to copy': 'Use Ctrl+c to copy',
+    'Web development': 'Web development',
+    Website: 'Website',
+    'Website:': 'Website:',
+    'Written by:': 'Written by:',
+    'You are here:': 'You are here:',
+    'about {title}': ['about ', ['title']],
+    'less than 1 minute': 'less than 1 minute',
+    'msg.search': 'Search',
+    '{0} is a front-end developer located in France. He codes and he writes mostly about web development and open-source.':
+      [
+        ['0'],
+        ' is a front-end developer located in France. He codes and he writes mostly about web development and open-source.',
+      ],
+    '{0} picture': [['0'], ' picture'],
+    '{0} stars on Github': [['0'], ' stars on Github'],
+    '{0} | Front-end developer: WordPress/React': [
+      ['0'],
+      ' | Front-end developer: WordPress/React',
+    ],
+    '{commentCount} comments': [['commentCount'], ' comments'],
+    '{current, plural, zero {# articles out of a total of {total}} one {# article out of a total of {total}} other {# articles out of a total of {total}}}':
+      [
+        [
+          'current',
+          'plural',
+          {
+            zero: ['#', ' articles out of a total of ', ['total']],
+            one: ['#', ' article out of a total of ', ['total']],
+            other: ['#', ' articles out of a total of ', ['total']],
+          },
+        ],
+      ],
+    '{date} at {time}': [['date'], ' at ', ['time']],
+    '{readingTime, plural, zero {# minutes} one {# minute} other {# minutes}}':
+      [
+        [
+          'readingTime',
+          'plural',
+          {
+            zero: ['#', ' minutes'],
+            one: ['#', ' minute'],
+            other: ['#', ' minutes'],
+          },
+        ],
+      ],
+    '{results, plural, zero {# articles} one {# article} other {# articles}}': [
+      [
+        'results',
+        'plural',
+        {
+          zero: ['#', ' articles'],
+          one: ['#', ' article'],
+          other: ['#', ' articles'],
+        },
+      ],
+    ],
+    '{title} picture': [['title'], ' picture'],
+    '{title} preview': [['title'], ' preview'],
+  },
+};
diff --git a/src/i18n/en/messages.po b/src/i18n/en/messages.po
new file mode 100644
index 0000000..bb166c8
--- /dev/null
+++ b/src/i18n/en/messages.po
@@ -0,0 +1,569 @@
+msgid ""
+msgstr ""
+"POT-Creation-Date: 2022-01-27 18:10+0100\n"
+"MIME-Version: 1.0\n"
+"Content-Type: text/plain; charset=utf-8\n"
+"Content-Transfer-Encoding: 8bit\n"
+"X-Generator: @lingui/cli\n"
+"Language: en\n"
+"Project-Id-Version: \n"
+"Report-Msgid-Bugs-To: \n"
+"PO-Revision-Date: \n"
+"Last-Translator: \n"
+"Language-Team: \n"
+"Plural-Forms: \n"
+
+#: src/components/PostMeta/PostMeta.tsx:69
+msgid "1 comment"
+msgstr "1 comment"
+
+#: src/pages/contact.tsx:118
+msgid "All fields marked with * are required."
+msgstr "All fields marked with * are required."
+
+#: src/pages/sujet/[slug].tsx:131
+#: src/pages/thematique/[slug].tsx:121
+msgid "All posts in {0}"
+msgstr "All posts in {0}"
+
+#: src/pages/contact.tsx:57
+msgid "An error occurred:"
+msgstr "An error occurred:"
+
+#: src/components/Settings/ReduceMotion/ReduceMotion.tsx:26
+msgid "Animations:"
+msgstr "Animations:"
+
+#: src/components/Footer/Footer.tsx:39
+msgid "Back to top"
+msgstr "Back to top"
+
+#: src/components/Breadcrumb/Breadcrumb.tsx:30
+#: src/components/Breadcrumb/Breadcrumb.tsx:64
+#: src/config/nav.ts:6
+#: src/pages/blog/index.tsx:85
+#: src/pages/blog/index.tsx:167
+msgid "Blog"
+msgstr "Blog"
+
+#: src/config/seo.ts:10
+msgid "Blog: development, open source - {0}"
+msgstr "Blog: development, open source - {0}"
+
+#: src/components/Icons/Copyright/Copyright.tsx:11
+msgid "CC BY SA"
+msgstr "CC BY SA"
+
+#: src/config/seo.ts:14
+msgid "CV Front-end developer - {0}"
+msgstr "CV Front-end developer - {0}"
+
+#: src/components/MainNav/MainNav.tsx:76
+msgid "Close menu"
+msgstr "Close menu"
+
+#: src/components/Buttons/ButtonToolbar/ButtonToolbar.tsx:41
+msgid "Close {type}"
+msgstr "Close {type}"
+
+#: src/components/WidgetParts/ExpandableWidget/ExpandableWidget.tsx:37
+msgid "Collapse"
+msgstr "Collapse"
+
+#: src/components/CommentForm/CommentForm.tsx:110
+msgid "Comment"
+msgstr "Comment"
+
+#: src/components/CommentsList/CommentsList.tsx:23
+msgid "Comments"
+msgstr "Comments"
+
+#: src/components/PostMeta/PostMeta.tsx:171
+msgid "Comments:"
+msgstr "Comments:"
+
+#: src/config/nav.ts:9
+#: src/pages/contact.tsx:63
+#: src/pages/contact.tsx:183
+msgid "Contact"
+msgstr "Contact"
+
+#: src/config/seo.ts:18
+msgid "Contact form - {0}"
+msgstr "Contact form - {0}"
+
+#: src/pages/index.tsx:79
+msgid "Contact me"
+msgstr "Contact me"
+
+#: src/config/seo.ts:19
+msgid "Contact {0} through its website. All you need to do it's to fill the contact form."
+msgstr "Contact {0} through its website. All you need to do it's to fill the contact form."
+
+#: src/utils/helpers/prism.ts:48
+msgid "Copied!"
+msgstr "Copied!"
+
+#: src/utils/helpers/prism.ts:47
+msgid "Copy"
+msgstr "Copy"
+
+#: src/components/ProjectSummary/ProjectSummary.tsx:42
+msgid "Created on"
+msgstr "Created on"
+
+#: src/components/Icons/Moon/Moon.tsx:11
+msgid "Dark theme"
+msgstr "Dark theme"
+
+#: src/pages/recherche/index.tsx:85
+msgid "Discover search results for: {query}"
+msgstr "Discover search results for: {query}"
+
+#: src/config/seo.ts:15
+msgid "Discover the curriculum of {0}, front-end developer located in France: skills, experiences and training."
+msgstr "Discover the curriculum of {0}, front-end developer located in France: skills, experiences and training."
+
+#: src/config/seo.ts:23
+msgid "Discover the legal notice of {0}'s website."
+msgstr "Discover the legal notice of {0}'s website."
+
+#: src/config/seo.ts:31
+msgid "Discover {0} projects. Mostly related to web development and open source."
+msgstr "Discover {0} projects. Mostly related to web development and open source."
+
+#: src/config/seo.ts:11
+msgid "Discover {0}'s writings. He talks about web development, Linux and open source mostly."
+msgstr "Discover {0}'s writings. He talks about web development, Linux and open source mostly."
+
+#: src/components/Widgets/CVPreview/CVPreview.tsx:28
+msgid "Download <0>CV in PDF</0>"
+msgstr "Download <0>CV in PDF</0>"
+
+#: src/components/CommentForm/CommentForm.tsx:91
+#: src/config/sharing.ts:61
+#: src/pages/contact.tsx:137
+msgid "Email"
+msgstr "Email"
+
+#: src/pages/404.tsx:45
+msgid "Error"
+msgstr "Error"
+
+#: src/config/seo.ts:26
+msgid "Error 404: Page not found - {0}"
+msgstr "Error 404: Page not found - {0}"
+
+#: src/components/WidgetParts/ExpandableWidget/ExpandableWidget.tsx:37
+msgid "Expand"
+msgstr "Expand"
+
+#: src/components/Widgets/RecentPosts/RecentPosts.tsx:54
+#: src/components/Widgets/ThematicsList/ThematicsList.tsx:26
+#: src/components/Widgets/TopicsList/TopicsList.tsx:26
+#: src/pages/blog/index.tsx:79
+#: src/pages/recherche/index.tsx:101
+msgid "Failed to load."
+msgstr "Failed to load."
+
+#: src/pages/blog/index.tsx:153
+msgid "Filter by"
+msgstr "Filter by"
+
+#: src/pages/contact.tsx:167
+msgid "Find me elsewhere"
+msgstr "Find me elsewhere"
+
+#: src/pages/index.tsx:64
+msgid "Free"
+msgstr "Free"
+
+#: src/config/branding.ts:5
+#: src/config/website.ts:5
+msgid "Front-end developer"
+msgstr "Front-end developer"
+
+#: src/components/Breadcrumb/Breadcrumb.tsx:23
+#: src/components/Breadcrumb/Breadcrumb.tsx:54
+#: src/config/nav.ts:5
+msgid "Home"
+msgstr "Home"
+
+#: src/pages/404.tsx:29
+msgid "If you think this path should work, feel free to <0>contact me</0> with the necessary information so that I can fix the problem."
+msgstr "If you think this path should work, feel free to <0>contact me</0> with the necessary information so that I can fix the problem."
+
+#: src/components/Widgets/Sharing/Sharing.tsx:57
+msgid "Introduction:"
+msgstr "Introduction:"
+
+#: src/components/ProjectSummary/ProjectSummary.tsx:52
+msgid "Last updated on"
+msgstr "Last updated on"
+
+#: src/components/CommentForm/CommentForm.tsx:71
+msgid "Leave a comment"
+msgstr "Leave a comment"
+
+#: src/config/nav.ts:13
+#: src/pages/mentions-legales.tsx:54
+#: src/pages/mentions-legales.tsx:80
+msgid "Legal notice"
+msgstr "Legal notice"
+
+#: src/config/seo.ts:22
+msgid "Legal notice - {0}"
+msgstr "Legal notice - {0}"
+
+#: src/components/ProjectSummary/ProjectSummary.tsx:61
+msgid "License"
+msgstr "License"
+
+#: src/components/Icons/Sun/Sun.tsx:11
+msgid "Light theme"
+msgstr "Light theme"
+
+#: src/pages/index.tsx:67
+msgid "Linux"
+msgstr "Linux"
+
+#: src/pages/blog/index.tsx:149
+#: src/pages/recherche/index.tsx:129
+msgid "Load more?"
+msgstr "Load more?"
+
+#: src/components/Spinner/Spinner.tsx:10
+msgid "Loading..."
+msgstr "Loading..."
+
+#: src/pages/contact.tsx:156
+msgid "Message"
+msgstr "Message"
+
+#: src/components/CommentForm/CommentForm.tsx:80
+#: src/pages/contact.tsx:127
+msgid "Name"
+msgstr "Name"
+
+#: src/components/PostMeta/PostMeta.tsx:67
+msgid "No comments"
+msgstr "No comments"
+
+#: src/components/CommentsList/CommentsList.tsx:27
+msgid "No comments yet."
+msgstr "No comments yet."
+
+#: src/components/PostsList/PostsList.tsx:65
+msgid "No results found."
+msgstr "No results found."
+
+#: src/components/PaginationCursor/PaginationCursor.tsx:19
+msgid "Number of articles loaded out of the total available."
+msgstr "Number of articles loaded out of the total available."
+
+#: src/components/Settings/ReduceMotion/ReduceMotion.tsx:28
+msgid "Off"
+msgstr "Off"
+
+#: src/components/Settings/ReduceMotion/ReduceMotion.tsx:27
+msgid "On"
+msgstr "On"
+
+#: src/components/MainNav/MainNav.tsx:76
+msgid "Open menu"
+msgstr "Open menu"
+
+#: src/components/Buttons/ButtonToolbar/ButtonToolbar.tsx:43
+msgid "Open {type}"
+msgstr "Open {type}"
+
+#: src/pages/cv.tsx:98
+msgid "Open-source projects"
+msgstr "Open-source projects"
+
+#: src/pages/cv.tsx:96
+msgid "Other formats"
+msgstr "Other formats"
+
+#: src/pages/thematique/[slug].tsx:128
+msgid "Other thematics"
+msgstr "Other thematics"
+
+#: src/pages/sujet/[slug].tsx:138
+msgid "Other topics"
+msgstr "Other topics"
+
+#: src/pages/404.tsx:24
+msgid "Page not found"
+msgstr "Page not found"
+
+#: src/pages/contact.tsx:64
+msgid "Please fill the form to contact me."
+msgstr "Please fill the form to contact me."
+
+#: src/components/ProjectSummary/ProjectSummary.tsx:106
+msgid "Popularity"
+msgstr "Popularity"
+
+#: src/components/Breadcrumb/Breadcrumb.tsx:39
+#: src/components/Breadcrumb/Breadcrumb.tsx:75
+#: src/config/nav.ts:7
+#: src/pages/index.tsx:31
+msgid "Projects"
+msgstr "Projects"
+
+#: src/config/seo.ts:30
+msgid "Projects: open-source makings - {0}"
+msgstr "Projects: open-source makings - {0}"
+
+#: src/components/PostsList/PostsList.tsx:35
+msgid "Published in"
+msgstr "Published in"
+
+#: src/components/Comment/Comment.tsx:71
+#: src/components/PostMeta/PostMeta.tsx:94
+#: src/components/Widgets/RecentPosts/RecentPosts.tsx:39
+msgid "Published on:"
+msgstr "Published on:"
+
+#: src/components/PostPreview/PostPreview.tsx:100
+msgid "Read more"
+msgstr "Read more"
+
+#: src/components/PostFooter/PostFooter.tsx:34
+msgid "Read more articles about:"
+msgstr "Read more articles about:"
+
+#: src/components/Widgets/Sharing/Sharing.tsx:58
+msgid "Read more here:"
+msgstr "Read more here:"
+
+#: src/components/PostMeta/PostMeta.tsx:124
+msgid "Reading time:"
+msgstr "Reading time:"
+
+#: src/components/Widgets/RelatedThematics/RelatedThematics.tsx:23
+msgid "Related thematic"
+msgstr "Related thematic"
+
+#: src/components/Widgets/RelatedThematics/RelatedThematics.tsx:23
+msgid "Related thematics"
+msgstr "Related thematics"
+
+#: src/components/Widgets/RelatedTopics/RelatedTopics.tsx:23
+msgid "Related topic"
+msgstr "Related topic"
+
+#: src/components/Widgets/RelatedTopics/RelatedTopics.tsx:23
+msgid "Related topics"
+msgstr "Related topics"
+
+#: src/components/Comment/Comment.tsx:88
+msgid "Reply"
+msgstr "Reply"
+
+#: src/components/ProjectSummary/ProjectSummary.tsx:79
+msgid "Repositories"
+msgstr "Repositories"
+
+#: src/config/nav.ts:8
+msgid "Resume"
+msgstr "Resume"
+
+#. Search page title
+#: src/components/SearchForm/SearchForm.tsx:30
+#: src/components/SearchForm/SearchForm.tsx:42
+#: src/pages/recherche/index.tsx:79
+#: src/pages/recherche/index.tsx:147
+msgid "Search"
+msgstr "Search"
+
+#: src/pages/recherche/index.tsx:86
+msgid "Search for a post on {0}."
+msgstr "Search for a post on {0}."
+
+#: src/pages/recherche/index.tsx:78
+msgid "Search results for: {query}"
+msgstr "Search results for: {query}"
+
+#: src/components/Widgets/Sharing/Sharing.tsx:66
+msgid "Seen on {domainName}:"
+msgstr "Seen on {domainName}:"
+
+#: src/components/CommentForm/CommentForm.tsx:117
+#: src/pages/contact.tsx:161
+msgid "Send"
+msgstr "Send"
+
+#: src/components/Settings/Settings.tsx:11
+msgid "Settings"
+msgstr "Settings"
+
+#: src/components/Widgets/Sharing/Sharing.tsx:105
+msgid "Share"
+msgstr "Share"
+
+#: src/components/Widgets/Sharing/Sharing.tsx:97
+msgid "Share on {name}"
+msgstr "Share on {name}"
+
+#: src/components/Layouts/Layout.tsx:94
+msgid "Skip to content"
+msgstr "Skip to content"
+
+#: src/pages/404.tsx:26
+msgid "Sorry, it seems that the page you are looking for does not exist."
+msgstr "Sorry, it seems that the page you are looking for does not exist."
+
+#: src/pages/contact.tsx:147
+msgid "Subject"
+msgstr "Subject"
+
+#: src/pages/index.tsx:85
+msgid "Subscribe"
+msgstr "Subscribe"
+
+#: src/components/Widgets/ToC/ToC.tsx:8
+msgid "Table of contents"
+msgstr "Table of contents"
+
+#: src/components/ProjectSummary/ProjectSummary.tsx:66
+msgid "Technologies"
+msgstr "Technologies"
+
+#: src/components/ProjectPreview/ProjectPreview.tsx:39
+msgid "Technologies:"
+msgstr "Technologies:"
+
+#: src/components/CommentForm/CommentForm.tsx:120
+msgid "Thanks for your comment! It is now awaiting moderation."
+msgstr "Thanks for your comment! It is now awaiting moderation."
+
+#: src/pages/contact.tsx:53
+msgid "Thanks. Your message was successfully sent. I will answer it as soon as possible."
+msgstr "Thanks. Your message was successfully sent. I will answer it as soon as possible."
+
+#: src/components/PostMeta/PostMeta.tsx:148
+msgid "Thematic:"
+msgstr "Thematic:"
+
+#: src/pages/blog/index.tsx:154
+#: src/pages/recherche/index.tsx:134
+msgid "Thematics"
+msgstr "Thematics"
+
+#: src/components/PostMeta/PostMeta.tsx:148
+msgid "Thematics:"
+msgstr "Thematics:"
+
+#: src/components/Settings/ThemeToggle/ThemeToggle.tsx:27
+msgid "Theme:"
+msgstr "Theme:"
+
+#: src/components/Comment/Comment.tsx:119
+msgid "This comment is awaiting moderation."
+msgstr "This comment is awaiting moderation."
+
+#: src/components/PostMeta/PostMeta.tsx:156
+msgid "Topic:"
+msgstr "Topic:"
+
+#: src/pages/blog/index.tsx:155
+#: src/pages/recherche/index.tsx:135
+msgid "Topics"
+msgstr "Topics"
+
+#: src/components/PostMeta/PostMeta.tsx:156
+msgid "Topics:"
+msgstr "Topics:"
+
+#: src/components/PostMeta/PostMeta.tsx:135
+msgid "Total:"
+msgstr "Total:"
+
+#: src/components/PostMeta/PostMeta.tsx:101
+msgid "Updated on:"
+msgstr "Updated on:"
+
+#: src/utils/helpers/prism.ts:49
+msgid "Use Ctrl+c to copy"
+msgstr "Use Ctrl+c to copy"
+
+#: src/pages/index.tsx:27
+msgid "Web development"
+msgstr "Web development"
+
+#: src/components/CommentForm/CommentForm.tsx:101
+msgid "Website"
+msgstr "Website"
+
+#: src/components/PostMeta/PostMeta.tsx:163
+msgid "Website:"
+msgstr "Website:"
+
+#: src/components/PostMeta/PostMeta.tsx:117
+msgid "Written by:"
+msgstr "Written by:"
+
+#: src/components/Breadcrumb/Breadcrumb.tsx:111
+msgid "You are here:"
+msgstr "You are here:"
+
+#. Post title
+#: src/components/PostPreview/PostPreview.tsx:103
+msgid "about {title}"
+msgstr "about {title}"
+
+#: src/components/PostMeta/PostMeta.tsx:77
+msgid "less than 1 minute"
+msgstr "less than 1 minute"
+
+#. Search page title
+#: src/pages/recherche/index.tsx:80
+#~ msgid "msg.search"
+#~ msgstr "Search"
+
+#: src/config/seo.ts:7
+msgid "{0} is a front-end developer located in France. He codes and he writes mostly about web development and open-source."
+msgstr "{0} is a front-end developer located in France. He codes and he writes mostly about web development and open-source."
+
+#. Branding logo.
+#: src/components/Branding/Branding.tsx:41
+msgid "{0} picture"
+msgstr "{0} picture"
+
+#: src/components/ProjectSummary/ProjectSummary.tsx:111
+msgid "{0} stars on Github"
+msgstr "{0} stars on Github"
+
+#: src/config/seo.ts:6
+msgid "{0} | Front-end developer: WordPress/React"
+msgstr "{0} | Front-end developer: WordPress/React"
+
+#: src/components/PostMeta/PostMeta.tsx:71
+msgid "{commentCount} comments"
+msgstr "{commentCount} comments"
+
+#: src/components/PaginationCursor/PaginationCursor.tsx:20
+msgid "{current, plural, zero {# articles out of a total of {total}} one {# article out of a total of {total}} other {# articles out of a total of {total}}}"
+msgstr "{current, plural, zero {# articles out of a total of {total}} one {# article out of a total of {total}} other {# articles out of a total of {total}}}"
+
+#: src/components/Comment/Comment.tsx:51
+msgid "{date} at {time}"
+msgstr "{date} at {time}"
+
+#: src/components/PostMeta/PostMeta.tsx:78
+msgid "{readingTime, plural, zero {# minutes} one {# minute} other {# minutes}}"
+msgstr "{readingTime, plural, zero {# minutes} one {# minute} other {# minutes}}"
+
+#: src/components/PostMeta/PostMeta.tsx:137
+msgid "{results, plural, zero {# articles} one {# article} other {# articles}}"
+msgstr "{results, plural, zero {# articles} one {# article} other {# articles}}"
+
+#: src/components/ProjectPreview/ProjectPreview.tsx:23
+msgid "{title} picture"
+msgstr "{title} picture"
+
+#: src/components/ProjectSummary/ProjectSummary.tsx:33
+msgid "{title} preview"
+msgstr "{title} preview"
diff --git a/src/i18n/fr/messages.js b/src/i18n/fr/messages.js
new file mode 100644
index 0000000..e06fd09
--- /dev/null
+++ b/src/i18n/fr/messages.js
@@ -0,0 +1,230 @@
+/*eslint-disable*/ module.exports = {
+  messages: {
+    '1 comment': '1 commentaire',
+    'All fields marked with * are required.':
+      'Tous les champs marqués avec une * sont requis.',
+    'All posts in {0}': ['Tous les articles dans ', ['0']],
+    'An error occurred:': 'Une erreur est survenue :',
+    'Animations:': 'Animations :',
+    'Armand Philippot is a front-end developer located in France. He codes and he writes mostly about web development and open-source.':
+      'Armand Philippot est un intégrateur web et développeur WordPress/React vivant en France. Il code et écrit surtout à propos de développement web et de libre.',
+    'Armand Philippot | Front-end developer: WordPress/React':
+      'Armand Philippot | Intégrateur web - Développeur WordPress / React',
+    'Back to top': 'Retour en haut',
+    Blog: 'Blog',
+    'Blog: development, open source - Armand Philippot':
+      'Blog : développement web, libre et open-source - Armand Philippot',
+    'Blog: development, open source - {0}': [
+      'Blog : développement web, libre et open-source - ',
+      ['0'],
+    ],
+    'CC BY SA': 'CC BY SA',
+    'CV Front-end developer - Armand Philippot':
+      'CV Intégrateur web / Développeur front-end - Armand Philippot',
+    'CV Front-end developer - {0}': [
+      'CV Intégrateur web / Développeur front-end - ',
+      ['0'],
+    ],
+    'Close menu': 'Fermer le menu',
+    'Close {type}': ['Fermer ', ['type']],
+    Collapse: 'Replier',
+    Comment: 'Commentaire',
+    Comments: 'Commentaires',
+    'Comments:': 'Commentaires :',
+    Contact: 'Contact',
+    "Contact Armand Philippot through its website. All you need to do it's to fill the contact form.":
+      'Contacter Armand Philippot à travers son site web. Il vous suffit de remplir le formulaire de contact.',
+    'Contact form - Armand Philippot':
+      'Formulaire de contact - Armand Philippot',
+    'Contact form - {0}': ['Formulaire de contact - ', ['0']],
+    'Contact me': 'Contactez-moi',
+    "Contact {0} through its website. All you need to do it's to fill the contact form.":
+      [
+        'Contacter ',
+        ['0'],
+        ' à travers son site web. Il vous suffit de remplir le formulaire de contact.',
+      ],
+    'Copied!': 'Copié !',
+    Copy: 'Copier',
+    'Created on': 'Créé le',
+    'Dark theme': 'Thème sombre',
+    'Discover search results for: {query}': [
+      'Découvrez les résultats de la recherche pour : ',
+      ['query'],
+    ],
+    'Discover the curriculum of {0}, front-end developer located in France: skills, experiences and training.':
+      [
+        "Découvrez le CV d'",
+        ['0'],
+        ', intégrateur web / développeur front-end en France: compétences, expériences et formations.',
+      ],
+    "Discover the legal notice of {0}'s website.": [
+      "Découvrez les mentions légales du site d'",
+      ['0'],
+    ],
+    'Discover {0} projects. Mostly related to web development and open source.':
+      'Découvrez les projets d{0}. Ils sont essentiellement en lien avec le développement web, le libre et lopen-source.',
+    "Discover {0}'s writings. He talks about web development, Linux and open source mostly.":
+      [
+        "Découvrez les articles d'",
+        ['0'],
+        '. Il parle de développement web, de Linux et de libre essentiellement.',
+      ],
+    'Download <0>CV in PDF</0>': 'Télécharger le <0>CV en PDF</0>',
+    Email: 'Email',
+    Error: 'Erreur',
+    'Error 404: Page not found - {0}': [
+      'Erreur 404 : Page non trouvée - ',
+      ['0'],
+    ],
+    Expand: 'Déplier',
+    'Failed to load.': 'Échec du chargement.',
+    'Filter by': 'Filtrer par',
+    'Find me elsewhere': 'Retrouvez-moi ailleurs',
+    Free: 'Libre',
+    'Front-end developer': 'Intégrateur web',
+    Home: 'Accueil',
+    'If you think this path should work, feel free to <0>contact me</0> with the necessary information so that I can fix the problem.':
+      "Si vous pensez que le chemin devrez fonctionner, n'hésitez pas à <0>me contacter</0> avec les informations nécessaires pour que je puisse corriger le problème.",
+    'Introduction:': 'Présentation :',
+    'Last updated on': 'Dernière mise à jour le',
+    'Leave a comment': 'Laisser un commentaire',
+    'Legal notice': 'Mentions légales',
+    'Legal notice - {0}': ['Mentions légales - ', ['0']],
+    License: 'Licence',
+    'Light theme': 'Thème clair',
+    Linux: 'Linux',
+    'Load more?': 'En charger plus ?',
+    'Loading...': 'Chargement...',
+    Message: 'Message',
+    Name: 'Nom',
+    'No comments': 'Aucun commentaire',
+    'No comments yet.': 'Aucun commentaire pour le moment.',
+    'No results found.': 'Aucun résultat trouvé.',
+    'Number of articles loaded out of the total available.':
+      "Nombre d'articles chargés par rapport au total disponible.",
+    Off: 'Désactiver',
+    On: 'Activer',
+    'Open menu': 'Ouvrir le menu',
+    'Open {type}': ['Ouvrir ', ['type']],
+    'Open-source projects': 'Projets open-source',
+    'Other formats': 'Autres formats',
+    'Other thematics': 'Autres thématiques',
+    'Other topics': 'Autres sujets',
+    'Page not found': 'Page non trouvée',
+    'Please fill the form to contact me.':
+      'Veuillez remplir le formulaire pour me contacter.',
+    Popularity: 'Popularité',
+    Projects: 'Projets',
+    'Projects: open-source makings - {0}': [
+      'Projets : réalisations open-source - ',
+      ['0'],
+    ],
+    'Published in': 'Publié dans',
+    'Published on:': 'Publié le :',
+    'Read more': 'Lire la suite',
+    'Read more articles about:': "Lire d'avantages d'articles à propos :",
+    'Read more here:': 'Lire la suite ici :',
+    'Reading time:': 'Temps de lecture :',
+    'Related thematic': 'Thématique liée',
+    'Related thematics': 'Thématiques liées',
+    'Related topic': 'Sujet lié',
+    'Related topics': 'Sujets liés',
+    Reply: 'Répondre',
+    Repositories: 'Dépôts',
+    Resume: 'CV',
+    Search: 'Rechercher',
+    'Search for a post on {0}.': ['Rechercher un article sur ', ['0'], '.'],
+    'Search results for: {query}': [
+      'Résultats de la recherche pour : ',
+      ['query'],
+    ],
+    'Seen on {domainName}:': ['Vu sur ', ['domainName'], ' :'],
+    Send: 'Envoyer',
+    Settings: 'Réglages',
+    Share: 'Partager',
+    'Share on {name}': ['Partager sur ', ['name']],
+    'Skip to content': 'Aller au contenu',
+    'Sorry, it seems that the page you are looking for does not exist.':
+      "Désolé, il semble que la page demandée n'existe pas.",
+    Subject: 'Sujet',
+    Subscribe: "S'abonner",
+    'Table of contents': 'Table des matières',
+    Technologies: 'Technologies',
+    'Technologies:': 'Technologies :',
+    'Thanks for your comment! It is now awaiting moderation.':
+      'Merci pour votre commentaire ! Il est maintenant en attente de modération.',
+    'Thanks. Your message was successfully sent. I will answer it as soon as possible.':
+      'Merci. Votre message a bien été envoyé. Je vous répondrai dès que possible.',
+    'Thematic:': 'Thématique :',
+    Thematics: 'Thématiques',
+    'Thematics:': 'Thématiques :',
+    'Theme:': 'Thème :',
+    'This comment is awaiting moderation.':
+      'Ce commentaire est en attente de modération.',
+    'Topic:': 'Sujet :',
+    Topics: 'Sujets',
+    'Topics:': 'Sujets :',
+    'Total:': 'Total :',
+    'Updated on:': 'Mis à jour le :',
+    'Use Ctrl+c to copy': 'Utilisez Ctrl+c pour copier',
+    'Web development': 'Développement web',
+    Website: 'Site web',
+    'Website:': 'Site web :',
+    'Written by:': 'Écrit par :',
+    'You are here:': 'Vous êtes ici :',
+    'about {title}': ['à propos de ', ['title']],
+    'less than 1 minute': "moins d'1 minute",
+    'msg.search': 'Recherche',
+    '{0} is a front-end developer located in France. He codes and he writes mostly about web development and open-source.':
+      [
+        ['0'],
+        ' est un intégrateur web / développeur front-end vivant en France. Il code et écrit essentiellement à propos de développement web et de libre.',
+      ],
+    '{0} picture': ['Image de ', ['0']],
+    '{0} stars on Github': [['0'], ' étoiles sur Github'],
+    '{0} | Front-end developer: WordPress/React': [
+      ['0'],
+      ' | Intégrateur web - Développeur WordPress / React',
+    ],
+    '{commentCount} comments': [['commentCount'], ' commentaires'],
+    '{current, plural, zero {# articles out of a total of {total}} one {# article out of a total of {total}} other {# articles out of a total of {total}}}':
+      [
+        [
+          'current',
+          'plural',
+          {
+            zero: ['#', ' article sur un total de ', ['total']],
+            one: ['#', ' article sur un total de ', ['total']],
+            other: ['#', ' articles sur un total de ', ['total']],
+          },
+        ],
+      ],
+    '{date} at {time}': [['date'], ' à ', ['time']],
+    '{readingTime, plural, zero {# minutes} one {# minute} other {# minutes}}':
+      [
+        [
+          'readingTime',
+          'plural',
+          {
+            zero: ['#', ' minute'],
+            one: ['#', ' minute'],
+            other: ['#', ' minutes'],
+          },
+        ],
+      ],
+    '{results, plural, zero {# articles} one {# article} other {# articles}}': [
+      [
+        'results',
+        'plural',
+        {
+          zero: ['#', ' article'],
+          one: ['#', ' article'],
+          other: ['#', ' articles'],
+        },
+      ],
+    ],
+    '{title} picture': ['Image de ', ['title']],
+    '{title} preview': ['Aperçu de ', ['title']],
+  },
+};
diff --git a/src/i18n/fr/messages.mo b/src/i18n/fr/messages.mo
index 4d68311..00931c7 100644
--- a/src/i18n/fr/messages.mo
+++ b/src/i18n/fr/messages.mo
diff --git a/src/i18n/fr/messages.po b/src/i18n/fr/messages.po
index 5e6d9c4..83819f5 100644
--- a/src/i18n/fr/messages.po
+++ b/src/i18n/fr/messages.po
@@ -17,15 +17,16 @@ msgstr ""
 msgid "1 comment"
 msgstr "1 commentaire"
 
-#: src/pages/contact.tsx:114
+#: src/pages/contact.tsx:118
 msgid "All fields marked with * are required."
 msgstr "Tous les champs marqués avec une * sont requis."
 
-#: src/pages/sujet/[slug].tsx:131 src/pages/thematique/[slug].tsx:121
+#: src/pages/sujet/[slug].tsx:131
+#: src/pages/thematique/[slug].tsx:121
 msgid "All posts in {0}"
 msgstr "Tous les articles dans {0}"
 
-#: src/pages/contact.tsx:53
+#: src/pages/contact.tsx:57
 msgid "An error occurred:"
 msgstr "Une erreur est survenue :"
 
@@ -33,16 +34,27 @@ msgstr "Une erreur est survenue :"
 msgid "Animations:"
 msgstr "Animations :"
 
+#~ msgid "Armand Philippot is a front-end developer located in France. He codes and he writes mostly about web development and open-source."
+#~ msgstr "Armand Philippot est un intégrateur web et développeur WordPress/React vivant en France. Il code et écrit surtout à propos de développement web et de libre."
+
+#~ msgid "Armand Philippot | Front-end developer: WordPress/React"
+#~ msgstr "Armand Philippot | Intégrateur web - Développeur WordPress / React"
+
 #: src/components/Footer/Footer.tsx:39
 msgid "Back to top"
 msgstr "Retour en haut"
 
 #: src/components/Breadcrumb/Breadcrumb.tsx:30
-#: src/components/Breadcrumb/Breadcrumb.tsx:64 src/config/nav.ts:6
-#: src/pages/blog/index.tsx:85 src/pages/blog/index.tsx:170
+#: src/components/Breadcrumb/Breadcrumb.tsx:64
+#: src/config/nav.ts:6
+#: src/pages/blog/index.tsx:85
+#: src/pages/blog/index.tsx:167
 msgid "Blog"
 msgstr "Blog"
 
+#~ msgid "Blog: development, open source - Armand Philippot"
+#~ msgstr "Blog : développement web, libre et open-source - Armand Philippot"
+
 #: src/config/seo.ts:10
 msgid "Blog: development, open source - {0}"
 msgstr "Blog : développement web, libre et open-source - {0}"
@@ -51,6 +63,9 @@ msgstr "Blog : développement web, libre et open-source - {0}"
 msgid "CC BY SA"
 msgstr "CC BY SA"
 
+#~ msgid "CV Front-end developer - Armand Philippot"
+#~ msgstr "CV Intégrateur web / Développeur front-end - Armand Philippot"
+
 #: src/config/seo.ts:14
 msgid "CV Front-end developer - {0}"
 msgstr "CV Intégrateur web / Développeur front-end - {0}"
@@ -79,15 +94,23 @@ msgstr "Commentaires"
 msgid "Comments:"
 msgstr "Commentaires :"
 
-#: src/config/nav.ts:9 src/pages/contact.tsx:59 src/pages/contact.tsx:184
+#: src/config/nav.ts:9
+#: src/pages/contact.tsx:63
+#: src/pages/contact.tsx:183
 msgid "Contact"
 msgstr "Contact"
 
+#~ msgid "Contact Armand Philippot through its website. All you need to do it's to fill the contact form."
+#~ msgstr "Contacter Armand Philippot à travers son site web. Il vous suffit de remplir le formulaire de contact."
+
+#~ msgid "Contact form - Armand Philippot"
+#~ msgstr "Formulaire de contact - Armand Philippot"
+
 #: src/config/seo.ts:18
 msgid "Contact form - {0}"
 msgstr "Formulaire de contact - {0}"
 
-#: src/pages/index.tsx:75
+#: src/pages/index.tsx:79
 msgid "Contact me"
 msgstr "Contactez-moi"
 
@@ -111,7 +134,7 @@ msgstr "Créé le"
 msgid "Dark theme"
 msgstr "Thème sombre"
 
-#: src/pages/recherche/index.tsx:87
+#: src/pages/recherche/index.tsx:85
 msgid "Discover search results for: {query}"
 msgstr "Découvrez les résultats de la recherche pour : {query}"
 
@@ -135,12 +158,13 @@ msgstr "Découvrez les articles d'{0}. Il parle de développement web, de Linux
 msgid "Download <0>CV in PDF</0>"
 msgstr "Télécharger le <0>CV en PDF</0>"
 
-#: src/components/CommentForm/CommentForm.tsx:91 src/config/sharing.ts:61
-#: src/pages/contact.tsx:133
+#: src/components/CommentForm/CommentForm.tsx:91
+#: src/config/sharing.ts:61
+#: src/pages/contact.tsx:137
 msgid "Email"
 msgstr "Email"
 
-#: src/pages/404.tsx:46
+#: src/pages/404.tsx:45
 msgid "Error"
 msgstr "Erreur"
 
@@ -155,7 +179,8 @@ msgstr "Déplier"
 #: src/components/Widgets/RecentPosts/RecentPosts.tsx:54
 #: src/components/Widgets/ThematicsList/ThematicsList.tsx:26
 #: src/components/Widgets/TopicsList/TopicsList.tsx:26
-#: src/pages/blog/index.tsx:79 src/pages/recherche/index.tsx:103
+#: src/pages/blog/index.tsx:79
+#: src/pages/recherche/index.tsx:101
 msgid "Failed to load."
 msgstr "Échec du chargement."
 
@@ -163,26 +188,28 @@ msgstr "Échec du chargement."
 msgid "Filter by"
 msgstr "Filtrer par"
 
-#: src/pages/contact.tsx:163
+#: src/pages/contact.tsx:167
 msgid "Find me elsewhere"
 msgstr "Retrouvez-moi ailleurs"
 
-#: src/pages/index.tsx:60
+#: src/pages/index.tsx:64
 msgid "Free"
 msgstr "Libre"
 
+#: src/config/branding.ts:5
 #: src/config/website.ts:5
 msgid "Front-end developer"
 msgstr "Intégrateur web"
 
 #: src/components/Breadcrumb/Breadcrumb.tsx:23
-#: src/components/Breadcrumb/Breadcrumb.tsx:54 src/config/nav.ts:5
+#: src/components/Breadcrumb/Breadcrumb.tsx:54
+#: src/config/nav.ts:5
 msgid "Home"
 msgstr "Accueil"
 
-#: src/pages/404.tsx:25
+#: src/pages/404.tsx:29
 msgid "If you think this path should work, feel free to <0>contact me</0> with the necessary information so that I can fix the problem."
-msgstr "Si vous pensez que le chemin devrez fonctionner, n'hésitez pas à <0>me contacter<0> avec les informations nécessaires pour que je puisse corriger le problème."
+msgstr "Si vous pensez que le chemin devrez fonctionner, n'hésitez pas à <0>me contacter</0> avec les informations nécessaires pour que je puisse corriger le problème."
 
 #: src/components/Widgets/Sharing/Sharing.tsx:57
 msgid "Introduction:"
@@ -196,7 +223,8 @@ msgstr "Dernière mise à jour le"
 msgid "Leave a comment"
 msgstr "Laisser un commentaire"
 
-#: src/config/nav.ts:13 src/pages/mentions-legales.tsx:54
+#: src/config/nav.ts:13
+#: src/pages/mentions-legales.tsx:54
 #: src/pages/mentions-legales.tsx:80
 msgid "Legal notice"
 msgstr "Mentions légales"
@@ -213,11 +241,12 @@ msgstr "Licence"
 msgid "Light theme"
 msgstr "Thème clair"
 
-#: src/pages/index.tsx:63
+#: src/pages/index.tsx:67
 msgid "Linux"
 msgstr "Linux"
 
-#: src/pages/blog/index.tsx:149 src/pages/recherche/index.tsx:131
+#: src/pages/blog/index.tsx:149
+#: src/pages/recherche/index.tsx:129
 msgid "Load more?"
 msgstr "En charger plus ?"
 
@@ -225,11 +254,12 @@ msgstr "En charger plus ?"
 msgid "Loading..."
 msgstr "Chargement..."
 
-#: src/pages/contact.tsx:152
+#: src/pages/contact.tsx:156
 msgid "Message"
 msgstr "Message"
 
-#: src/components/CommentForm/CommentForm.tsx:80 src/pages/contact.tsx:123
+#: src/components/CommentForm/CommentForm.tsx:80
+#: src/pages/contact.tsx:127
 msgid "Name"
 msgstr "Nom"
 
@@ -265,11 +295,11 @@ msgstr "Ouvrir le menu"
 msgid "Open {type}"
 msgstr "Ouvrir {type}"
 
-#: src/pages/cv.tsx:99
+#: src/pages/cv.tsx:98
 msgid "Open-source projects"
 msgstr "Projets open-source"
 
-#: src/pages/cv.tsx:97
+#: src/pages/cv.tsx:96
 msgid "Other formats"
 msgstr "Autres formats"
 
@@ -281,11 +311,11 @@ msgstr "Autres thématiques"
 msgid "Other topics"
 msgstr "Autres sujets"
 
-#: src/pages/404.tsx:20
+#: src/pages/404.tsx:24
 msgid "Page not found"
 msgstr "Page non trouvée"
 
-#: src/pages/contact.tsx:60
+#: src/pages/contact.tsx:64
 msgid "Please fill the form to contact me."
 msgstr "Veuillez remplir le formulaire pour me contacter."
 
@@ -294,8 +324,9 @@ msgid "Popularity"
 msgstr "Popularité"
 
 #: src/components/Breadcrumb/Breadcrumb.tsx:39
-#: src/components/Breadcrumb/Breadcrumb.tsx:75 src/config/nav.ts:7
-#: src/pages/index.tsx:27
+#: src/components/Breadcrumb/Breadcrumb.tsx:75
+#: src/config/nav.ts:7
+#: src/pages/index.tsx:31
 msgid "Projects"
 msgstr "Projets"
 
@@ -357,17 +388,19 @@ msgstr "Dépôts"
 msgid "Resume"
 msgstr "CV"
 
+#. Search page title
 #: src/components/SearchForm/SearchForm.tsx:30
 #: src/components/SearchForm/SearchForm.tsx:42
-#: src/pages/recherche/index.tsx:152
+#: src/pages/recherche/index.tsx:79
+#: src/pages/recherche/index.tsx:147
 msgid "Search"
 msgstr "Rechercher"
 
-#: src/pages/recherche/index.tsx:88
+#: src/pages/recherche/index.tsx:86
 msgid "Search for a post on {0}."
 msgstr "Rechercher un article sur {0}."
 
-#: src/pages/recherche/index.tsx:79
+#: src/pages/recherche/index.tsx:78
 msgid "Search results for: {query}"
 msgstr "Résultats de la recherche pour : {query}"
 
@@ -375,7 +408,8 @@ msgstr "Résultats de la recherche pour : {query}"
 msgid "Seen on {domainName}:"
 msgstr "Vu sur {domainName} :"
 
-#: src/components/CommentForm/CommentForm.tsx:117 src/pages/contact.tsx:157
+#: src/components/CommentForm/CommentForm.tsx:117
+#: src/pages/contact.tsx:161
 msgid "Send"
 msgstr "Envoyer"
 
@@ -395,15 +429,15 @@ msgstr "Partager sur {name}"
 msgid "Skip to content"
 msgstr "Aller au contenu"
 
-#: src/pages/404.tsx:22
+#: src/pages/404.tsx:26
 msgid "Sorry, it seems that the page you are looking for does not exist."
 msgstr "Désolé, il semble que la page demandée n'existe pas."
 
-#: src/pages/contact.tsx:143
+#: src/pages/contact.tsx:147
 msgid "Subject"
 msgstr "Sujet"
 
-#: src/pages/index.tsx:81
+#: src/pages/index.tsx:85
 msgid "Subscribe"
 msgstr "S'abonner"
 
@@ -423,7 +457,7 @@ msgstr "Technologies :"
 msgid "Thanks for your comment! It is now awaiting moderation."
 msgstr "Merci pour votre commentaire ! Il est maintenant en attente de modération."
 
-#: src/pages/contact.tsx:49
+#: src/pages/contact.tsx:53
 msgid "Thanks. Your message was successfully sent. I will answer it as soon as possible."
 msgstr "Merci. Votre message a bien été envoyé. Je vous répondrai dès que possible."
 
@@ -431,7 +465,8 @@ msgstr "Merci. Votre message a bien été envoyé. Je vous répondrai dès que p
 msgid "Thematic:"
 msgstr "Thématique :"
 
-#: src/pages/blog/index.tsx:154 src/pages/recherche/index.tsx:136
+#: src/pages/blog/index.tsx:154
+#: src/pages/recherche/index.tsx:134
 msgid "Thematics"
 msgstr "Thématiques"
 
@@ -451,7 +486,8 @@ msgstr "Ce commentaire est en attente de modération."
 msgid "Topic:"
 msgstr "Sujet :"
 
-#: src/pages/blog/index.tsx:155 src/pages/recherche/index.tsx:137
+#: src/pages/blog/index.tsx:155
+#: src/pages/recherche/index.tsx:135
 msgid "Topics"
 msgstr "Sujets"
 
@@ -471,7 +507,7 @@ msgstr "Mis à jour le :"
 msgid "Use Ctrl+c to copy"
 msgstr "Utilisez Ctrl+c pour copier"
 
-#: src/pages/index.tsx:23
+#: src/pages/index.tsx:27
 msgid "Web development"
 msgstr "Développement web"
 
@@ -501,9 +537,8 @@ msgid "less than 1 minute"
 msgstr "moins d'1 minute"
 
 #. Search page title
-#: src/pages/recherche/index.tsx:80
-msgid "msg.search"
-msgstr "Recherche"
+#~ msgid "msg.search"
+#~ msgstr "Recherche"
 
 #: src/config/seo.ts:7
 msgid "{0} is a front-end developer located in France. He codes and he writes mostly about web development and open-source."
@@ -549,21 +584,3 @@ msgstr "Image de {title}"
 #: src/components/ProjectSummary/ProjectSummary.tsx:33
 msgid "{title} preview"
 msgstr "Aperçu de {title}"
-
-#~ msgid "Armand Philippot is a front-end developer located in France. He codes and he writes mostly about web development and open-source."
-#~ msgstr "Armand Philippot est un intégrateur web et développeur WordPress/React vivant en France. Il code et écrit surtout à propos de développement web et de libre."
-
-#~ msgid "Armand Philippot | Front-end developer: WordPress/React"
-#~ msgstr "Armand Philippot | Intégrateur web - Développeur WordPress / React"
-
-#~ msgid "Blog: development, open source - Armand Philippot"
-#~ msgstr "Blog : développement web, libre et open-source - Armand Philippot"
-
-#~ msgid "CV Front-end developer - Armand Philippot"
-#~ msgstr "CV Intégrateur web / Développeur front-end - Armand Philippot"
-
-#~ msgid "Contact Armand Philippot through its website. All you need to do it's to fill the contact form."
-#~ msgstr "Contacter Armand Philippot à travers son site web. Il vous suffit de remplir le formulaire de contact."
-
-#~ msgid "Contact form - Armand Philippot"
-#~ msgstr "Formulaire de contact - Armand Philippot"
diff --git a/src/pages/404.tsx b/src/pages/404.tsx
index 2c20578..5ba7b95 100644
--- a/src/pages/404.tsx
+++ b/src/pages/404.tsx
@@ -3,7 +3,7 @@ import PostHeader from '@components/PostHeader/PostHeader';
 import { seo } from '@config/seo';
 import { t, Trans } from '@lingui/macro';
 import { NextPageWithLayout } from '@ts/types/app';
-import { loadTranslation } from '@utils/helpers/i18n';
+import { defaultLocale, loadTranslation } from '@utils/helpers/i18n';
 import { GetStaticProps, GetStaticPropsContext } from 'next';
 import Head from 'next/head';
 import Link from 'next/link';
@@ -38,16 +38,14 @@ error404.getLayout = getLayout;
 export const getStaticProps: GetStaticProps = async (
   context: GetStaticPropsContext
 ) => {
-  const translation = await loadTranslation(
-    context.locale!,
-    process.env.NODE_ENV === 'production'
-  );
-
   const breadcrumbTitle = t`Error`;
+  const { locale } = context;
+  const translation = await loadTranslation(locale || defaultLocale);
 
   return {
     props: {
       breadcrumbTitle,
+      locale,
       translation,
     },
   };
diff --git a/src/pages/_app.tsx b/src/pages/_app.tsx
index a22c616..db021f9 100644
--- a/src/pages/_app.tsx
+++ b/src/pages/_app.tsx
@@ -1,31 +1,19 @@
-import { useEffect, useRef } from 'react';
-import { useRouter } from 'next/router';
+import { useEffect } from 'react';
 import { i18n } from '@lingui/core';
 import { I18nProvider } from '@lingui/react';
 import { AppPropsWithLayout } from '@ts/types/app';
-import { initTranslation } from '@utils/helpers/i18n';
+import { activateLocale, defaultLocale, initLingui } from '@utils/helpers/i18n';
 import '../styles/globals.scss';
 import { ThemeProvider } from 'next-themes';
 
-initTranslation(i18n);
+initLingui(defaultLocale);
 
-function MyApp({ Component, pageProps }: AppPropsWithLayout) {
-  const router = useRouter();
-  const locale: string = router.locale || router.defaultLocale!;
-  const firstRender = useRef(true);
-
-  if (pageProps.translation && firstRender.current) {
-    i18n.load(locale, pageProps.translation);
-    i18n.activate(locale);
-    firstRender.current = false;
-  }
+const MyApp = ({ Component, pageProps }: AppPropsWithLayout) => {
+  const locale: string = pageProps.locale || defaultLocale;
 
   useEffect(() => {
-    if (pageProps.translation) {
-      i18n.load(locale, pageProps.translation);
-      i18n.activate(locale);
-    }
-  }, [locale, pageProps.translation]);
+    activateLocale(locale, pageProps.translation);
+  });
 
   const getLayout = Component.getLayout ?? ((page) => page);
   return (
@@ -39,6 +27,6 @@ function MyApp({ Component, pageProps }: AppPropsWithLayout) {
       </ThemeProvider>
     </I18nProvider>
   );
-}
+};
 
 export default MyApp;
diff --git a/src/pages/article/[slug].tsx b/src/pages/article/[slug].tsx
index c9aedb8..d38ff63 100644
--- a/src/pages/article/[slug].tsx
+++ b/src/pages/article/[slug].tsx
@@ -7,7 +7,7 @@ import { config } from '@config/website';
 import { getAllPostsSlug, getPostBySlug } from '@services/graphql/queries';
 import { NextPageWithLayout } from '@ts/types/app';
 import { ArticleMeta, ArticleProps } from '@ts/types/articles';
-import { loadTranslation } from '@utils/helpers/i18n';
+import { defaultLocale, loadTranslation } from '@utils/helpers/i18n';
 import { addPrismClasses, translateCopyButton } from '@utils/helpers/prism';
 import { GetStaticPaths, GetStaticProps, GetStaticPropsContext } from 'next';
 import Head from 'next/head';
@@ -162,10 +162,8 @@ interface PostParams extends ParsedUrlQuery {
 export const getStaticProps: GetStaticProps = async (
   context: GetStaticPropsContext
 ) => {
-  const translation = await loadTranslation(
-    context.locale!,
-    process.env.NODE_ENV === 'production'
-  );
+  const { locale } = context;
+  const translation = await loadTranslation(locale || defaultLocale);
   const { slug } = context.params as PostParams;
   const post = await getPostBySlug(slug);
   const breadcrumbTitle = post.title;
@@ -173,6 +171,7 @@ export const getStaticProps: GetStaticProps = async (
   return {
     props: {
       breadcrumbTitle,
+      locale,
       post,
       translation,
     },
diff --git a/src/pages/blog/index.tsx b/src/pages/blog/index.tsx
index e0d1485..0650cfb 100644
--- a/src/pages/blog/index.tsx
+++ b/src/pages/blog/index.tsx
@@ -1,4 +1,4 @@
-import { GetStaticProps } from 'next';
+import { GetStaticProps, GetStaticPropsContext } from 'next';
 import Head from 'next/head';
 import { t } from '@lingui/macro';
 import { getLayout } from '@components/Layouts/Layout';
@@ -6,7 +6,7 @@ import { seo } from '@config/seo';
 import { config } from '@config/website';
 import { NextPageWithLayout } from '@ts/types/app';
 import { BlogPageProps, PostsList as PostsListData } from '@ts/types/blog';
-import { loadTranslation } from '@utils/helpers/i18n';
+import { defaultLocale, loadTranslation } from '@utils/helpers/i18n';
 import PostsList from '@components/PostsList/PostsList';
 import useSWRInfinite from 'swr/infinite';
 import { Button } from '@components/Buttons';
@@ -161,13 +161,13 @@ const Blog: NextPageWithLayout<BlogPageProps> = ({ fallback }) => {
 
 Blog.getLayout = getLayout;
 
-export const getStaticProps: GetStaticProps = async (context) => {
-  const translation = await loadTranslation(
-    context.locale!,
-    process.env.NODE_ENV === 'production'
-  );
-  const data = await getPublishedPosts({ first: config.postsPerPage });
+export const getStaticProps: GetStaticProps = async (
+  context: GetStaticPropsContext
+) => {
   const breadcrumbTitle = t`Blog`;
+  const data = await getPublishedPosts({ first: config.postsPerPage });
+  const { locale } = context;
+  const translation = await loadTranslation(locale || defaultLocale);
 
   return {
     props: {
@@ -175,6 +175,7 @@ export const getStaticProps: GetStaticProps = async (context) => {
       fallback: {
         '/api/posts': data,
       },
+      locale,
       translation,
     },
   };
diff --git a/src/pages/contact.tsx b/src/pages/contact.tsx
index 66f4f9e..cb88b7d 100644
--- a/src/pages/contact.tsx
+++ b/src/pages/contact.tsx
@@ -5,7 +5,7 @@ import { seo } from '@config/seo';
 import { t } from '@lingui/macro';
 import { sendMail } from '@services/graphql/mutations';
 import { NextPageWithLayout } from '@ts/types/app';
-import { loadTranslation } from '@utils/helpers/i18n';
+import { defaultLocale, loadTranslation } from '@utils/helpers/i18n';
 import { GetStaticProps, GetStaticPropsContext } from 'next';
 import Head from 'next/head';
 import { FormEvent, useState } from 'react';
@@ -176,16 +176,14 @@ ContactPage.getLayout = getLayout;
 export const getStaticProps: GetStaticProps = async (
   context: GetStaticPropsContext
 ) => {
-  const translation = await loadTranslation(
-    context.locale!,
-    process.env.NODE_ENV === 'production'
-  );
-
   const breadcrumbTitle = t`Contact`;
+  const { locale } = context;
+  const translation = await loadTranslation(locale || defaultLocale);
 
   return {
     props: {
       breadcrumbTitle,
+      locale,
       translation,
     },
   };
diff --git a/src/pages/cv.tsx b/src/pages/cv.tsx
index 47093c4..85bddd6 100644
--- a/src/pages/cv.tsx
+++ b/src/pages/cv.tsx
@@ -1,7 +1,6 @@
 import { getLayout } from '@components/Layouts/Layout';
 import { seo } from '@config/seo';
 import { NextPageWithLayout } from '@ts/types/app';
-import { loadTranslation } from '@utils/helpers/i18n';
 import { GetStaticProps, GetStaticPropsContext } from 'next';
 import Head from 'next/head';
 import CVContent, { intro, meta, pdf, image } from '@content/pages/cv.mdx';
@@ -14,6 +13,7 @@ import Sidebar from '@components/Sidebar/Sidebar';
 import { AboutPage, Graph, WebPage } from 'schema-dts';
 import { config } from '@config/website';
 import { useRouter } from 'next/router';
+import { defaultLocale, loadTranslation } from '@utils/helpers/i18n';
 
 const CV: NextPageWithLayout = () => {
   const router = useRouter();
@@ -111,15 +111,14 @@ CV.getLayout = getLayout;
 export const getStaticProps: GetStaticProps = async (
   context: GetStaticPropsContext
 ) => {
-  const translation = await loadTranslation(
-    context.locale!,
-    process.env.NODE_ENV === 'production'
-  );
   const breadcrumbTitle = meta.title;
+  const { locale } = context;
+  const translation = await loadTranslation(locale || defaultLocale);
 
   return {
     props: {
       breadcrumbTitle,
+      locale,
       translation,
     },
   };
diff --git a/src/pages/index.tsx b/src/pages/index.tsx
index bc89334..ae5fe4b 100644
--- a/src/pages/index.tsx
+++ b/src/pages/index.tsx
@@ -1,10 +1,10 @@
 import type { ReactElement } from 'react';
-import { GetStaticProps } from 'next';
+import { GetStaticProps, GetStaticPropsContext } from 'next';
 import Head from 'next/head';
 import Layout from '@components/Layouts/Layout';
 import { seo } from '@config/seo';
 import { NextPageWithLayout } from '@ts/types/app';
-import { loadTranslation } from '@utils/helpers/i18n';
+import { defaultLocale, loadTranslation } from '@utils/helpers/i18n';
 import HomePageContent from '@content/pages/homepage.mdx';
 import { ButtonLink } from '@components/Buttons';
 import styles from '@styles/pages/Home.module.scss';
@@ -137,14 +137,15 @@ Home.getLayout = function getLayout(page: ReactElement) {
   return <Layout isHome={true}>{page}</Layout>;
 };
 
-export const getStaticProps: GetStaticProps = async (ctx) => {
-  const translation = await loadTranslation(
-    ctx.locale!,
-    process.env.NODE_ENV === 'production'
-  );
+export const getStaticProps: GetStaticProps = async (
+  context: GetStaticPropsContext
+) => {
+  const { locale } = context;
+  const translation = await loadTranslation(locale || defaultLocale);
 
   return {
     props: {
+      locale,
       translation,
     },
   };
diff --git a/src/pages/mentions-legales.tsx b/src/pages/mentions-legales.tsx
index ac587f0..c9d2ccd 100644
--- a/src/pages/mentions-legales.tsx
+++ b/src/pages/mentions-legales.tsx
@@ -1,7 +1,7 @@
 import { getLayout } from '@components/Layouts/Layout';
 import { seo } from '@config/seo';
 import { NextPageWithLayout } from '@ts/types/app';
-import { loadTranslation } from '@utils/helpers/i18n';
+import { defaultLocale, loadTranslation } from '@utils/helpers/i18n';
 import { GetStaticProps, GetStaticPropsContext } from 'next';
 import Head from 'next/head';
 import LegalNoticeContent, {
@@ -105,15 +105,14 @@ LegalNotice.getLayout = getLayout;
 export const getStaticProps: GetStaticProps = async (
   context: GetStaticPropsContext
 ) => {
-  const translation = await loadTranslation(
-    context.locale!,
-    process.env.NODE_ENV === 'production'
-  );
   const breadcrumbTitle = meta.title;
+  const { locale } = context;
+  const translation = await loadTranslation(locale || defaultLocale);
 
   return {
     props: {
       breadcrumbTitle,
+      locale,
       translation,
     },
   };
diff --git a/src/pages/projet/[slug].tsx b/src/pages/projet/[slug].tsx
index b6a9cf2..847f84c 100644
--- a/src/pages/projet/[slug].tsx
+++ b/src/pages/projet/[slug].tsx
@@ -11,7 +11,7 @@ import {
   Project as ProjectData,
   ProjectProps,
 } from '@ts/types/app';
-import { loadTranslation } from '@utils/helpers/i18n';
+import { defaultLocale, loadTranslation } from '@utils/helpers/i18n';
 import {
   getAllProjectsFilename,
   getProjectData,
@@ -131,17 +131,16 @@ interface ProjectParams extends ParsedUrlQuery {
 export const getStaticProps: GetStaticProps = async (
   context: GetStaticPropsContext
 ) => {
-  const translation = await loadTranslation(
-    context.locale!,
-    process.env.NODE_ENV === 'production'
-  );
   const breadcrumbTitle = '';
+  const { locale } = context;
+  const translation = await loadTranslation(locale || defaultLocale);
   const { slug } = context.params as ProjectParams;
   const project = await getProjectData(slug);
 
   return {
     props: {
       breadcrumbTitle,
+      locale,
       project,
       translation,
     },
diff --git a/src/pages/projets.tsx b/src/pages/projets.tsx
index 1a83326..4359721 100644
--- a/src/pages/projets.tsx
+++ b/src/pages/projets.tsx
@@ -6,7 +6,7 @@ import { config } from '@config/website';
 import PageContent, { meta } from '@content/pages/projects.mdx';
 import styles from '@styles/pages/Projects.module.scss';
 import { Project } from '@ts/types/app';
-import { loadTranslation } from '@utils/helpers/i18n';
+import { defaultLocale, loadTranslation } from '@utils/helpers/i18n';
 import { getSortedProjects } from '@utils/helpers/projects';
 import { GetStaticProps, GetStaticPropsContext } from 'next';
 import Head from 'next/head';
@@ -89,16 +89,15 @@ Projects.getLayout = getLayout;
 export const getStaticProps: GetStaticProps = async (
   context: GetStaticPropsContext
 ) => {
-  const translation = await loadTranslation(
-    context.locale!,
-    process.env.NODE_ENV === 'production'
-  );
   const breadcrumbTitle = meta.title;
+  const { locale } = context;
   const projects: Project[] = await getSortedProjects();
+  const translation = await loadTranslation(locale || defaultLocale);
 
   return {
     props: {
       breadcrumbTitle,
+      locale,
       projects,
       translation,
     },
diff --git a/src/pages/recherche/index.tsx b/src/pages/recherche/index.tsx
index f497ca3..7f410e8 100644
--- a/src/pages/recherche/index.tsx
+++ b/src/pages/recherche/index.tsx
@@ -7,8 +7,7 @@ import { t } from '@lingui/macro';
 import { getPublishedPosts } from '@services/graphql/queries';
 import { NextPageWithLayout } from '@ts/types/app';
 import { PostsList as PostsListData } from '@ts/types/blog';
-import { loadTranslation } from '@utils/helpers/i18n';
-import { GetStaticProps } from 'next';
+import { GetStaticProps, GetStaticPropsContext } from 'next';
 import Head from 'next/head';
 import { useRouter } from 'next/router';
 import { useEffect, useRef, useState } from 'react';
@@ -18,6 +17,7 @@ import { ThematicsList, TopicsList } from '@components/Widgets';
 import styles from '@styles/pages/Page.module.scss';
 import Spinner from '@components/Spinner/Spinner';
 import PaginationCursor from '@components/PaginationCursor/PaginationCursor';
+import { defaultLocale, loadTranslation } from '@utils/helpers/i18n';
 
 const Search: NextPageWithLayout = () => {
   const [query, setQuery] = useState('');
@@ -78,7 +78,6 @@ const Search: NextPageWithLayout = () => {
   const title = query
     ? t`Search results for: ${query}`
     : t({
-        id: 'msg.search',
         comment: 'Search page title',
         message: 'Search',
       });
@@ -143,17 +142,17 @@ const Search: NextPageWithLayout = () => {
 
 Search.getLayout = getLayout;
 
-export const getStaticProps: GetStaticProps = async (context) => {
-  const translation = await loadTranslation(
-    context.locale!,
-    process.env.NODE_ENV === 'production'
-  );
-
+export const getStaticProps: GetStaticProps = async (
+  context: GetStaticPropsContext
+) => {
   const breadcrumbTitle = t`Search`;
+  const { locale } = context;
+  const translation = await loadTranslation(locale || defaultLocale);
 
   return {
     props: {
       breadcrumbTitle,
+      locale,
       translation,
     },
   };
diff --git a/src/pages/sujet/[slug].tsx b/src/pages/sujet/[slug].tsx
index 028131b..9947758 100644
--- a/src/pages/sujet/[slug].tsx
+++ b/src/pages/sujet/[slug].tsx
@@ -3,7 +3,7 @@ import PostPreview from '@components/PostPreview/PostPreview';
 import { t } from '@lingui/macro';
 import { NextPageWithLayout } from '@ts/types/app';
 import { TopicProps, ThematicPreview } from '@ts/types/taxonomies';
-import { loadTranslation } from '@utils/helpers/i18n';
+import { defaultLocale, loadTranslation } from '@utils/helpers/i18n';
 import { GetStaticPaths, GetStaticProps, GetStaticPropsContext } from 'next';
 import { ParsedUrlQuery } from 'querystring';
 import styles from '@styles/pages/Page.module.scss';
@@ -151,10 +151,8 @@ interface PostParams extends ParsedUrlQuery {
 export const getStaticProps: GetStaticProps = async (
   context: GetStaticPropsContext
 ) => {
-  const translation = await loadTranslation(
-    context.locale!,
-    process.env.NODE_ENV === 'production'
-  );
+  const { locale } = context;
+  const translation = await loadTranslation(locale || defaultLocale);
   const { slug } = context.params as PostParams;
   const topic = await getTopicBySlug(slug);
   const breadcrumbTitle = topic.title;
@@ -162,6 +160,7 @@ export const getStaticProps: GetStaticProps = async (
   return {
     props: {
       breadcrumbTitle,
+      locale,
       topic,
       translation,
     },
diff --git a/src/pages/thematique/[slug].tsx b/src/pages/thematique/[slug].tsx
index 75f33ff..9955089 100644
--- a/src/pages/thematique/[slug].tsx
+++ b/src/pages/thematique/[slug].tsx
@@ -3,7 +3,7 @@ import PostPreview from '@components/PostPreview/PostPreview';
 import { t } from '@lingui/macro';
 import { NextPageWithLayout } from '@ts/types/app';
 import { TopicPreview, ThematicProps } from '@ts/types/taxonomies';
-import { loadTranslation } from '@utils/helpers/i18n';
+import { defaultLocale, loadTranslation } from '@utils/helpers/i18n';
 import { GetStaticPaths, GetStaticProps, GetStaticPropsContext } from 'next';
 import { ParsedUrlQuery } from 'querystring';
 import styles from '@styles/pages/Page.module.scss';
@@ -141,10 +141,8 @@ interface PostParams extends ParsedUrlQuery {
 export const getStaticProps: GetStaticProps = async (
   context: GetStaticPropsContext
 ) => {
-  const translation = await loadTranslation(
-    context.locale!,
-    process.env.NODE_ENV === 'production'
-  );
+  const { locale } = context;
+  const translation = await loadTranslation(locale || defaultLocale);
   const { slug } = context.params as PostParams;
   const thematic = await getThematicBySlug(slug);
   const breadcrumbTitle = thematic.title;
@@ -152,6 +150,7 @@ export const getStaticProps: GetStaticProps = async (
   return {
     props: {
       breadcrumbTitle,
+      locale,
       thematic,
       translation,
     },
diff --git a/src/utils/helpers/i18n.ts b/src/utils/helpers/i18n.ts
index 18f966a..4439906 100644
--- a/src/utils/helpers/i18n.ts
+++ b/src/utils/helpers/i18n.ts
@@ -1,36 +1,86 @@
-import { config } from '@config/website';
-import type { I18n } from '@lingui/core';
+import { messages as messagesEn } from '@i18n/en/messages.js';
+import { messages as messagesFr } from '@i18n/fr/messages.js';
+import { i18n, Messages } from '@lingui/core';
 import { en, fr } from 'make-plural/plurals';
 
-export interface LocaleData {
-  messages: object;
-  default: object;
-}
+type Catalog = {
+  messages: Messages;
+};
 
 export const locales = {
   en: 'English',
   fr: 'Français',
 };
 
-export const defaultLocale = config.locales.defaultLocale;
+export const defaultLocale = 'fr';
+
+/**
+ * Load the translation with the correct method depending on environment.
+ *
+ * @param {string} locale - The current locale.
+ * @returns {Promise<Messages>} The translated messages.
+ */
+export async function loadTranslation(locale: string): Promise<Messages> {
+  let catalog: Catalog;
 
-export function initTranslation(i18n: I18n): void {
-  i18n.loadLocaleData({
-    en: { plurals: en },
-    fr: { plurals: fr },
-  });
+  try {
+    if (process.env.NODE_ENV === 'production') {
+      catalog = await import(`src/i18n/${locale}/messages`);
+    } else {
+      catalog = await import(`@lingui/loader!src/i18n/${locale}/messages.po`);
+    }
+
+    return catalog.messages;
+  } catch (error) {
+    console.error('Error while loading translation.');
+    throw error;
+  }
 }
 
-export async function loadTranslation(
-  locale: string,
-  isProduction: boolean = true
-) {
-  let data: LocaleData;
-  if (isProduction) {
-    data = await import(`src/i18n/${locale}/messages`);
-  } else {
-    data = await import(`@lingui/loader!src/i18n/${locale}/messages.po`);
+/**
+ * Init lingui.
+ *
+ * @param {string} locale - The locale to activate.
+ * @param {Messages} [messages] - The compiled translation.
+ */
+export function initLingui(locale: string, messages?: Messages) {
+  try {
+    i18n.loadLocaleData({
+      en: { plurals: en },
+      fr: { plurals: fr },
+    });
+
+    if (messages) {
+      i18n.load(locale, messages);
+    } else {
+      i18n.load({
+        en: messagesEn,
+        fr: messagesFr,
+      });
+    }
+
+    i18n.activate(locale, Object.keys(locales));
+  } catch (error) {
+    console.error('Error while Lingui init.');
+    throw error;
   }
+}
 
-  return data.messages;
+/**
+ * Activate the given locale.
+ *
+ * @param {string} locale - The locale to activate.
+ * @param {Messages} messages - The compiled translation.
+ */
+export function activateLocale(currentLocale: string, messages: Messages) {
+  const locale: string = Object.keys(locales).includes(currentLocale)
+    ? currentLocale
+    : defaultLocale;
+
+  try {
+    initLingui(locale, messages);
+  } catch (error) {
+    console.error(`Error while activating ${currentLocale}`);
+    throw error;
+  }
 }