About This Site

Introduction

This is Riku-Mono's portfolio site.

I publish information about myself, blog posts, and works.

Currently, the site is built with Next.js v15 (App Router - TypeScript) and uses contentlayer2 for page composition and management with MDX files.

Site Structure

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

How to Use

1. pnpm install
2. pnpm dev
3. Check at localhost:3000

Writing Guide

Blog Posts

1. Create posts in src/contents/posts/[lang]/ for each language.
2. Set the filename as src/contents/posts/[lang]/[slug].mdx.
3. Configure post information in the Front Matter of src/contents/posts/[lang]/[slug].mdx.

Works

1. Create works in src/contents/works/[lang]/ for each language.
2. Set the filename as src/contents/works/[lang]/[slug].mdx.
3. Configure work information in the Front Matter of src/contents/works/[lang]/[slug].mdx.

For required Front Matter information and configuration methods, please refer to Properties Available on This Site.

How to Add a New Language

1. Add the language code to src/i18n/i18nLocales.js.

const defaultLocale = 'ja';
const locales = ['ja', 'en', 'ko' /* Add your language */];
 
module.exports = { defaultLocale, locales };

2. Create a directory with the language code in src/contents/posts/[lang]/, src/contents/pages/[lang], src/contents/categories/[lang], src/i18n/locales/[lang].

3. In src/contents/posts/[lang]/ and src/contents/pages/[lang], if a corresponding language translation file doesn't exist, it will reference the defaultLocale file, so immediate translation is not necessary.

4. Add category translations in src/contents/categories/[lang]. Please create all files by referring to the categories in the defaultLocale directory.

5. Add language file translations in src/i18n/locales/[lang]. Please create all files by referring to the files in the defaultLocale directory.

6. Add language metadata to scr/contents/siteLocaleMetadata.js.

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