Skip to content

Commit 7fa28de

Browse files
WojciechCendrzakWojciechCendrzak
committed
i18n-keys aded
1 parent 827a26a commit 7fa28de

File tree

7 files changed

+59
-12
lines changed

7 files changed

+59
-12
lines changed

‎package.json‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -8,13 +8,17 @@
88
"start": "next start",
99
"tsc": "tsc --project tsconfig.json --pretty --noEmit",
1010
"lint": "eslint --ext ts,tsx --fix",
11+
"lintall": "yarn tsc && yarn lint",
1112
"pretti": "prettier --config ./.prettierrc.js -w ./src",
1213
"postinstall": "husky install",
1314
"test": "jest"
1415
},
1516
"dependencies": {
17+
"beprofiler": "^0.2.3",
1618
"date-fns": "^2.11.1",
1719
"gray-matter": "^4.0.2",
20+
"i18n-keys": "^1.0.1",
21+
"i18next": "^20.3.0",
1822
"next": "^10.0.0",
1923
"react": "17.0.1",
2024
"react-dom": "17.0.1",

‎src/components/layout.tsx‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -3,9 +3,9 @@ import Image from 'next/image';
33
import styles from './layout.module.css';
44
import utilStyles from '../styles/utils.module.css';
55
import Link from 'next/link';
6+
import { translate, translationKeys } from '../logic/translations/translation.service';
67

78
const name = '[Your Name]';
8-
export const siteTitle = 'Next.js Sample Website';
99

1010
interface LayoutProps {
1111
home?: boolean;
@@ -20,10 +20,10 @@ export const Layout: React.FC<LayoutProps> = ({ children, home }) => {
2020
<meta
2121
property="og:image"
2222
content={`https://og-image.vercel.app/${encodeURI(
23-
siteTitle
23+
translate(translationKeys.site.title)
2424
)}.png?theme=light&md=0&fontSize=75px&images=https%3A%2F%2Fassets.zeit.co%2Fimage%2Fupload%2Ffront%2Fassets%2Fdesign%2Fnextjs-black-logo.svg`}
2525
/>
26-
<meta name="og:title" content={siteTitle} />
26+
<meta name="og:title" content={translate(translationKeys.site.title)} />
2727
<meta name="twitter:card" content="summary_large_image" />
2828
</Head>
2929
<header className={styles.header}>

‎src/logic/posts.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import remark from 'remark';
55
import html from 'remark-html';
66
import { Post, PostMeta } from '../models/post';
77

8-
const postsDirectory = path.join(process.cwd(), 'posts');
8+
const postsDirectory = path.join(process.cwd(), 'src/posts');
99

1010
export const getSortedPostsData = (): Post[] => {
1111
// Get file names under /posts

‎src/logic/translations/locales/en.json‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
{
2+
"site": {
3+
"title": "Code Calligraphy"
4+
},
5+
"homePage": {
6+
"title": "Home page",
7+
"aboutMe": {
8+
"title": "About me",
9+
"description": "I'am frontend developer"
10+
}
11+
}
12+
}

‎src/logic/translations/translation.service.ts‎

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
import en from './locales/en.json';
2+
import i18next, { TFunction } from 'i18next';
3+
import { getTranslationKeys } from 'i18n-keys';
4+
5+
i18next.init({
6+
lng: 'en',
7+
resources: {
8+
en: {
9+
translation: en,
10+
},
11+
},
12+
});
13+
14+
export const translate: TFunction = (key: string) => i18next.t(key);
15+
16+
export const translationKeys = getTranslationKeys(en);

‎src/pages/index.tsx‎

Lines changed: 5 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,13 @@
11
import Head from 'next/head';
2-
import { Layout, siteTitle } from '../components/layout';
2+
import { Layout } from '../components/layout';
33
import utilStyles from '../styles/utils.module.css';
44
import { getSortedPostsData } from '../logic/posts';
55
import Link from 'next/link';
66
import { Date } from '../components/date';
77
import { GetStaticProps } from 'next';
88
import React from 'react';
99
import { Post } from '../models/post';
10+
import { translate, translationKeys } from '../logic/translations/translation.service';
1011

1112
interface HomeProps {
1213
allPostsData: Post[];
@@ -16,14 +17,11 @@ export const HomePage: React.FC<HomeProps> = ({ allPostsData }) => {
1617
return (
1718
<Layout home>
1819
<Head>
19-
<title>{siteTitle}</title>
20+
<title>{translate(translationKeys.homePage.title)}</title>
2021
</Head>
2122
<section className={utilStyles.headingMd}>
22-
<p>[Your Self Introduction]</p>
23-
<p>
24-
(This is a sample website - you’ll be building a site like this in{' '}
25-
<a href="https://nextjs.org/learn">our Next.js tutorial</a>.)
26-
</p>
23+
<p>{translate(translationKeys.homePage.aboutMe.title)}</p>
24+
<p>{translate(translationKeys.homePage.aboutMe.description)}</p>
2725
</section>
2826
<section className={`${utilStyles.headingMd} ${utilStyles.padding1px}`}>
2927
<h2 className={utilStyles.headingLg}>Blog</h2>

‎yarn.lock‎

Lines changed: 18 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -273,7 +273,7 @@
273273
dependencies:
274274
regenerator-runtime "^0.13.4"
275275

276-
"@babel/runtime@^7.10.2", "@babel/runtime@^7.11.2":
276+
"@babel/runtime@^7.10.2", "@babel/runtime@^7.11.2", "@babel/runtime@^7.12.0":
277277
version "7.14.0"
278278
resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.14.0.tgz#46794bc20b612c5f75e62dd071e24dfd95f1cbe6"
279279
integrity sha512-JELkvo/DlpNdJ7dlyw/eY7E0suy5i5GQH+Vlxaq1nsNJ+H7f4Vtv3jMeCEgRhZZQFXTjldYfQgv2qmM6M1v5wA==
@@ -1217,6 +1217,11 @@ base@^0.11.1:
12171217
mixin-deep "^1.2.0"
12181218
pascalcase "^0.1.1"
12191219

1220+
beprofiler@^0.2.3:
1221+
version "0.2.3"
1222+
resolved "https://registry.yarnpkg.com/beprofiler/-/beprofiler-0.2.3.tgz#ada8811f5341fe0bdb7f141bc5cf328b25d8c80a"
1223+
integrity sha512-uGyzmtHTDxoQbGEPBEZbFYUCuUATmATDZC1ohygh5g9I9wCUKLC4vJ1idI1/DeTQwm8lLl2PCCMoXURuaLcezA==
1224+
12201225
big.js@^5.2.2:
12211226
version "5.2.2"
12221227
resolved "https://registry.yarnpkg.com/big.js/-/big.js-5.2.2.tgz#65f0af382f578bcdc742bd9c281e9cb2d7768328"
@@ -2903,6 +2908,18 @@ husky@^6.0.0:
29032908
resolved "https://registry.yarnpkg.com/husky/-/husky-6.0.0.tgz#810f11869adf51604c32ea577edbc377d7f9319e"
29042909
integrity sha512-SQS2gDTB7tBN486QSoKPKQItZw97BMOd+Kdb6ghfpBc0yXyzrddI0oDV5MkDAbuB4X2mO3/nj60TRMcYxwzZeQ==
29052910

2911+
i18n-keys@^1.0.1:
2912+
version "1.0.1"
2913+
resolved "https://registry.yarnpkg.com/i18n-keys/-/i18n-keys-1.0.1.tgz#5ecc619de5a9a30543a2d342a4b0426a40f7a9cf"
2914+
integrity sha512-MSxmIrd7pY+a+sx1iLQOg6fkVcFSQDOtQKD/eEQrmASEsDbpvWWkgTiX/knwyotAsvoul+WibRP3BO1xfDbSMA==
2915+
2916+
i18next@^20.3.0:
2917+
version "20.3.0"
2918+
resolved "https://registry.yarnpkg.com/i18next/-/i18next-20.3.0.tgz#9558b431241fb1dbbd445174391ede65d0a68ed9"
2919+
integrity sha512-eFv4aQvaGykp48mI4JEaCcoD/j4zoYjFnDYhChe3ukwvbHx3q4mKZlB8YnmhYrHQR5FopLlCrzcSuY0ZWfiakA==
2920+
dependencies:
2921+
"@babel/runtime" "^7.12.0"
2922+
29062923
iconv-lite@0.4.24:
29072924
version "0.4.24"
29082925
resolved "https://registry.yarnpkg.com/iconv-lite/-/iconv-lite-0.4.24.tgz#2022b4b25fbddc21d2f524974a474aafe733908b"

0 commit comments

Comments
 (0)