- 🔍 智能搜索 — 全文搜索资源名称、描述和标签，快速定位所需内容
- 🗂️ 分类筛选 — 按 AI、开发工具、设计、学习等多个类别精准过滤
- 🏷️ 标签系统 — 多标签联合筛选，灵活组合查询条件
- ⭐ 个人收藏 — 一键收藏常用资源，数据持久化存储于本地
- 🌐 中英双语 — 支持中文/英文界面切换
- 📝 资源投稿 — 用户可提交新资源，社区共建共享
- 🌙 暗黑模式 — 支持明暗主题自由切换
- 📱 响应式布局 — 完美适配桌面端与移动端
首页展示资源卡片，支持搜索和多维度筛选
| 分类 | 技术 |
|---|---|
| 前端框架 | React 19 |
| 开发语言 | TypeScript 5.9 |
| 构建工具 | Vite 7 |
| 样式方案 | Tailwind CSS 3 |
| 组件库 | shadcn/ui + Radix UI |
| 图标库 | Lucide React |
| 表单验证 | React Hook Form + Zod |
| 提示通知 | Sonner |
| 主题管理 | next-themes |
- Node.js >= 16.0.0
- npm >= 8.0.0
# 克隆仓库
git clone https://github.com/iyangming/openclaw-nav.git
cd openclaw-nav
# 安装依赖
npm install
# 启动开发服务器
npm run dev打开浏览器访问 http://localhost:5173 即可预览。
# 构建生产版本
npm run build
# 预览构建结果
npm run preview构建产物输出到 dist/ 目录，可直接部署到任意静态托管服务（Vercel、Netlify、GitHub Pages 等）。
openclaw-nav/
├── public/ # 静态资源
├── src/
│ ├── components/ # 可复用组件
│ │ └── ui/ # shadcn/ui 基础组件
│ ├── data/ # 数据层（资源数据、分类、标签）
│ ├── hooks/ # 自定义 React Hooks
│ │ ├── useResources.ts # 资源搜索与过滤
│ │ ├── useBookmarks.ts # 收藏功能
│ │ └── useI18n.ts # 国际化
│ ├── pages/ # 页面组件
│ │ ├── Home.tsx # 首页（资源列表）
│ │ ├── Bookmarks.tsx # 我的收藏
│ │ └── About.tsx # 关于页面
│ ├── types/ # TypeScript 类型定义
│ └── lib/ # 工具函数
├── .gitignore
├── package.json
├── tsconfig.json
├── vite.config.ts
└── README.md
| 分类 | 说明 |
|---|---|
| 🤖 AI 工具 | ChatGPT、Claude、Midjourney 等 AI 产品 |
| 💻 开发工具 | GitHub、VS Code、Postman 等开发利器 |
| 🎨 设计资源 | Figma、Dribbble、Unsplash 等设计素材 |
| 📚 学习资源 | 技术文档、教程、课程等学习内容 |
| ⚙️ 效率工具 | 提升工作效率的各类实用工具 |
有好的资源想分享给大家？点击页面右上角的 "提交资源" 按钮，填写资源信息即可。
如果想通过 GitHub 提交，请：
- Fork 本仓库
- 编辑
src/data/mockData.ts，按已有格式添加资源 - 提交 Pull Request，简单描述资源内容
欢迎任何形式的贡献！
# Fork 后克隆你的仓库
git clone https://github.com/<your-username>/openclaw-nav.git
# 创建功能分支
git checkout -b feature/your-feature-name
# 提交变更
git commit -m "feat: add your feature"
# 推送分支
git push origin feature/your-feature-name
# 在 GitHub 上创建 Pull Request- 🐛 修复 Bug
- ✨ 新增功能
- 📚 完善文档
- 🎨 优化 UI/UX
- 🌐 添加新资源
- 🔧 性能优化
本项目基于 MIT License 开源。
MIT License
Copyright (c) 2024 iyangming
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
如果这个项目对你有帮助，请给个 ⭐ Star 支持一下！
Made with ❤️ by iyangming