From 951e35b56be7fa96e6967d78e472afb81b1b78da Mon Sep 17 00:00:00 2001 From: romrosmay <99548008+romrosmay@users.noreply.github.com> Date: Sat, 12 Aug 2023 20:34:01 +0200 Subject: [PATCH 1/4] feat(lang): adding multilanguage support --- .env.example | 10 + components/BuiltWith.tsx | 7 +- components/DevIcon.tsx | 2 +- components/Footer.tsx | 6 +- components/Header.tsx | 60 +-- components/LanguageSwitcher.tsx | 89 +++++ components/MobileNav.tsx | 22 +- components/PageTitle.tsx | 2 +- components/Pagination.tsx | 12 +- components/PostListItem.tsx | 8 +- components/PostsSearch.tsx | 6 +- components/ProfileCard.tsx | 4 +- components/ProfileInfo.tsx | 7 +- components/ProjectCard.tsx | 6 +- components/SEO.tsx | 11 +- components/SocialButtons.tsx | 71 ++-- components/ToC.tsx | 92 +++++ components/ViewCounter.tsx | 9 +- components/blog/BlogHeader.tsx | 6 +- components/blog/BlogMeta.tsx | 9 +- components/homepage/BlogLinks.tsx | 15 +- components/homepage/FeaturedPosts.tsx | 7 +- components/homepage/Greeting.tsx | 6 +- components/homepage/Heading.tsx | 9 +- components/homepage/ShortDescription.tsx | 12 +- components/homepage/TypedBios.tsx | 43 +-- data/authors/default.mdx | 108 ------ data/ca/authors/default.mdx | 108 ++++++ data/{ => ca}/authors/resume.mdx | 0 data/{ => ca}/blog/DRAFT.mdx | 0 ...image-with-srcset-and-sizes-attributes.mdx | 0 ...nd-config-website-on-name-cheap-part-1.mdx | 0 ...and-config-website-on-namecheap-part-2.mdx | 0 .../blog/drag-n-drop-api-keynotes.mdx | 0 ...embed-script-using-github-and-jsdelivr.mdx | 0 ...claration-vs-function-expression-in-js.mdx | 0 data/{ => ca}/blog/git-notes.mdx | 0 ...from-a-junior-developer-to-a-developer.mdx | 0 ...te-tailwind-css-with-react-application.mdx | 0 ...to-committing-with-conventional-commit.mdx | 0 .../blog/nodejs-fetch-json-with-https.mdx | 0 ...ft-while-show-hide-scrollbar-on-window.mdx | 0 ...locking-css-and-chrome-performance-api.mdx | 68 ++++ .../blog/set-up-path-aliases-in-nodejs.mdx | 0 ...-to-new-store-with-file-api-and-nodejs.mdx | 0 .../shopify-section-rendering-apis-notes.mdx | 0 .../tricky-use-case-of-array-map-in-js.mdx | 0 .../blog/use-https-in-local-development.mdx | 0 .../blog/viec-tim-dev-nhu-the-nao-part-2.mdx | 0 .../blog/viec-tim-dev-nhu-the-nao.mdx | 0 data/ca/projectsData.ts | 101 +++++ data/ca/snippets/SAMPLE.mdx | 19 + .../adding-or-substracting-days-in-liquid.mdx | 43 +++ data/ca/snippets/casing-utils.mdx | 96 +++++ data/ca/snippets/color-validator.mdx | 61 +++ ...eep-remove-falsy-values-from-an-object.mdx | 78 ++++ data/ca/snippets/event-emitter.mdx | 75 ++++ ...nd-kill-process-on-given-port-in-macos.mdx | 56 +++ ...display-nowplaying-tracks-on-your-site.mdx | 159 ++++++++ ...gitignore-ignore-directory-keep-1-file.mdx | 23 ++ .../snippets/markdown-code-block-syntax.mdx | 126 +++++++ .../read-all-file-names-inside-a-folder.mdx | 39 ++ ...me-a-case-sensitive-file-in-a-git-repo.mdx | 34 ++ data/ca/snippets/use-async.mdx | 102 +++++ data/ca/snippets/use-local-storage-state.mdx | 32 ++ data/ca/snippets/useful-array-utilities.mdx | 23 ++ .../verify-github-webhooks-requests.mdx | 72 ++++ data/ca/snippets/vnese-to-plain-english.mdx | 37 ++ data/en/authors/default.mdx | 109 ++++++ data/en/authors/resume.mdx | 199 ++++++++++ data/en/blog/DRAFT.mdx | 17 + ...image-with-srcset-and-sizes-attributes.mdx | 131 +++++++ ...nd-config-website-on-name-cheap-part-1.mdx | 110 ++++++ ...and-config-website-on-namecheap-part-2.mdx | 125 +++++++ data/en/blog/drag-n-drop-api-keynotes.mdx | 136 +++++++ ...embed-script-using-github-and-jsdelivr.mdx | 109 ++++++ ...claration-vs-function-expression-in-js.mdx | 141 +++++++ data/en/blog/git-notes.mdx | 348 ++++++++++++++++++ ...from-a-junior-developer-to-a-developer.mdx | 202 ++++++++++ ...te-tailwind-css-with-react-application.mdx | 197 ++++++++++ ...to-committing-with-conventional-commit.mdx | 170 +++++++++ data/en/blog/nodejs-fetch-json-with-https.mdx | 96 +++++ ...ft-while-show-hide-scrollbar-on-window.mdx | 102 +++++ ...locking-css-and-chrome-performance-api.mdx | 0 .../en/blog/set-up-path-aliases-in-nodejs.mdx | 117 ++++++ ...-to-new-store-with-file-api-and-nodejs.mdx | 205 +++++++++++ .../shopify-section-rendering-apis-notes.mdx | 158 ++++++++ .../tricky-use-case-of-array-map-in-js.mdx | 185 ++++++++++ .../blog/use-https-in-local-development.mdx | 248 +++++++++++++ .../blog/viec-tim-dev-nhu-the-nao-part-2.mdx | 125 +++++++ data/en/blog/viec-tim-dev-nhu-the-nao.mdx | 138 +++++++ data/{ => en}/projectsData.ts | 0 data/en/snippets/SAMPLE.mdx | 19 + .../adding-or-substracting-days-in-liquid.mdx | 43 +++ data/en/snippets/casing-utils.mdx | 96 +++++ data/en/snippets/color-validator.mdx | 61 +++ ...eep-remove-falsy-values-from-an-object.mdx | 78 ++++ data/en/snippets/event-emitter.mdx | 75 ++++ ...nd-kill-process-on-given-port-in-macos.mdx | 56 +++ ...display-nowplaying-tracks-on-your-site.mdx | 159 ++++++++ ...gitignore-ignore-directory-keep-1-file.mdx | 23 ++ .../snippets/markdown-code-block-syntax.mdx | 126 +++++++ .../read-all-file-names-inside-a-folder.mdx | 39 ++ ...me-a-case-sensitive-file-in-a-git-repo.mdx | 34 ++ data/en/snippets/use-async.mdx | 102 +++++ data/en/snippets/use-local-storage-state.mdx | 32 ++ data/en/snippets/useful-array-utilities.mdx | 23 ++ .../verify-github-webhooks-requests.mdx | 72 ++++ data/en/snippets/vnese-to-plain-english.mdx | 37 ++ data/es/authors/default.mdx | 109 ++++++ data/es/authors/resume.mdx | 205 +++++++++++ data/es/blog/DRAFT.mdx | 17 + ...image-with-srcset-and-sizes-attributes.mdx | 131 +++++++ ...nd-config-website-on-name-cheap-part-1.mdx | 110 ++++++ ...and-config-website-on-namecheap-part-2.mdx | 125 +++++++ data/es/blog/drag-n-drop-api-keynotes.mdx | 136 +++++++ ...embed-script-using-github-and-jsdelivr.mdx | 109 ++++++ ...claration-vs-function-expression-in-js.mdx | 141 +++++++ data/es/blog/git-notes.mdx | 348 ++++++++++++++++++ ...from-a-junior-developer-to-a-developer.mdx | 202 ++++++++++ ...te-tailwind-css-with-react-application.mdx | 197 ++++++++++ ...to-committing-with-conventional-commit.mdx | 170 +++++++++ data/es/blog/nodejs-fetch-json-with-https.mdx | 96 +++++ ...ft-while-show-hide-scrollbar-on-window.mdx | 102 +++++ ...locking-css-and-chrome-performance-api.mdx | 174 +++++++++ .../es/blog/set-up-path-aliases-in-nodejs.mdx | 117 ++++++ ...-to-new-store-with-file-api-and-nodejs.mdx | 205 +++++++++++ .../shopify-section-rendering-apis-notes.mdx | 158 ++++++++ .../tricky-use-case-of-array-map-in-js.mdx | 185 ++++++++++ .../blog/use-https-in-local-development.mdx | 248 +++++++++++++ .../blog/viec-tim-dev-nhu-the-nao-part-2.mdx | 125 +++++++ data/es/blog/viec-tim-dev-nhu-the-nao.mdx | 138 +++++++ data/es/projectsData.ts | 101 +++++ data/es/snippets/SAMPLE.mdx | 19 + .../adding-or-substracting-days-in-liquid.mdx | 43 +++ data/es/snippets/casing-utils.mdx | 96 +++++ data/es/snippets/color-validator.mdx | 61 +++ ...eep-remove-falsy-values-from-an-object.mdx | 78 ++++ data/es/snippets/event-emitter.mdx | 75 ++++ ...nd-kill-process-on-given-port-in-macos.mdx | 56 +++ ...display-nowplaying-tracks-on-your-site.mdx | 159 ++++++++ ...gitignore-ignore-directory-keep-1-file.mdx | 23 ++ .../snippets/markdown-code-block-syntax.mdx | 126 +++++++ .../read-all-file-names-inside-a-folder.mdx | 39 ++ ...me-a-case-sensitive-file-in-a-git-repo.mdx | 34 ++ data/es/snippets/use-async.mdx | 102 +++++ data/es/snippets/use-local-storage-state.mdx | 32 ++ data/es/snippets/useful-array-utilities.mdx | 23 ++ .../verify-github-webhooks-requests.mdx | 72 ++++ data/es/snippets/vnese-to-plain-english.mdx | 37 ++ data/headerNavLinks.ts | 10 +- data/siteMetadata.ts | 8 - hooks/useLocale.tsx | 9 + layouts/AuthorLayout.tsx | 11 +- layouts/ListLayout.tsx | 9 +- layouts/PostSimple.tsx | 8 +- layouts/ResumeLayout.module.css | 18 + layouts/ResumeLayout.tsx | 36 +- libs/files.ts | 18 +- libs/generate-rss.ts | 27 +- libs/mdx.ts | 23 +- libs/remark-toc-heading.ts | 60 ++- next-i18next.config.js | 6 + next.config.js | 19 +- package-lock.json | 300 ++++++++++++++- package.json | 6 +- pages/404.tsx | 21 +- pages/_app.tsx | 6 +- pages/_document.tsx | 2 +- pages/about.tsx | 9 +- pages/blog.tsx | 25 +- pages/blog/[...slug].tsx | 62 +++- pages/blog/page/[page].tsx | 41 ++- pages/index.tsx | 26 +- pages/projects.tsx | 34 +- pages/resume.tsx | 12 +- pages/snippets/[...slug].tsx | 35 +- pages/snippets/index.tsx | 16 +- pages/tags.tsx | 15 +- pages/tags/[tag].tsx | 44 ++- public/locales/ca/common.json | 106 ++++++ public/locales/en/common.json | 106 ++++++ public/locales/es/common.json | 106 ++++++ tailwind.config.js | 27 +- types/layout.ts | 3 +- types/mdx.ts | 3 +- types/server.ts | 11 +- utils/date.ts | 6 +- 188 files changed, 12022 insertions(+), 420 deletions(-) create mode 100644 components/LanguageSwitcher.tsx create mode 100644 components/ToC.tsx delete mode 100644 data/authors/default.mdx create mode 100644 data/ca/authors/default.mdx rename data/{ => ca}/authors/resume.mdx (100%) rename data/{ => ca}/blog/DRAFT.mdx (100%) rename data/{ => ca}/blog/better-responsive-image-with-srcset-and-sizes-attributes.mdx (100%) rename data/{ => ca}/blog/deploy-and-config-website-on-name-cheap-part-1.mdx (100%) rename data/{ => ca}/blog/deploy-and-config-website-on-namecheap-part-2.mdx (100%) rename data/{ => ca}/blog/drag-n-drop-api-keynotes.mdx (100%) rename data/{ => ca}/blog/embed-script-using-github-and-jsdelivr.mdx (100%) rename data/{ => ca}/blog/function-declaration-vs-function-expression-in-js.mdx (100%) rename data/{ => ca}/blog/git-notes.mdx (100%) rename data/{ => ca}/blog/goodbye-bravebits-from-a-junior-developer-to-a-developer.mdx (100%) rename data/{ => ca}/blog/integrate-tailwind-css-with-react-application.mdx (100%) rename data/{ => ca}/blog/introduction-to-committing-with-conventional-commit.mdx (100%) rename data/{ => ca}/blog/nodejs-fetch-json-with-https.mdx (100%) rename data/{ => ca}/blog/prevent-layout-shift-while-show-hide-scrollbar-on-window.mdx (100%) create mode 100644 data/ca/blog/render-blocking-css-and-chrome-performance-api.mdx rename data/{ => ca}/blog/set-up-path-aliases-in-nodejs.mdx (100%) rename data/{ => ca}/blog/shopify-migrate-files-to-new-store-with-file-api-and-nodejs.mdx (100%) rename data/{ => ca}/blog/shopify-section-rendering-apis-notes.mdx (100%) rename data/{ => ca}/blog/tricky-use-case-of-array-map-in-js.mdx (100%) rename data/{ => ca}/blog/use-https-in-local-development.mdx (100%) rename data/{ => ca}/blog/viec-tim-dev-nhu-the-nao-part-2.mdx (100%) rename data/{ => ca}/blog/viec-tim-dev-nhu-the-nao.mdx (100%) create mode 100644 data/ca/projectsData.ts create mode 100644 data/ca/snippets/SAMPLE.mdx create mode 100644 data/ca/snippets/adding-or-substracting-days-in-liquid.mdx create mode 100644 data/ca/snippets/casing-utils.mdx create mode 100644 data/ca/snippets/color-validator.mdx create mode 100644 data/ca/snippets/deep-remove-falsy-values-from-an-object.mdx create mode 100644 data/ca/snippets/event-emitter.mdx create mode 100644 data/ca/snippets/find-and-kill-process-on-given-port-in-macos.mdx create mode 100644 data/ca/snippets/getting-spotify-token-to-display-nowplaying-tracks-on-your-site.mdx create mode 100644 data/ca/snippets/gitignore-ignore-directory-keep-1-file.mdx create mode 100644 data/ca/snippets/markdown-code-block-syntax.mdx create mode 100644 data/ca/snippets/read-all-file-names-inside-a-folder.mdx create mode 100644 data/ca/snippets/rename-a-case-sensitive-file-in-a-git-repo.mdx create mode 100644 data/ca/snippets/use-async.mdx create mode 100644 data/ca/snippets/use-local-storage-state.mdx create mode 100644 data/ca/snippets/useful-array-utilities.mdx create mode 100644 data/ca/snippets/verify-github-webhooks-requests.mdx create mode 100644 data/ca/snippets/vnese-to-plain-english.mdx create mode 100644 data/en/authors/default.mdx create mode 100644 data/en/authors/resume.mdx create mode 100644 data/en/blog/DRAFT.mdx create mode 100644 data/en/blog/better-responsive-image-with-srcset-and-sizes-attributes.mdx create mode 100644 data/en/blog/deploy-and-config-website-on-name-cheap-part-1.mdx create mode 100644 data/en/blog/deploy-and-config-website-on-namecheap-part-2.mdx create mode 100644 data/en/blog/drag-n-drop-api-keynotes.mdx create mode 100644 data/en/blog/embed-script-using-github-and-jsdelivr.mdx create mode 100644 data/en/blog/function-declaration-vs-function-expression-in-js.mdx create mode 100644 data/en/blog/git-notes.mdx create mode 100644 data/en/blog/goodbye-bravebits-from-a-junior-developer-to-a-developer.mdx create mode 100644 data/en/blog/integrate-tailwind-css-with-react-application.mdx create mode 100644 data/en/blog/introduction-to-committing-with-conventional-commit.mdx create mode 100644 data/en/blog/nodejs-fetch-json-with-https.mdx create mode 100644 data/en/blog/prevent-layout-shift-while-show-hide-scrollbar-on-window.mdx rename data/{ => en}/blog/render-blocking-css-and-chrome-performance-api.mdx (100%) create mode 100644 data/en/blog/set-up-path-aliases-in-nodejs.mdx create mode 100644 data/en/blog/shopify-migrate-files-to-new-store-with-file-api-and-nodejs.mdx create mode 100644 data/en/blog/shopify-section-rendering-apis-notes.mdx create mode 100644 data/en/blog/tricky-use-case-of-array-map-in-js.mdx create mode 100644 data/en/blog/use-https-in-local-development.mdx create mode 100644 data/en/blog/viec-tim-dev-nhu-the-nao-part-2.mdx create mode 100644 data/en/blog/viec-tim-dev-nhu-the-nao.mdx rename data/{ => en}/projectsData.ts (100%) create mode 100644 data/en/snippets/SAMPLE.mdx create mode 100644 data/en/snippets/adding-or-substracting-days-in-liquid.mdx create mode 100644 data/en/snippets/casing-utils.mdx create mode 100644 data/en/snippets/color-validator.mdx create mode 100644 data/en/snippets/deep-remove-falsy-values-from-an-object.mdx create mode 100644 data/en/snippets/event-emitter.mdx create mode 100644 data/en/snippets/find-and-kill-process-on-given-port-in-macos.mdx create mode 100644 data/en/snippets/getting-spotify-token-to-display-nowplaying-tracks-on-your-site.mdx create mode 100644 data/en/snippets/gitignore-ignore-directory-keep-1-file.mdx create mode 100644 data/en/snippets/markdown-code-block-syntax.mdx create mode 100644 data/en/snippets/read-all-file-names-inside-a-folder.mdx create mode 100644 data/en/snippets/rename-a-case-sensitive-file-in-a-git-repo.mdx create mode 100644 data/en/snippets/use-async.mdx create mode 100644 data/en/snippets/use-local-storage-state.mdx create mode 100644 data/en/snippets/useful-array-utilities.mdx create mode 100644 data/en/snippets/verify-github-webhooks-requests.mdx create mode 100644 data/en/snippets/vnese-to-plain-english.mdx create mode 100644 data/es/authors/default.mdx create mode 100644 data/es/authors/resume.mdx create mode 100644 data/es/blog/DRAFT.mdx create mode 100644 data/es/blog/better-responsive-image-with-srcset-and-sizes-attributes.mdx create mode 100644 data/es/blog/deploy-and-config-website-on-name-cheap-part-1.mdx create mode 100644 data/es/blog/deploy-and-config-website-on-namecheap-part-2.mdx create mode 100644 data/es/blog/drag-n-drop-api-keynotes.mdx create mode 100644 data/es/blog/embed-script-using-github-and-jsdelivr.mdx create mode 100644 data/es/blog/function-declaration-vs-function-expression-in-js.mdx create mode 100644 data/es/blog/git-notes.mdx create mode 100644 data/es/blog/goodbye-bravebits-from-a-junior-developer-to-a-developer.mdx create mode 100644 data/es/blog/integrate-tailwind-css-with-react-application.mdx create mode 100644 data/es/blog/introduction-to-committing-with-conventional-commit.mdx create mode 100644 data/es/blog/nodejs-fetch-json-with-https.mdx create mode 100644 data/es/blog/prevent-layout-shift-while-show-hide-scrollbar-on-window.mdx create mode 100644 data/es/blog/render-blocking-css-and-chrome-performance-api.mdx create mode 100644 data/es/blog/set-up-path-aliases-in-nodejs.mdx create mode 100644 data/es/blog/shopify-migrate-files-to-new-store-with-file-api-and-nodejs.mdx create mode 100644 data/es/blog/shopify-section-rendering-apis-notes.mdx create mode 100644 data/es/blog/tricky-use-case-of-array-map-in-js.mdx create mode 100644 data/es/blog/use-https-in-local-development.mdx create mode 100644 data/es/blog/viec-tim-dev-nhu-the-nao-part-2.mdx create mode 100644 data/es/blog/viec-tim-dev-nhu-the-nao.mdx create mode 100644 data/es/projectsData.ts create mode 100644 data/es/snippets/SAMPLE.mdx create mode 100644 data/es/snippets/adding-or-substracting-days-in-liquid.mdx create mode 100644 data/es/snippets/casing-utils.mdx create mode 100644 data/es/snippets/color-validator.mdx create mode 100644 data/es/snippets/deep-remove-falsy-values-from-an-object.mdx create mode 100644 data/es/snippets/event-emitter.mdx create mode 100644 data/es/snippets/find-and-kill-process-on-given-port-in-macos.mdx create mode 100644 data/es/snippets/getting-spotify-token-to-display-nowplaying-tracks-on-your-site.mdx create mode 100644 data/es/snippets/gitignore-ignore-directory-keep-1-file.mdx create mode 100644 data/es/snippets/markdown-code-block-syntax.mdx create mode 100644 data/es/snippets/read-all-file-names-inside-a-folder.mdx create mode 100644 data/es/snippets/rename-a-case-sensitive-file-in-a-git-repo.mdx create mode 100644 data/es/snippets/use-async.mdx create mode 100644 data/es/snippets/use-local-storage-state.mdx create mode 100644 data/es/snippets/useful-array-utilities.mdx create mode 100644 data/es/snippets/verify-github-webhooks-requests.mdx create mode 100644 data/es/snippets/vnese-to-plain-english.mdx create mode 100644 hooks/useLocale.tsx create mode 100644 layouts/ResumeLayout.module.css create mode 100644 next-i18next.config.js create mode 100644 public/locales/ca/common.json create mode 100644 public/locales/en/common.json create mode 100644 public/locales/es/common.json diff --git a/.env.example b/.env.example index 8e7a5804..12dc11ed 100644 --- a/.env.example +++ b/.env.example @@ -5,6 +5,11 @@ GISCUS_CATEGORY= GISCUS_CATEGORY_ID= UTTERANCES_REPO= DISQUS_SHORTNAME= +NEXT_PUBLIC_CREATE_DISCUS_ON_TWITTER=FALSE +NEXT_PUBLIC_CREATE_DISCUS_ON_GITHUB=FALSE +NEXT_PUBLIC_SHARE_ON_FACEBOOK=FALSE +NEXT_PUBLIC_SHARE_ON_TWITTER=TRUE + # Spotify (for fetching now playing track) SPOTIFY_CLIENT_ID= @@ -16,3 +21,8 @@ DATABASE_URL= # GitHub (for fetching repository's data in /projects page) GITHUB_API_TOKEN= + + +# Default locale (for i18n) +NEXT_PUBLIC_DEFAULT_LOCALE=en +NEXT_PUBLIC_DEFAULT_AUTHOR= diff --git a/components/BuiltWith.tsx b/components/BuiltWith.tsx index 2e556859..d65b0ffe 100644 --- a/components/BuiltWith.tsx +++ b/components/BuiltWith.tsx @@ -1,11 +1,14 @@ import { siteMetadata } from '~/data/siteMetadata' import { DevIcon } from './DevIcon' import { Link } from './Link' +import { useTranslation } from 'next-i18next' export function BuiltWith() { + const { t } = useTranslation('common') + return (