Daiki Nishiyama

CLAUDE.md

This file provides guidance to Claude Code (claude.ai/code) when working with code in this repository.

Project Overview

This is a personal academic website for Daiki Nishiyama, a Ph.D. student at Institute of Science Tokyo. The site serves as a bilingual (Japanese/English) portfolio showcasing research, publications, and professional experience. It’s built as a static website hosted on GitHub Pages with a custom domain (d-nsym.com).

Technology Stack

• Frontend: Vanilla HTML, CSS, and JavaScript (no frameworks)
• Content Management: Markdown files for bilingual content
• Hosting: GitHub Pages with Jekyll (minimal configuration)
• Styling: Custom CSS with responsive design
• Content Rendering: marked.js library for Markdown parsing

Architecture

Core Files Structure

• index.html - Main page template with header, navigation, and content container
• script.js - Language switching, data loading, and page rendering
• bibtex.js - Self-contained BibTeX parser and citation formatter
• styles.css - Complete styling with responsive breakpoints
• content/data/*.json - All site content, edited through the CMS
• admin/index.html, admin/config.yml - Sveltia CMS admin UI and schema
• _config.yml - Jekyll configuration (minimal, only includes sitemap plugin)

Key Components

Content Management (Sveltia CMS):

• Admin UI at /admin/, backed by the Git repository itself (no database)
• Every field is stored as a _ja / _en pair in the same record, so both languages are edited in one form and cannot drift apart
• Publications are stored as raw BibTeX and rendered at runtime by bibtex.js. Citation style follows the language of the work, not of the page: an English paper reads "Title." Venue, March 2025. on both pages, a Japanese one reads 「タイトル」, 会議名, 2025年3月．. Nothing is translated.

Language Switching System:

• Automatic language detection based on browser locale (navigator.language)
• Toggle button switches between English and Japanese
• The JSON data is fetched once and re-rendered on toggle
• Affiliation text comes from content/data/profile.json

Content Loading Flow:

1. Page loads with browser language detection
2. Fetches every file in content/data/ in parallel
3. Renders sections from the data; marked.js handles the free-text intro, bibtex.js formats each publication
4. Updates DOM with the selected language

Development Workflow

Local Development

Since this is a static site, you can develop locally by:

1. Serving files with any local server (e.g., python -m http.server 8000)
2. Testing language switching functionality
3. Previewing responsive design changes

Content Updates

• All content lives in content/data/*.json and is normally edited via /admin/
• Editing the JSON by hand is equally valid; the CMS is just a form over it
• Section headings (学歴 / Education etc.) are not content: they live in the LABELS table in script.js

Deployment

• Automatic deployment via GitHub Pages when changes are pushed to main branch
• Custom domain configured via CNAME file pointing to d-nsym.com
• Jekyll processes the site with sitemap generation

Styling Guidelines

• Color Scheme: Primary color #800020 (burgundy) for headers, links, and accents
• Typography: Helvetica Neue for clean, academic appearance
• Layout: Centered content with max-width 800px for readability
• Responsive: Mobile-first approach with breakpoint at 600px
• Profile Image: Circular crop, 200px diameter

Content Management

When updating academic content:

1. Prefer /admin/ (Sveltia CMS). It commits directly to main, which triggers a GitHub Pages rebuild.
2. Every record carries both languages (title_ja / title_en, …). Fill in both — the renderer shows an empty string for whichever is missing.
3. For a new publication, paste the BibTeX into the bibtex field and pick a category. Keep it in the language the work was actually published in — the citation is never translated.
4. The citation link is derived automatically from the BibTeX url, else doi. The explicit link field overrides both.

When adding a new content type:

1. Add the collection to admin/config.yml and create content/data/<name>.json
2. Add the file name to DATA_FILES in script.js, a label to LABELS, and a render call in render()