6eabef68cd
I've recently built an i18n library that is tailored to usage in Next.js: [next-intl](https://github.com/amannn/next-intl). It complements the internationalized routing capabilities of Next.js by managing translations and providing them to components, as well as handling date and time formatting. It's a bit young, but I'm using it in two production apps now and I'm quite confident in the library. Would you want to include an example and link to it?
40 lines
981 B
JavaScript
40 lines
981 B
JavaScript
import { useIntl, useTranslations } from 'next-intl'
|
|
import { useRouter } from 'next/router'
|
|
import Code from '../components/Code'
|
|
import PageLayout from '../components/PageLayout'
|
|
|
|
export default function About() {
|
|
const t = useTranslations('About')
|
|
const { locale } = useRouter()
|
|
const intl = useIntl()
|
|
const lastUpdated = new Date(2021, 0, 26, 17, 4, 45)
|
|
|
|
return (
|
|
<PageLayout title={t('title')}>
|
|
<p>
|
|
{t('description', {
|
|
locale,
|
|
code: (children) => <Code>{children}</Code>,
|
|
})}
|
|
</p>
|
|
<p>
|
|
{t('lastUpdated', {
|
|
lastUpdated,
|
|
lastUpdatedRelative: intl.formatRelativeTime(lastUpdated),
|
|
})}
|
|
</p>
|
|
</PageLayout>
|
|
)
|
|
}
|
|
|
|
export function getStaticProps({ locale }) {
|
|
return {
|
|
props: {
|
|
messages: {
|
|
...require(`../messages/shared/${locale}.json`),
|
|
...require(`../messages/about/${locale}.json`),
|
|
},
|
|
now: new Date().getTime(),
|
|
},
|
|
}
|
|
}
|