Unify OpenCode and Codex starter kits
- Add .shared/prompts/ with tool-neutral prompts - Add .opencode/config/project.md, rules/, skills/ from opencode-kit - Add .codex/config/project.md from codex-kit - Copy .shared/prompts/ to both .opencode/prompts/ and .codex/prompts/ - Add features/INDEX.md and features/README.md - Update README with unified structure The two original starter kits are now redundant.
This commit is contained in:
59
.opencode/skills/frontend/SKILL.md
Normal file
59
.opencode/skills/frontend/SKILL.md
Normal file
@@ -0,0 +1,59 @@
|
||||
---
|
||||
name: frontend
|
||||
description: Builds UI components with React, Tailwind CSS, and shadcn/ui
|
||||
category: development
|
||||
---
|
||||
|
||||
# Frontend Developer
|
||||
|
||||
Builds the UI components for a feature using React, Next.js, Tailwind CSS, and shadcn/ui.
|
||||
|
||||
## When to Use
|
||||
|
||||
```
|
||||
/frontend features/PROJ-X-feature-name.md
|
||||
```
|
||||
|
||||
## Skill Steps
|
||||
|
||||
1. **Read context**
|
||||
- Read `features/INDEX.md` for feature overview
|
||||
- Read the feature spec for requirements
|
||||
- Check existing components: `ls src/components/ui/`
|
||||
|
||||
2. **Check shadcn/ui availability**
|
||||
- List installed components in `src/components/ui/`
|
||||
- Install missing with: `npx shadcn@latest add <component-name>`
|
||||
|
||||
3. **Implement UI**
|
||||
- Build components in `src/components/` and `src/app/`
|
||||
- Use existing shadcn/ui components (NEVER recreate)
|
||||
- Follow Tailwind CSS patterns
|
||||
- Add TypeScript types
|
||||
|
||||
4. **Write tests**
|
||||
- Unit tests next to source files (`*.test.ts` next to `*.ts`)
|
||||
|
||||
5. **Lint**
|
||||
- Run `npm run lint` after changes
|
||||
|
||||
6. **Update tracking**
|
||||
- Mark feature as "Frontend Done" in `features/INDEX.md`
|
||||
|
||||
7. **Suggest next step**
|
||||
- Recommend `/backend` or `/qa` next
|
||||
|
||||
## Rules
|
||||
|
||||
- **shadcn/ui first**: Always check `src/components/ui/` before creating new components
|
||||
- **Tailwind CSS**: Use utility classes, never raw CSS
|
||||
- **TypeScript**: All components must be typed
|
||||
- **Tests**: Write unit tests for all components
|
||||
- **Lint**: Run lint after every change
|
||||
|
||||
## Context Recovery
|
||||
|
||||
If context is compacted:
|
||||
1. Re-read feature spec
|
||||
2. Check `git diff` for uncommitted changes
|
||||
3. Continue implementation
|
||||
Reference in New Issue
Block a user