add-service
Scaffold a full API service module (service, hook, type) with one command.
Install
mkdir -p .claude/skills/add-service && curl -L -o skill.zip "https://agentskills.codes/api/skills/download/11259" && unzip -o skill.zip -d .claude/skills/add-service && rm skill.zipInstalls to .claude/skills/add-service
Activation
This is the description your AI agent reads to decide when to run this skill — the better it matches your request, the more reliably it fires.
새 API 서비스를 생성합니다. service + hook + type 세트를 함께 생성합니다. 사용법: /add-service EntityNameKey capabilities
- →Generates TypeScript types for entities
- →Creates API service modules
- →Generates custom API hooks
- →Adds barrel exports
How it works
The tool generates a set of boilerplate files (types, service, hook) based on a provided entity name, following a predefined project structure.
Inputs & outputs
When to use add-service
- →Add new API service module
- →Generate entity CRUD types
- →Create custom API hook
About this skill
Add Service
새 API 도메인 추가 시 서비스, 훅, 타입을 한 번에 생성합니다.
Instructions
- 사용자로부터 엔티티 이름(PascalCase)을 받습니다
- 다음 3개 파일을 생성합니다:
src/types/{entityName}.tssrc/services/{entityName}Service.tssrc/hooks/use{EntityName}s.ts
- API_SPEC.md와 엔드포인트가 일치하는지 확인합니다
Type Template
// src/types/{entityName}.ts
export interface ${EntityName} {
id: string;
projectId: string;
// TODO: Add entity-specific fields
createdAt: string;
updatedAt: string;
}
export interface Create${EntityName}Input {
projectId: string;
}
export interface Update${EntityName}Input {
// TODO: Add updatable fields
}
Service Template
// src/services/${entityName}Service.ts
import api from "@/api/client";
import type { ApiResponse } from "@/types/api";
import type { ${EntityName}, Create${EntityName}Input, Update${EntityName}Input } from "@/types/${entityName}";
const BASE_URL = "/api";
export const ${entityName}Service = {
getAll: async (projectId: string): Promise<ApiResponse<${EntityName}[]>> => {
const response = await api.get(`${BASE_URL}/projects/${projectId}/${entityName}s`);
return response.data;
},
getById: async (id: string): Promise<ApiResponse<${EntityName}>> => {
const response = await api.get(`${BASE_URL}/${entityName}s/${id}`);
return response.data;
},
create: async (payload: Create${EntityName}Input): Promise<ApiResponse<${EntityName}>> => {
const response = await api.post(
`${BASE_URL}/projects/${payload.projectId}/${entityName}s`,
payload
);
return response.data;
},
update: async (id: string, payload: Update${EntityName}Input): Promise<ApiResponse<${EntityName}>> => {
const response = await api.patch(`${BASE_URL}/${entityName}s/${id}`, payload);
return response.data;
},
delete: async (id: string): Promise<ApiResponse<void>> => {
const response = await api.delete(`${BASE_URL}/${entityName}s/${id}`);
return response.data;
},
};
Hook
add-hook Skill을 사용하여 훅을 생성합니다.
Checklist
- 타입 파일에 필수 필드 정의
- API_SPEC.md와 엔드포인트 일치 확인
- barrel export 추가
Examples
/add-service Bookmark
→ 3개 파일 생성:
src/types/bookmark.tssrc/services/bookmarkService.tssrc/hooks/useBookmarks.ts
When not to use it
- →Manual file creation for simple entities
- →Modifying existing services without spec updates
Limitations
- →Requires manual field definition in types
- →Needs API_SPEC.md alignment
How it compares
It automates the creation of a full service-hook-type set, ensuring consistency across the codebase.
Compared to similar skills
add-service side by side with the closest alternatives in the catalog.
| Skill | Installs | Updated | Safety | Difficulty |
|---|---|---|---|---|
| add-service (this skill) | 0 | 5mo | No flags | Beginner |
| nx-generate | 1 | 6mo | Review | Beginner |
| zustand | 113 | 2mo | No flags | Intermediate |
| web-artifacts-builder | 49 | 3mo | Review | Intermediate |
Try saying
Example prompts that trigger this skill in your AI assistant.
More by diegosouzapw
View all by diegosouzapw →You might also like
nx-generate
nrwl
Generate code using nx generators. USE WHEN scaffolding code or transforming existing code - for example creating libraries or applications, or anything else that is boilerplate code or automates repetitive tasks. ALWAYS use this first when generating code with Nx instead of calling MCP tools or running nx generate immediately.
zustand
lobehub
Zustand state management guide. Use when working with store code (src/store/**), implementing actions, managing state, or creating slices. Triggers on Zustand store development, state management questions, or action implementation.
web-artifacts-builder
anthropics
Suite of tools for creating elaborate, multi-component claude.ai HTML artifacts using modern frontend web technologies (React, Tailwind CSS, shadcn/ui). Use for complex artifacts requiring state management, routing, or shadcn/ui components - not for simple single-file HTML/JSX artifacts.
landing-page-guide-v2
bear2u
Create distinctive, high-converting landing pages that combine proven conversion elements with exceptional design quality. Build beautiful, memorable landing pages using Next.js 14+ and ShadCN UI that avoid generic AI aesthetics while following the 11 essential elements framework.
react
lobehub
React component development guide. Use when working with React components (.tsx files), creating UI, using @lobehub/ui components, implementing routing, or building frontend features. Triggers on React component creation, modification, layout implementation, or navigation tasks.
frontend-prompt-generator
gharam1234
Generate structured prompts for frontend development tasks following established patterns. Use when the user requests prompts for wireframes, UI implementation, data binding, or routing functionality in React/Next.js projects with specific formatting requirements (Cursor rules, file paths, test-driven development).