Codex 또는 Claude로 설치 이 Prompt를 복사해 Codex, Claude 또는 다른 어시스턴트에 붙여 넣으면 Skill 페이지를 검토하고 설치를 진행할 수 있습니다.
직접 명령은 검토 Prompt를 거치지 않습니다. 실행하기 전에 소스를 확인하세요.
npx skills add https://github.com/mag123c/linkhub --skill developer명령은 한 줄로 유지됩니다. 복사하기 전에 가로로 스크롤해 전체 내용을 확인하세요.
로컬 사본을 원하시나요? SkillsMP에서 현재 제공할 수 있는 파일을 다운로드하세요.
SKILL.md 표시 중
SOC 직업 분류 기준
| name | developer |
| description | 기능 개발 스킬. 타입 정의, Storage API, 비즈니스 로직. 코드 작성 시 사용. |
React + TypeScript + Vite + Tailwind CSS + Chrome Storage API + Vitest
구조 = 인터페이스/타입 (TypeScript)
로직 = 순수 함수 (FP)
| 원칙 | 적용 |
|---|---|
| SRP | 하나의 함수 = 하나의 책임 |
| 순수 함수 | 입력 → 출력만, 사이드 이펙트는 경계에서 |
| 불변성 | 객체 수정 대신 새 객체 반환 |
| 명확한 의도 | 이름이 곧 문서, 주석 최소화 |
Chrome Storage API 직접 호출 금지. 반드시 Storage 유틸리티 통해 접근:
src/
├── shared/
│ ├── types/ # 타입 정의
│ │ ├── link.types.ts
│ │ └── settings.types.ts
│ ├── storage/ # Storage 래퍼
│ │ ├── link.storage.ts
│ │ └── settings.storage.ts
│ └── utils/ # 유틸리티 함수
│ ├── search.ts
│ └── export.ts
// link.storage.ts
import type { Link } from '../types/link.types';
const STORAGE_KEY = 'linkhub_links';
export async function getLinks(): Promise<Link[]> {
const result = await chrome.storage.local.get(STORAGE_KEY);
return result[STORAGE_KEY] || [];
}
export async function saveLink(link: Link): Promise<void> {
const links = await getLinks();
const updated = [...links, link];
await chrome.storage.local.set({ [STORAGE_KEY]: updated });
}
export async function deleteLink(id: string): Promise<void> {
const links = await getLinks();
const filtered = links.filter(l => l.id !== id);
await chrome.storage.local.set({ [STORAGE_KEY]: filtered });
}
// 엔터티 타입
export interface Link {
id: string;
url: string;
title: string;
favicon?: string;
tags: string[];
memo?: string;
isReadLater: boolean;
createdAt: number;
updatedAt: number;
}
// 입력 타입 (생성/수정용)
export type CreateLinkInput = Omit<Link, 'id' | 'createdAt' | 'updatedAt'>;
export type UpdateLinkInput = Partial<CreateLinkInput>;
상세 구현은 기존 코드베이스 분석