d87d30ccc0
- Framer Motion 卡片滑动 UI,带物理阻尼动画 - 多人房间系统,4位房间号 + SWR 实时轮询 - 高德地图 POI v5 API 搜索附近餐厅 - Web Share API 一键邀请,剪贴板降级方案 - SQLite/Prisma 持久化存储 - 移动端优先响应式设计 (Tailwind CSS)
41 lines
1.3 KiB
Markdown
41 lines
1.3 KiB
Markdown
# NoWhatever — 别说随便
|
|
|
|
像 Tinder 一样滑卡片,和朋友一起决定去哪吃!解决聚餐时"随便都行"的纠结痛点,无需下载 App,用完即走。
|
|
|
|
## Tech Stack
|
|
|
|
- **Next.js** (App Router) + **React** + **TypeScript**
|
|
- **Tailwind CSS** — Utility-first styling
|
|
- **Framer Motion** — Physics-based swipe & drag animations
|
|
- **Lucide React** — Icon library
|
|
|
|
## Getting Started
|
|
|
|
```bash
|
|
npm install
|
|
npm run dev
|
|
```
|
|
|
|
Open [http://localhost:3000](http://localhost:3000) in your browser (best viewed on mobile viewport).
|
|
|
|
## Project Structure
|
|
|
|
```
|
|
src/
|
|
├── app/
|
|
│ ├── globals.css # Global styles (mobile-first, no scroll)
|
|
│ ├── layout.tsx # Root layout with viewport meta
|
|
│ └── page.tsx # Main entry page
|
|
├── components/
|
|
│ ├── TopNav.tsx # Navigation bar with room info
|
|
│ ├── RestaurantCard.tsx # Restaurant display card
|
|
│ ├── SwipeableCard.tsx # Framer Motion drag/swipe logic
|
|
│ ├── SwipeDeck.tsx # Card stack orchestrator
|
|
│ ├── ActionButtons.tsx # Nope / Like action buttons
|
|
│ └── MatchResult.tsx # Match celebration screen
|
|
├── data/
|
|
│ └── restaurants.ts # Mock restaurant data
|
|
└── types/
|
|
└── index.ts # TypeScript type definitions
|
|
```
|