サイトについて

はじめに

このサイトは、Riku-Monoのポートフォリオサイトです。

私についてとブログ、成果物を公開しています。

現状、Next.js v15 (App Router - TypeScript) で、contentlayer2 で MDX files によるページ構成・管理を行っています。

このサイトの構成

• Next.js
• TypeScript
• Tailwind CSS
• contentlayer2
• i18n
  • i18next
  • next-i18n-router
• pnpm

使い方

1. pnpm install
2. pnpm dev
3. localhost:3000 で確認できます。

執筆方法

記事

1. src/contents/posts/[lang]/ に記事をそれぞれの言語で作成します。
2. src/contents/posts/[lang]/[slug].mdx のようにファイル名を設定します。
3. src/contents/posts/[lang]/[slug].mdx の Front Matter に記事の情報を設定します。

成果物

1. src/contents/works/[lang]/ に成果物をそれぞれの言語で作成します。
2. src/contents/works/[lang]/[slug].mdx のようにファイル名を設定します。
3. src/contents/works/[lang]/[slug].mdx の Front Matter に成果物の情報を設定します。

Front Matter に必要な情報や設定方法は、当サイトで使用できるプロパティ を参照してください。

対応言語追加方法

1. src/i18n/i18nLocales.js に言語コードを追加します。

const defaultLocale = 'ja';
const locales = ['ja', 'en', 'ko' /* 追加したい言語 */];
 
module.exports = { defaultLocale, locales };

2. src/contents/posts/[lang]/, src/contents/pages/[lang], src/contents/categories/[lang], src/i18n/locales/[lang] に言語コードのディレクトリを作成します。

3. src/contents/posts/[lang]/, src/contents/pages/[lang] では、対応する言語訳のファイルが存在しない場合は、defaultLocale のファイルを参照するため、すぐに対応する必要はありません。

4. src/contents/categories/[lang] にカテゴリーの訳を追加します。 defaultLocale ディレクトリの category を参考に、全てのファイルを必ず作成してください。

5. src/i18n/locales/[lang] に言語ファイルの訳を追加します。 defaultLocale ディレクトリのファイルを参考に、全てのファイルを必ず作成してください。

6. scr/contents/siteLocaleMetadata.js に言語のメタデータを追加します。

type Metadata = {
  [locale: string]: string;
};
 
export const title: Metadata = {
  ja: 'Riku-Mono ポートフォリオ',
  en: 'Riku-Mono Portfolio',
  ko: 'Riku-Mono 포트폴리오',
  /* 追加したい言語 */
};
 
export const description: Metadata = {
  ja: 'Riku-Monoのポートフォリオサイトです。ブログと成果物を公開しています。',
  en: 'Riku-Mono Portfolio Site. Blog and Works are published.',
  ko: '리쿠-모노 포트폴리오 사이트. 블로그와 작품을 공개합니다.',
  /* 追加したい言語 */
};