Webapp building

Skill serejaris/kimi-skills/skills/webapp-building

Полная коллекция скиллов Kimi (267 built-in + 7 plugin skills), выгруженная из сандбокса агента

Install

npx -y skills add serejaris/kimi-skills --skill webapp-building

Assembled from the repository path, not quoted from the project. Check it against their README if it does not work.

2 things to look at

19 days oldThe repository was created 19 days ago. New is not bad, but a brand new repository carrying a familiar-sounding name is the shape a typosquat arrives in, and there has been no time for anyone else to find a problem with it.
4 stars4 stars. Stars are a popularity signal and not a quality one, but at this level it is likely that nobody has read this closely except its author, and you would be relying on your own review.

What its author says it does

Copied from the file, not written here

Tools for building modern React webapps with TypeScript, Tailwind CSS and shadcn/ui. Best suited for applications with complex UI components and state management. Supports optional templates for specialized requirement.

SKILL.md

2.3 KB, as published. Nobody here has run it

WebApp Building

Stack: React + TypeScript + Vite + Tailwind CSS + shadcn/ui

Workflow

scripts/init-webapp.sh <website-title> [template-name] — Initialize project in /mnt/agents/output/app
- Without template: creates base project with 40+ shadcn/ui components
- With template: applies specialized template and outputs template-specific config info
Edit source code in src/ (or src/config.ts for templates)
Build the React app

Quick Start

1. Initialize

# init project in /mnt/agents/output/app with website title
bash scripts/init-webapp.sh <website-title> [template-name]
cd /mnt/agents/output/app

AI Agent Notes:

The project path is /mnt/agents/output/app
Non-interactive execution with auto-confirm
If template-name is provided, the script will output template-specific information (config options, build instructions, etc.)

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/.

For templates: edit src/config.ts to customize content. Do not modify component files — all content configuration is in config.ts.

3. Build

# within project:
cd /mnt/agents/output/app && npm run build 2>&1

Output (dist/):

index.html — Entry point
assets/index-[hash].js — Bundled JS
assets/index-[hash].css — Bundled CSS
Optimized images, fonts, other assets

Optimizations: Tree-shaking, code splitting, asset compression, minification, cache-busting hashes.

Debugging

Fix source files
npm run build
Test dist/

Reference

shadcn/ui Components