Agent Skills
› aresbit/MateBot
› webapp-building
webapp-building
GitHub基于React、TypeScript和Tailwind CSS构建现代Web应用的技能，涵盖从项目初始化、开发、构建到部署的完整工作流。
Trigger Scenarios
需要创建新的前端Web应用
使用React和TypeScript进行项目开发
Install
npx skills add aresbit/MateBot --skill webapp-building -g -y
SKILL.md
Frontmatter
{
"name": "webapp-building",
"description": "Tools for building modern React webapps with TypeScript, Tailwind CSS and shadcn\/ui. Best suited for applications with complex UI components and state management."
}
WebApp Building
Stack: React + TypeScript + Vite + Tailwind CSS + shadcn/ui
Workflow
scripts/init-webapp.sh <website-title>— Initialize project in /mnt/okcomputer/output/app, with website title- Edit source code in
src/ - Build the React app
- Deploy the build output in
/mnt/okcomputer/output/app/dist/
Quick Start
1. Initialize
# init project in /mnt/okcomputer/output/app with website title
bash scripts/init-webapp.sh <website-title>
cd /mnt/okcomputer/output/app
AI Agent Notes:
- The project path is /mnt/okcomputer/output/app
- Non-interactive execution with auto-confirm
This creates a fully configured project with:
- ✅ React + TypeScript (via Vite)
- ✅ Tailwind CSS 3.4.19 with shadcn/ui theming system
- ✅ Path aliases (
@/) configured - ✅ 40+ shadcn/ui components pre-installed
- ✅ All Radix UI dependencies included
- ✅ Production build optimization with Vite
- ✅ Node 20+ compatibility (auto-detects and pins Vite version)
2. Develop
Edit generated files in src/: page sections go in src/sections/, custom React hooks in src/hooks/, and TypeScript definitions in src/types/.
3. Build
# within project:
cd /mnt/okcomputer/output/app && npm run build 2>&1
Output (dist/):
index.html— Entry pointassets/index-[hash].js— Bundled JSassets/index-[hash].css— Bundled CSS- Optimized images, fonts, other assets
Optimizations: Tree-shaking, code splitting, asset compression, minification, cache-busting hashes.
4. Deploy
Deploy the build output in /mnt/okcomputer/output/app/dist/
Debugging
- Fix source files
npm run build- Test
dist/ - Redeploy
Reference
Version History
- 2328a17 Current 2026-08-20 10:32
