beautiful-mermaid

---

Overview

A personal portfolio and blog built with TanStack Start. It combines microCMS-managed articles, external feed aggregation, and motion-heavy presentation for projects and writing.

Tech Stack

Category	Technology
Framework	TanStack Start
UI	React 19, Tailwind CSS v4
Data Fetching	TanStack Query
CMS	microCMS
Animation	Lenis, Three.js, GSAP
Forms	React Hook Form, Zod, Resend
Tooling	Biome, TypeScript, Bun

Getting Started

git clone https://github.com/YunosukeYoshino/portfolio.git
cd portfolio
bun install
cp .env.example .env.local
bun run dev

[!NOTE] In development mode, the application uses mock data if microCMS credentials are not provided.

Development

Commands

Command	Description
bun run dev	Start development server
bun run build	Build for production
bun run lint	Run Biome + TypeScript + Markuplint checks
bun run fix	Auto-fix linting issues
bun run typecheck	TypeScript type-checking only
bun run deploy	Deploy to Cloudflare Pages
bun run deploy:preview	Deploy to preview branch

Notes

• Internal implementation guidance for contributors and coding agents lives in CLAUDE.md.
• In development, microCMS-backed routes fall back to mock data when credentials are missing.
• The site is statically exported and deployed to Cloudflare Pages.

Architecture

Deployment

Deployed as a static site to Cloudflare Pages.

# Production deploy
bun run deploy

# Preview deploy
bun run deploy:preview

[!IMPORTANT] Set NODE_VERSION=20 or higher in your Cloudflare Pages project settings.