refactor: 重组项目结构,前端收拢至 frontend/,新增 backend/ 目录

- 前端文件移入 frontend/ 子目录
- 新建 backend/ 目录(待开发)
- 新增 CLAUDE.md、claudehd.md、EXTERNAL_SERVICES.md

Co-Authored-By: Claude Sonnet 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
gongzhiyong
2026-04-07 18:01:04 +08:00
co-authored by Claude Sonnet 4.6
parent 93017f291a
commit 04d8fbb740
93 changed files with 743 additions and 0 deletions
+53
View File
@@ -0,0 +1,53 @@
# CLAUDE.md
This file provides guidance to Claude Code (claude.ai/code) when working with code in this repository.
## Overview
This is a 1:1 pixel-perfect clone of the Google Gemini chat interface, built with Next.js 16 (App Router), React 19, TypeScript, Tailwind CSS 4, and shadcn/ui. It was generated via [v0.app](https://v0.app/chat/lx6pc6oofZh) and auto-synced to this repo. Deployed on Vercel.
## Commands
```bash
npm install # Install dependencies
npm run dev # Start dev server (localhost:3000)
npm run build # Build for production
npm run lint # Run ESLint
npm start # Start production server
```
## Architecture
### Entry Point
- `app/page.tsx` — renders `<GeminiChat />` only; all logic lives in components
### Core Component: `components/gemini/GeminiChat.tsx`
The root stateful component. Owns all state: sidebar open/close, active conversation, message list, typing indicator. Composes all other Gemini components.
### Gemini Component Breakdown
| Component | Purpose |
|---|---|
| `GeminiSidebar.tsx` | Left sidebar — logo, new chat button, conversation history list, bottom nav (Help/Activity/Extensions), user avatar |
| `GeminiTopbar.tsx` | Top bar — hamburger toggle, model selector dropdown (Gemini 2.0 Flash etc.), settings + avatar |
| `GeminiWelcome.tsx` | Empty state — gradient greeting, 4 suggestion cards |
| `GeminiMessage.tsx` | Single message — user bubble (right-aligned, bg pill) vs AI response (left-aligned, ◆ icon, no bubble, markdown-like rendering) |
| `GeminiInput.tsx` | Bottom input — rounded container, attachment icon, auto-resize textarea, mic + send button |
| `GeminiTypingIndicator.tsx` | Animated dots shown while AI is "responding" |
| `ExtensionsPanel.tsx` | Extensions panel UI |
### Styling
- Tailwind CSS 4 with `@tailwindcss/postcss`
- Dark theme only — hardcoded color palette:
- Page bg: `#131314`, Sidebar: `#1e1e1e`, Hover/card: `#2a2a2a`, Border: `#3a3a3a`
- Primary text: `#e3e3e3`, Muted: `#9aa0a6`
- Accent gradient: `from-[#4285f4] to-[#a855f7]`
- `components/ui/` — standard shadcn/ui primitives (do not modify directly)
### Key Patterns
- All components use `"use client"` — no server components beyond the page shell
- `cn()` from `@/lib/utils` for conditional class merging
- No external API calls — all data is mock/local state in `GeminiChat.tsx`
## Sync Workflow
This repo is auto-synced from v0.app. Changes made on v0.app are pushed here automatically, then deployed to Vercel. Manual edits here may be overwritten on the next v0 sync.