docs: complete zh-Hant and ja README translations

Author: sixtdreanight

README.ja.md

@@ -1,34 +1,115 @@
 **言語 / Language:** [English](README.md) | [简体中文](README.zh-CN.md) | [繁體中文](README.zh-Hant.md) | [日本語](README.ja.md)
 
-# Vibe Coding クラッシュコース
+# Vibe Coding 入門コース
 
 [![License](https://img.shields.io/badge/license-MIT-green)](LICENSE)
 [![Next.js](https://img.shields.io/badge/Next.js-16-black)](https://nextjs.org/)
 [![AI SDK](https://img.shields.io/badge/AI%20SDK-multi--model-purple)](https://sdk.vercel.ai/)
 
-> 日本語翻訳は準備中です。完全な内容は [English](README.md) または [简体中文](README.zh-CN.md) をご参照ください。
->
-> Japanese translation in progress. Please refer to [English](README.md) or [简体中文](README.zh-CN.md) for complete content.
+ゼロから学べる AI アシストプログラミング（Vibe Coding）のインタラクティブな学習サイトです。12 のレッスンで段階的に学習でき、AI チューターが組み込まれており、Prompt Playground で直接実行可能なコードを生成できます。
 
 ---
 
+## 機能
+
+- **体系的なカリキュラム** — 12 のレッスンで概念理解から実践まで
+- **AI 学習アシスタント** — 組み込みの AI チューターにいつでも質問可能
+- **Prompt Playground** — 説明を入力するだけで実行可能なコードを生成
+- **マルチモデル対応** — Claude、OpenAI、DeepSeek 及び任意の OpenAI 互換インターフェース
+
 ## クイックスタート
 
+### 自動セットアップ（推奨）
+
 ```bash
 bash scripts/setup.sh
-# または手動:
-npm install && cp .env.example .env && npm run dev
 ```
 
-## ライセンス
+### 手動セットアップ
+
+```bash
+npm install
+cp .env.example .env
+# .env を編集して API Key を入力
+npm run dev
+```
+
+http://localhost:3000 にアクセスして学習を開始してください。
+
+> 初心者向けの詳細なセットアップガイド：[SETUP_GUIDE.md](./SETUP_GUIDE.md)
+
+## マルチモデルの設定
+
+3 つの AI プロバイダーを `.env` で設定できます：
+
+### DeepSeek（推奨、国内から直接アクセス可能）
+
+```env
+AI_PROVIDER=openai-compatible
+AI_MODEL=deepseek-chat
+AI_API_KEY=sk-...
+AI_BASE_URL=https://api.deepseek.com/v1
+```
+
+### Anthropic Claude
+
+```env
+AI_PROVIDER=anthropic
+AI_MODEL=claude-sonnet-4-20250514
+ANTHROPIC_API_KEY=sk-ant-...
+```
+
+### OpenAI または互換インターフェース
+
+```env
+AI_PROVIDER=openai
+AI_MODEL=gpt-4o
+OPENAI_API_KEY=sk-...
+```
+
+## 技術スタック
+
+- [Next.js](https://nextjs.org/) 16 + React 19 + TypeScript
+- [Tailwind CSS](https://tailwindcss.com/) v4
+- [AI SDK](https://sdk.vercel.ai/) — 統一マルチモデルインターフェース
+- [Lucide React](https://lucide.dev/) — アイコン
+- [react-markdown](https://github.com/remarkjs/react-markdown) — レッスンコンテンツのレンダリング
+
+## プロジェクト構造
+
+```
+app/
+  api/agent/route.ts      # AI 会話ストリーミング API
+  lesson/[id]/page.tsx    # レッスン詳細ページ
+  page.tsx                # トップページ
+  layout.tsx              # ルートレイアウト
+components/
+  ChatInterface.tsx       # AI チャットコンポーネント
+  PromptPlayground.tsx    # コード生成練習エリア
+  LessonNavigator.tsx     # レッスンナビゲーションサイドバー
+lib/
+  lessons.ts              # レッスンデータ
+scripts/
+  setup.sh                # 自動セットアップスクリプト
+```
+
+## カスタムレッスン
+
+`lib/lessons.ts` を編集すると、レッスンコンテンツの修正や追加が可能です。Markdown 形式に対応しています。
+
+## 関連プロジェクト
+
+- [myBlog](https://github.com/sixtdreanight/myBlog) — 著者の個人ブログ、Vibe Coding に関する記事多数
+
+## License
 
 MIT
 
 ---
 
 <div align="center">
 
-**Language / 语言 / 言語**
+**Language / 語言 / 言語**
 
 [**English**](README.md) | [**简体中文**](README.zh-CN.md) | [**繁體中文**](README.zh-Hant.md) | [**日本語**](README.ja.md)
 

README.zh-Hant.md

@@ -6,29 +6,110 @@
 [![Next.js](https://img.shields.io/badge/Next.js-16-black)](https://nextjs.org/)
 [![AI SDK](https://img.shields.io/badge/AI%20SDK-multi--model-purple)](https://sdk.vercel.ai/)
 
-> 繁體中文翻譯正在進行中，完整內容請參考 [English](README.md) 或 [简体中文](README.zh-CN.md)。
->
-> Traditional Chinese translation in progress. Please refer to [English](README.md) or [简体中文](README.zh-CN.md) for complete content.
+一個面向零基礎學習者的 AI 輔助程式設計（Vibe Coding）互動教學網站。12 節課程循序漸進，內建 AI 助教，Prompt Playground 可直接生成可執行的程式碼。
 
 ---
 
+## 功能
+
+- **系統化課程** — 12 節課程從概念理解到動手實踐
+- **AI 學習助手** — 內建 AI 助教，隨時提問
+- **Prompt Playground** — 輸入描述即可生成可執行程式碼
+- **多模型支援** — Claude、OpenAI、DeepSeek 及任意 OpenAI 相容介面
+
 ## 快速開始
 
+### 自動設定（推薦）
+
 ```bash
 bash scripts/setup.sh
-# 或手動：
-npm install && cp .env.example .env && npm run dev
 ```
 
-## 許可證
+### 手動
+
+```bash
+npm install
+cp .env.example .env
+# 編輯 .env，填入 API Key
+npm run dev
+```
+
+打開 http://localhost:3000 開始學習。
+
+> 詳細的零基礎設定指南：[SETUP_GUIDE.md](./SETUP_GUIDE.md)
+
+## 設定多模型
+
+支援三種 AI 提供商，透過 `.env` 設定：
+
+### DeepSeek（推薦，國內直接存取）
+
+```env
+AI_PROVIDER=openai-compatible
+AI_MODEL=deepseek-chat
+AI_API_KEY=sk-...
+AI_BASE_URL=https://api.deepseek.com/v1
+```
+
+### Anthropic Claude
+
+```env
+AI_PROVIDER=anthropic
+AI_MODEL=claude-sonnet-4-20250514
+ANTHROPIC_API_KEY=sk-ant-...
+```
+
+### OpenAI 或相容介面
+
+```env
+AI_PROVIDER=openai
+AI_MODEL=gpt-4o
+OPENAI_API_KEY=sk-...
+```
+
+## 技術棧
+
+- [Next.js](https://nextjs.org/) 16 + React 19 + TypeScript
+- [Tailwind CSS](https://tailwindcss.com/) v4
+- [AI SDK](https://sdk.vercel.ai/) — 統一多模型介面
+- [Lucide React](https://lucide.dev/) — 圖示
+- [react-markdown](https://github.com/remarkjs/react-markdown) — 渲染課程內容
+
+## 專案結構
+
+```
+app/
+  api/agent/route.ts      # AI 對話串流介面
+  lesson/[id]/page.tsx    # 課程詳情頁
+  page.tsx                # 首頁
+  layout.tsx              # 根佈局
+components/
+  ChatInterface.tsx       # AI 聊天元件
+  PromptPlayground.tsx    # 程式碼生成練習區
+  LessonNavigator.tsx     # 課程導覽側邊欄
+lib/
+  lessons.ts              # 課程資料
+scripts/
+  setup.sh                # 自動設定腳本
+```
+
+## 自訂課程
+
+編輯 `lib/lessons.ts` 即可修改或新增課程內容，支援 Markdown 格式。
+
+## 相關專案
+
+- [myBlog](https://github.com/sixtdreanight/myBlog) — 作者個人部落格，更多 Vibe Coding 相關文章
+
+## License
 
 MIT
 
 ---
 
 <div align="center">
 
-**Language / 语言 / 言語**
+**Language / 語言 / 言語**
 
 [**English**](README.md) | [**简体中文**](README.zh-CN.md) | [**繁體中文**](README.zh-Hant.md) | [**日本語**](README.ja.md)