skills

๐Ÿ› ๏ธ ์—์ด์ „ํŠธ ์Šคํ‚ฌ

100
ๅฎ‰่ฃ…ๅ‘ฝไปค
npx skhub add --skillset @dalestudy/skills

ๅŒ…ๅซ็š„ๆŠ€่ƒฝ

Node.js ๋Œ€์‹  Bun ๋Ÿฐํƒ€์ž„ ์‚ฌ์šฉ์„ ์œ„ํ•œ ์Šคํ‚ฌ. ๋‹ค์Œ ์ƒํ™ฉ์—์„œ ์‚ฌ์šฉ: (1) ์ƒˆ JavaScript/TypeScript ํ”„๋กœ์ ํŠธ ์ƒ์„ฑ ์‹œ, (2) package.json ๋˜๋Š” ์˜์กด์„ฑ ๊ด€๋ จ ์ž‘์—… ์‹œ, (3) ์Šคํฌ๋ฆฝํŠธ ์‹คํ–‰ ๋˜๋Š” ๊ฐœ๋ฐœ ์„œ๋ฒ„ ์‹œ์ž‘ ์‹œ, (4) Node.js ํ”„๋กœ์ ํŠธ๋ฅผ Bun์œผ๋กœ ์ „ํ™˜ ์‹œ, (5) 'bun', 'bunx', 'bun.lockb' ํ‚ค์›Œ๋“œ๊ฐ€ ํฌํ•จ๋œ ์ž‘์—… ์‹œ
00
Git ๋ฒ„์ „ ๊ด€๋ฆฌ ๋ชจ๋ฒ” ๊ด€๋ก€ ๋ฐ ์›Œํฌํ”Œ๋กœ์šฐ ๊ฐ€์ด๋“œ. ๋‹ค์Œ ์ƒํ™ฉ์—์„œ ์‚ฌ์šฉ: (1) Git ์ปค๋ฐ‹ ๋ฉ”์‹œ์ง€ ์ž‘์„ฑ ์‹œ (Conventional Commits ๊ทœ์น™ ์ ์šฉ), (2) ๋ธŒ๋žœ์น˜ ์ƒ์„ฑ ๋ฐ ๊ด€๋ฆฌ ์‹œ (GitHub Flow ๊ธฐ๋ฐ˜), (3) PR ์ƒ์„ฑ ๋ฐ ๋ณ‘ํ•ฉ ์ „๋žต ์„ ํƒ ์‹œ, (4) Git ํžˆ์Šคํ† ๋ฆฌ ์ •๋ฆฌ ์ž‘์—… ์‹œ (rebase, squash, cherry-pick), (5) Merge conflict ํ•ด๊ฒฐ ์‹œ, (6) 'git', '.git', 'commit', 'branch', 'merge', 'rebase' ํ‚ค์›Œ๋“œ๊ฐ€ ํฌํ•จ๋œ ์ž‘์—… ์‹œ
00
GitHub CLI(gh)๋ฅผ ํ™œ์šฉํ•œ GitHub ํ”Œ๋žซํผ ์ƒํ˜ธ์ž‘์šฉ ๊ฐ€์ด๋“œ. ๋‹ค์Œ ์ƒํ™ฉ์—์„œ ์‚ฌ์šฉ: (1) GitHub ์ด์Šˆ ์ƒ์„ฑ, ์กฐํšŒ, ์ˆ˜์ • ์‹œ, (2) Pull Request ์ƒ์„ฑ, ๋ฆฌ๋ทฐ, ๋ณ‘ํ•ฉ ์‹œ, (3) GitHub ๋ฆด๋ฆฌ์Šค ์ƒ์„ฑ ๋ฐ ๊ด€๋ฆฌ ์‹œ, (4) ๋ ˆ์ด๋ธ”, ๋งˆ์ผ์Šคํ†ค ๋“ฑ ํ”„๋กœ์ ํŠธ ๊ด€๋ฆฌ ์‹œ, (5) GitHub Actions ์›Œํฌํ”Œ๋กœ์šฐ ์‹คํ–‰ ๋ฐ ๊ฒฐ๊ณผ ์กฐํšŒ ์‹œ, (6) 'gh', 'issue', 'pull request', 'PR', 'release', 'label', 'workflow', 'run' ํ‚ค์›Œ๋“œ๊ฐ€ ํฌํ•จ๋œ ์ž‘์—… ์‹œ
00
GitHub Actions ์›Œํฌํ”Œ๋กœ์šฐ ์ƒ์„ฑ, ๋ณด์•ˆ ๋ฐ ๋ฒ„์ „ ๊ด€๋ฆฌ ์Šคํ‚ฌ. ๋‹ค์Œ ์ƒํ™ฉ์—์„œ ์‚ฌ์šฉ: (1) ์ƒˆ ์›Œํฌํ”Œ๋กœ์šฐ ํŒŒ์ผ(.yml) ์ž‘์„ฑ ์‹œ, (2) ๊ธฐ์กด ์›Œํฌํ”Œ๋กœ์šฐ ์ˆ˜์ • ์‹œ, (3) ์•ก์…˜ ๋ฒ„์ „ ๊ฒ€ํ†  ๋˜๋Š” ์—…๋ฐ์ดํŠธ ์‹œ, (4) CI/CD ๋ณด์•ˆ ๊ฐ์‚ฌ ์‹œ, (5) 'actions/', 'uses:', 'workflow', '.github/workflows' ํ‚ค์›Œ๋“œ๊ฐ€ ํฌํ•จ๋œ ์ž‘์—… ์‹œ
00
mcp ์„œ๋ฒ„ ์—ฐ๊ฒฐ ๋ฌธ์ œ๋ฅผ ๋ถ„์„ํ•˜๊ณ  ์ตœ์‹  specification ๊ธฐ์ค€์œผ๋กœ ๊ตฌํ˜„์„ ๊ฒ€์ฆํ•œ๋‹ค. tools/list ๋˜๋Š” tools/call ์˜ค๋ฅ˜, stdio sse http transport ์ด์Šˆ, resources prompts ๋ผ์šฐํŒ… ๋ฌธ์ œ, inspector ๊ธฐ๋ฐ˜ ์žฌํ˜„ ํ…Œ์ŠคํŠธ๊ฐ€ ํ•„์š”ํ•  ๋•Œ ์‚ฌ์šฉํ•œ๋‹ค.
00
React ์„ฑ๋Šฅ ์ตœ์ ํ™” ๋ฐ ๋ฒ ์ŠคํŠธ ํ”„๋ž™ํ‹ฐ์Šค ์Šคํ‚ฌ. Vercel Engineering ๊ฐ€์ด๋“œ ๊ธฐ๋ฐ˜, ํ”„๋ ˆ์ž„์›Œํฌ ๋น„์ข…์†. ๋‹ค์Œ ์ƒํ™ฉ์—์„œ ์‚ฌ์šฉ: (1) React ์ปดํฌ๋„ŒํŠธ(.tsx, .jsx) ์ž‘์„ฑ ๋˜๋Š” ์ˆ˜์ • ์‹œ, (2) ์ƒํƒœ ๊ด€๋ฆฌ, hooks, ๋ฆฌ๋ Œ๋”๋ง ์ตœ์ ํ™” ์ž‘์—… ์‹œ, (3) ๋น„๋™๊ธฐ ๋ฐ์ดํ„ฐ ํŽ˜์นญ ๋˜๋Š” Suspense ํŒจํ„ด ์ž‘์—… ์‹œ, (4) ๋ฒˆ๋“ค ์‚ฌ์ด์ฆˆ ์ตœ์ ํ™” ๋˜๋Š” ์ฝ”๋“œ ์Šคํ”Œ๋ฆฌํŒ… ์‹œ, (5) 'react', 'useState', 'useEffect', 'useMemo', 'useCallback', 'memo', 'Suspense', 'lazy' ํ‚ค์›Œ๋“œ๊ฐ€ ํฌํ•จ๋œ ์ž‘์—… ์‹œ
00
DaleStudy/skills ์ €์žฅ์†Œ์˜ ์Šคํ‚ฌ ์ƒ์„ฑ, ์ˆ˜์ •, ๊ฒ€์ฆ ์‹œ ์‚ฌ์šฉ. ๋‹ค์Œ ์ƒํ™ฉ์—์„œ ํ™œ์„ฑํ™”: (1) ์ƒˆ ์Šคํ‚ฌ ์ƒ์„ฑ ์š”์ฒญ ์‹œ, (2) skills/ ๋””๋ ‰ํ† ๋ฆฌ ๋‚ด SKILL.md ํŒŒ์ผ ์ˆ˜์ • ์‹œ, (3) SKILL.md ๋ณ€๊ฒฝ ๊ฒ€ํ†  ๋˜๋Š” ๋ฆฌ๋ทฐ ์‹œ, (4) ์Šคํ‚ฌ frontmatter ๋˜๋Š” ๋ฉ”ํƒ€๋ฐ์ดํ„ฐ ์ž‘์—… ์‹œ, (5) 'skill', 'SKILL.md', 'frontmatter', 'version', 'metadata', 'review', 'skills/' ํ‚ค์›Œ๋“œ๊ฐ€ ํฌํ•จ๋œ ์ž‘์—… ์‹œ
00
Storybook ์Šคํ† ๋ฆฌ ์ž‘์„ฑ ๋ฐ CSF 3.0 ๋ฒ ์ŠคํŠธ ํ”„๋ž™ํ‹ฐ์Šค ์Šคํ‚ฌ. ๋‹ค์Œ ์ƒํ™ฉ์—์„œ ์‚ฌ์šฉ: (1) ์ƒˆ ์Šคํ† ๋ฆฌ ํŒŒ์ผ(.stories.tsx, .stories.ts) ์ž‘์„ฑ ์‹œ, (2) ๊ธฐ์กด ์Šคํ† ๋ฆฌ ์ˆ˜์ • ์‹œ, (3) Args, Decorators, Parameters ์„ค์ • ์‹œ, (4) Storybook ์„ค์ • ํŒŒ์ผ(.storybook/) ์ž‘์—… ์‹œ, (5) 'story', 'stories', 'storybook', 'CSF' ํ‚ค์›Œ๋“œ๊ฐ€ ํฌํ•จ๋œ ์ž‘์—… ์‹œ
00
React Testing Library ๋ฐ Vitest ๊ธฐ๋ฐ˜ ํ…Œ์ŠคํŒ… ๋ชจ๋ฒ” ๊ด€๋ก€. ๋‹ค์Œ ์ƒํ™ฉ์—์„œ ์‚ฌ์šฉ: (1) .test.tsx, .test.ts, .spec.tsx, .spec.ts ํŒŒ์ผ ์ž‘์—… ์‹œ, (2) ์ปดํฌ๋„ŒํŠธ ํ…Œ์ŠคํŠธ ์ž‘์„ฑ ๋˜๋Š” ๋ฆฌํŒฉํ† ๋ง ์‹œ, (3) 'test', 'testing', 'vitest', 'RTL', 'getByRole', 'userEvent', 'waitFor', 'expect' ํ‚ค์›Œ๋“œ ํฌํ•จ ์ž‘์—… ์‹œ, (4) ๋น„๋™๊ธฐ ๋กœ์ง ๋˜๋Š” ์‚ฌ์šฉ์ž ์ƒํ˜ธ์ž‘์šฉ ํ…Œ์ŠคํŠธ ์ž‘์„ฑ ์‹œ
00
TypeScript ํƒ€์ž… ์ •์˜ ๋ฐ ๋ฒ ์ŠคํŠธ ํ”„๋ž™ํ‹ฐ์Šค ์Šคํ‚ฌ. ๋‹ค์Œ ์ƒํ™ฉ์—์„œ ์‚ฌ์šฉ: (1) TypeScript ํŒŒ์ผ(.ts, .tsx) ์ž‘์„ฑ ๋˜๋Š” ์ˆ˜์ • ์‹œ, (2) ํƒ€์ž… ์ •์˜(interface, type) ์ž‘์—… ์‹œ, (3) tsconfig.json ์„ค์ • ๋˜๋Š” ์ปดํŒŒ์ผ๋Ÿฌ ์˜ต์…˜ ์กฐ์ • ์‹œ, (4) ํƒ€์ž… ์—๋Ÿฌ ํ•ด๊ฒฐ ๋˜๋Š” ํƒ€์ž… ์•ˆ์ „์„ฑ ๊ฐœ์„  ์‹œ, (5) ์ œ๋„ค๋ฆญ, ์œ ํ‹ธ๋ฆฌํ‹ฐ ํƒ€์ž…, ํƒ€์ž… ์กฐ์ž‘ ์ž‘์—… ์‹œ, (6) 'typescript', 'ts', 'type', 'interface', 'generic' ํ‚ค์›Œ๋“œ๊ฐ€ ํฌํ•จ๋œ ์ž‘์—… ์‹œ
00