1> ## Documentation Index
2> Fetch the complete documentation index at: https://code.claude.com/docs/llms.txt
3> Use this file to discover all available pages before exploring further.
4
5# Claude Code 개요
6
7> Claude Code는 코드베이스를 읽고, 파일을 편집하고, 명령을 실행하고, 개발 도구와 통합하는 에이전트 코딩 도구입니다. 터미널, IDE, 데스크톱 앱 및 브라우저에서 사용할 수 있습니다.
8
9export const InstallConfigurator = ({defaultSurface = 'terminal'}) => {
10 const TERM = {
11 mac: {
12 label: 'macOS / Linux',
13 cmd: 'curl -fsSL https://claude.ai/install.sh | bash'
14 },
15 win: {
16 label: 'Windows'
17 },
18 brew: {
19 label: 'Homebrew',
20 cmd: 'brew install --cask claude-code'
21 },
22 winget: {
23 label: 'WinGet',
24 cmd: 'winget install Anthropic.ClaudeCode'
25 }
26 };
27 const WIN_VARIANTS = {
28 ps: 'irm https://claude.ai/install.ps1 | iex',
29 cmd: 'curl -fsSL https://claude.ai/install.cmd -o install.cmd && install.cmd && del install.cmd'
30 };
31 const TABS = [{
32 key: 'terminal',
33 label: 'Terminal'
34 }, {
35 key: 'desktop',
36 label: 'Desktop'
37 }, {
38 key: 'vscode',
39 label: 'VS Code'
40 }, {
41 key: 'jetbrains',
42 label: 'JetBrains'
43 }];
44 const ALT_TARGETS = {
45 desktop: {
46 name: 'Desktop',
47 tagline: 'The full agent in a native app for macOS and Windows.',
48 installLabel: 'Download the app',
49 installHref: 'https://claude.com/download?utm_source=claude_code&utm_medium=docs&utm_content=configurator_desktop_download',
50 guideHref: '/en/desktop-quickstart'
51 },
52 vscode: {
53 name: 'VS Code',
54 tagline: 'Review diffs, manage context, and chat without leaving your editor.',
55 installLabel: 'Install from Marketplace',
56 installHref: 'https://marketplace.visualstudio.com/items?itemName=anthropic.claude-code',
57 altCmd: 'code --install-extension anthropic.claude-code',
58 guideHref: '/en/vs-code'
59 },
60 jetbrains: {
61 name: 'JetBrains',
62 tagline: 'Native plugin for IntelliJ, PyCharm, WebStorm, and other JetBrains IDEs.',
63 installLabel: 'Install from Marketplace',
64 installHref: 'https://plugins.jetbrains.com/plugin/27310-claude-code-beta-',
65 guideHref: '/en/jetbrains'
66 }
67 };
68 const PROVIDERS = [{
69 key: 'anthropic',
70 label: 'Anthropic'
71 }, {
72 key: 'bedrock',
73 label: 'Amazon Bedrock'
74 }, {
75 key: 'foundry',
76 label: 'Microsoft Foundry'
77 }, {
78 key: 'vertex',
79 label: 'Google Vertex AI'
80 }];
81 const PROVIDER_NOTICE = {
82 bedrock: <>
83 <strong>Configure your AWS account first.</strong> Running on Bedrock
84 requires model access enabled in the AWS console and IAM credentials.{' '}
85 <a href="/en/amazon-bedrock">Bedrock setup guide →</a>
86 </>,
87 vertex: <>
88 <strong>Configure your GCP project first.</strong> Running on Vertex AI
89 requires the Vertex API enabled and a service account with the right
90 permissions.{' '}
91 <a href="/en/google-vertex-ai">Vertex setup guide →</a>
92 </>,
93 foundry: <>
94 <strong>Configure your Azure resources first.</strong> Running on
95 Microsoft Foundry requires an Azure subscription with a Foundry resource
96 and model deployments provisioned.{' '}
97 <a href="/en/microsoft-foundry">Foundry setup guide →</a>
98 </>
99 };
100 const iconCheck = (size = 14) => <svg width={size} height={size} viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="3" strokeLinecap="round" strokeLinejoin="round" aria-hidden="true">
101 <polyline points="20 6 9 17 4 12" />
102 </svg>;
103 const iconCopy = (size = 14) => <svg width={size} height={size} viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" aria-hidden="true">
104 <rect x="9" y="9" width="13" height="13" rx="2" />
105 <path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1" />
106 </svg>;
107 const iconArrowRight = (size = 13) => <svg width={size} height={size} viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2.5" strokeLinecap="round" strokeLinejoin="round" aria-hidden="true">
108 <line x1="5" y1="12" x2="19" y2="12" />
109 <polyline points="12 5 19 12 12 19" />
110 </svg>;
111 const iconArrowUpRight = (size = 14) => <svg width={size} height={size} viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2.5" strokeLinecap="round" strokeLinejoin="round" aria-hidden="true">
112 <line x1="7" y1="17" x2="17" y2="7" />
113 <polyline points="7 7 17 7 17 17" />
114 </svg>;
115 const iconInfo = (size = 16) => <svg width={size} height={size} viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" aria-hidden="true">
116 <circle cx="12" cy="12" r="10" />
117 <line x1="12" y1="16" x2="12" y2="12" />
118 <line x1="12" y1="8" x2="12.01" y2="8" />
119 </svg>;
120 const [target, setTarget] = useState(defaultSurface);
121 const [team, setTeam] = useState(false);
122 const [provider, setProvider] = useState('anthropic');
123 const [pkg, setPkg] = useState(() => (/Win/).test(navigator.userAgent) ? 'win' : 'mac');
124 const [winCmd, setWinCmd] = useState(false);
125 const [copied, setCopied] = useState(null);
126 const copyTimer = useRef(null);
127 const handleCopy = async (text, key) => {
128 try {
129 await navigator.clipboard.writeText(text);
130 } catch {
131 const ta = document.createElement('textarea');
132 ta.value = text;
133 document.body.appendChild(ta);
134 ta.select();
135 document.execCommand('copy');
136 document.body.removeChild(ta);
137 }
138 clearTimeout(copyTimer.current);
139 setCopied(key);
140 copyTimer.current = setTimeout(() => setCopied(null), 1800);
141 };
142 const cardBodyCmd = (cmd, prompt) => {
143 const on = copied === 'term';
144 return <div className="cc-ic-card-body">
145 <span className="cc-ic-prompt">{prompt || '$'}</span>
146 <div className="cc-ic-cmd">{cmd}</div>
147 <button type="button" className={'cc-ic-copy' + (on ? ' cc-ic-copied' : '')} onClick={() => handleCopy(cmd, 'term')}>
148 {on ? iconCheck(13) : iconCopy(13)}
149 <span>{on ? 'Copied' : 'Copy'}</span>
150 </button>
151 </div>;
152 };
153 const isWinInstaller = pkg === 'win';
154 const isWinPrompt = pkg === 'win' || pkg === 'winget';
155 const terminalCmd = isWinInstaller ? WIN_VARIANTS[winCmd ? 'cmd' : 'ps'] : TERM[pkg].cmd;
156 const alt = ALT_TARGETS[target];
157 const showNotice = team && provider !== 'anthropic';
158 const STYLES = `
159.cc-ic {
160 --ic-slate: #141413;
161 --ic-clay: #d97757;
162 --ic-clay-deep: #c6613f;
163 --ic-gray-000: #ffffff;
164 --ic-gray-150: #f0eee6;
165 --ic-gray-550: #73726c;
166 --ic-gray-700: #3d3d3a;
167 --ic-border-subtle: rgba(31, 30, 29, 0.08);
168 --ic-border-default: rgba(31, 30, 29, 0.15);
169 --ic-border-strong: rgba(31, 30, 29, 0.3);
170 --ic-font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, 'Courier New', monospace;
171 font-family: 'Anthropic Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
172 font-size: 14px; line-height: 1.5; color: var(--ic-slate);
173 margin: 8px 0 32px;
174}
175.dark .cc-ic {
176 --ic-slate: #f0eee6;
177 --ic-gray-000: #262624;
178 --ic-gray-150: #1f1e1d;
179 --ic-gray-550: #91908a;
180 --ic-gray-700: #bfbdb4;
181 --ic-border-subtle: rgba(240, 238, 230, 0.08);
182 --ic-border-default: rgba(240, 238, 230, 0.14);
183 --ic-border-strong: rgba(240, 238, 230, 0.28);
184}
185.dark .cc-ic-check { background: transparent; }
186.dark .cc-ic-card { border: 0.5px solid var(--ic-border-subtle); }
187.dark .cc-ic-p-pill.cc-ic-active { box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3); }
188.cc-ic *, .cc-ic *::before, .cc-ic *::after { box-sizing: border-box; }
189.cc-ic a { text-decoration: none; }
190.cc-ic a:not([class]) { color: inherit; }
191.cc-ic button { font-family: inherit; cursor: pointer; }
192
193.cc-ic-tab-strip {
194 display: inline-flex; gap: 2px;
195 padding: 4px; background: var(--ic-gray-150);
196 border-radius: 10px; overflow-x: auto;
197 max-width: 100%;
198}
199.cc-ic-tab {
200 appearance: none; background: none; border: none;
201 padding: 10px 18px; font-size: 15px; font-weight: 430;
202 color: var(--ic-gray-550); border-radius: 7px;
203 white-space: nowrap;
204 transition: color 0.12s, background-color 0.12s;
205}
206.cc-ic-tab:hover { color: var(--ic-gray-700); }
207.cc-ic-tab.cc-ic-active {
208 color: var(--ic-slate); font-weight: 500;
209 background: var(--ic-gray-000);
210 box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
211}
212.dark .cc-ic-tab.cc-ic-active { box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4); }
213
214.cc-ic-team-wrap { padding: 16px 0 20px; }
215.cc-ic-team-toggle {
216 display: flex; align-items: center; gap: 12px; font-family: inherit;
217 padding: 12px 16px; font-size: 14px; font-weight: 430;
218 color: var(--ic-gray-700); cursor: pointer; user-select: none;
219 width: fit-content; background: var(--ic-gray-150);
220 border: 0.5px solid var(--ic-border-subtle); border-radius: 8px;
221 transition: border-color 0.15s;
222}
223.cc-ic-team-toggle:hover { border-color: var(--ic-border-default); }
224.cc-ic-team-toggle.cc-ic-checked {
225 background: rgba(217, 119, 87, 0.08);
226 border-color: rgba(217, 119, 87, 0.25);
227}
228.cc-ic-check {
229 width: 16px; height: 16px;
230 border: 1px solid var(--ic-border-strong); border-radius: 4px;
231 background: var(--ic-gray-000);
232 display: flex; align-items: center; justify-content: center;
233 flex-shrink: 0;
234}
235.cc-ic-check svg { color: #fff; display: none; }
236.cc-ic-team-toggle.cc-ic-checked .cc-ic-check { background: var(--ic-clay-deep); border-color: var(--ic-clay-deep); }
237.cc-ic-team-toggle.cc-ic-checked .cc-ic-check svg { display: block; }
238
239.cc-ic-team-reveal { display: flex; flex-direction: column; gap: 12px; margin-bottom: 16px; }
240.cc-ic-sales {
241 display: flex; align-items: center; justify-content: space-between;
242 gap: 16px; padding: 14px 16px;
243 background: var(--ic-gray-000); border: 0.5px solid var(--ic-border-default);
244 border-radius: 8px; flex-wrap: wrap;
245}
246.cc-ic-sales-text { font-size: 13px; color: var(--ic-gray-700); line-height: 1.5; flex: 1; min-width: 200px; }
247.cc-ic-sales-text strong { font-weight: 550; color: var(--ic-slate); }
248.cc-ic-sales-actions { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
249.cc-ic-btn-clay {
250 display: inline-flex; align-items: center; gap: 8px;
251 background: var(--ic-clay-deep); color: #fff; border: none;
252 border-radius: 8px; padding: 8px 14px;
253 font-size: 13px; font-weight: 500;
254 transition: background-color 0.15s; white-space: nowrap;
255}
256.cc-ic-btn-clay:hover { background: var(--ic-clay); }
257.cc-ic-btn-ghost {
258 display: inline-flex; align-items: center; gap: 8px;
259 background: transparent; color: var(--ic-gray-700);
260 border: 0.5px solid var(--ic-border-default);
261 border-radius: 8px; padding: 8px 14px;
262 font-size: 13px; font-weight: 500;
263}
264.cc-ic-btn-ghost:hover { background: rgba(0, 0, 0, 0.04); }
265
266.cc-ic-provider-bar {
267 display: flex; align-items: center; gap: 12px;
268 padding: 14px 16px; background: var(--ic-gray-150);
269 border-radius: 8px; font-size: 13px; flex-wrap: wrap;
270}
271.cc-ic-provider-bar .cc-ic-label { color: var(--ic-gray-550); flex-shrink: 0; }
272.cc-ic-provider-pills { display: flex; gap: 4px; flex-wrap: wrap; }
273.cc-ic-p-pill {
274 appearance: none; border: none; background: transparent;
275 padding: 6px 12px; border-radius: 6px;
276 font-size: 13px; font-weight: 430; color: var(--ic-gray-700);
277 white-space: nowrap;
278}
279.cc-ic-p-pill:hover { background: rgba(0, 0, 0, 0.04); }
280.cc-ic-p-pill.cc-ic-active {
281 background: var(--ic-gray-000); color: var(--ic-slate);
282 font-weight: 500; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
283}
284.cc-ic-provider-notice {
285 display: flex; padding: 16px 18px;
286 background: var(--ic-gray-000); border: 0.5px solid var(--ic-border-default);
287 border-radius: 8px; gap: 14px; align-items: flex-start;
288}
289.cc-ic-provider-notice > svg { color: var(--ic-gray-550); margin-top: 2px; flex-shrink: 0; }
290.cc-ic-provider-notice-body { font-size: 14px; line-height: 1.55; color: var(--ic-gray-700); }
291.cc-ic-provider-notice-body strong { font-weight: 550; color: var(--ic-slate); }
292.cc-ic-provider-notice-body a { color: var(--ic-clay-deep); font-weight: 500; }
293.cc-ic-provider-notice-body a:hover { text-decoration: underline; }
294
295.cc-ic-card { background: #141413; border-radius: 12px; overflow: hidden; }
296.cc-ic-subtabs {
297 display: flex; align-items: center;
298 background: #1a1918;
299 border-bottom: 0.5px solid rgba(255, 255, 255, 0.08);
300 padding: 0 8px; overflow-x: auto;
301}
302.cc-ic-subtab {
303 appearance: none; background: none; border: none;
304 padding: 12px 16px; font-size: 12px;
305 color: rgba(255, 255, 255, 0.5);
306 position: relative; white-space: nowrap;
307}
308.cc-ic-subtab:hover { color: rgba(255, 255, 255, 0.75); }
309.cc-ic-subtab.cc-ic-active { color: #fff; }
310.cc-ic-subtab.cc-ic-active::after {
311 content: ''; position: absolute;
312 left: 12px; right: 12px; bottom: -0.5px;
313 height: 2px; background: var(--ic-clay);
314}
315.cc-ic-shell-switch {
316 display: inline-flex; gap: 2px;
317 margin: 14px 26px 0; padding: 3px;
318 background: rgba(255, 255, 255, 0.06);
319 border: 0.5px solid rgba(255, 255, 255, 0.08);
320 border-radius: 8px;
321 font-family: inherit;
322}
323.cc-ic-shell-option {
324 font: inherit; font-size: 12px; font-weight: 500;
325 padding: 5px 12px; border-radius: 6px;
326 background: transparent; border: none;
327 color: rgba(255, 255, 255, 0.55);
328 cursor: pointer; user-select: none; white-space: nowrap;
329 transition: color 120ms ease, background-color 120ms ease;
330}
331.cc-ic-shell-option:hover { color: rgba(255, 255, 255, 0.85); }
332.cc-ic-shell-option.cc-ic-active {
333 background: rgba(255, 255, 255, 0.12);
334 color: #fff;
335 box-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
336}
337
338.cc-ic-card-body { padding: 24px 26px; display: flex; align-items: flex-start; gap: 14px; }
339.cc-ic-prompt {
340 color: var(--ic-clay); font-family: var(--ic-font-mono);
341 font-size: 17px; user-select: none; padding-top: 2px;
342}
343.cc-ic-cmd {
344 flex: 1; font-family: var(--ic-font-mono);
345 font-size: 17px; color: #f0eee6;
346 line-height: 1.55; white-space: pre-wrap; word-break: break-word;
347}
348.cc-ic-copy {
349 display: inline-flex; align-items: center; gap: 6px;
350 background: rgba(255, 255, 255, 0.08);
351 border: 0.5px solid rgba(255, 255, 255, 0.12);
352 color: rgba(255, 255, 255, 0.85);
353 padding: 7px 13px; border-radius: 8px;
354 font-size: 13px; font-weight: 500; flex-shrink: 0;
355}
356.cc-ic-copy:hover { background: rgba(255, 255, 255, 0.14); }
357.cc-ic-copy.cc-ic-copied { background: var(--ic-clay-deep); border-color: var(--ic-clay-deep); color: #fff; }
358
359.cc-ic-below {
360 margin-top: 12px; font-size: 13px; color: var(--ic-gray-550);
361 display: flex; gap: 16px; flex-wrap: wrap; align-items: baseline;
362}
363.cc-ic-below a { color: var(--ic-gray-700); border-bottom: 0.5px solid var(--ic-border-default); }
364.cc-ic-below a:hover { color: var(--ic-clay-deep); border-bottom-color: var(--ic-clay-deep); }
365.cc-ic-handoff {
366 padding: 22px 24px;
367 background: linear-gradient(180deg, #faf9f4 0%, #f3f1e9 100%);
368 border: 0.5px solid var(--ic-border-default);
369 border-radius: 12px;
370 box-shadow: 0 1px 2px rgba(31, 30, 29, 0.04), 0 6px 16px -4px rgba(31, 30, 29, 0.06);
371}
372.dark .cc-ic-handoff {
373 background: linear-gradient(180deg, #262624 0%, #1f1e1d 100%);
374 box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3), 0 6px 16px -4px rgba(0, 0, 0, 0.4);
375}
376.cc-ic-handoff-title {
377 font-size: 16px; font-weight: 550; color: var(--ic-slate);
378 letter-spacing: -0.01em; margin-bottom: 4px;
379}
380.cc-ic-handoff-sub {
381 font-size: 14px; line-height: 1.5; color: var(--ic-gray-700);
382 margin-bottom: 18px;
383}
384.cc-ic-handoff-actions { display: flex; gap: 10px; flex-wrap: wrap; }
385.cc-ic-handoff-alt {
386 margin-top: 12px; font-size: 12px; color: var(--ic-gray-550);
387}
388.cc-ic-handoff-alt code {
389 font-family: var(--ic-font-mono); font-size: 11px;
390 background: var(--ic-gray-150); padding: 2px 6px;
391 border-radius: 4px; color: var(--ic-gray-700);
392}
393.cc-ic-copy-sm {
394 appearance: none; border: none;
395 display: inline-flex; align-items: center; justify-content: center;
396 width: 22px; height: 22px;
397 margin-left: 4px; vertical-align: middle;
398 background: var(--ic-gray-150); color: var(--ic-gray-550);
399 border-radius: 4px;
400 transition: color 0.1s, background-color 0.1s;
401}
402.cc-ic-copy-sm:hover { color: var(--ic-gray-700); background: var(--ic-border-default); }
403.cc-ic-copy-sm.cc-ic-copied { background: var(--ic-clay-deep); color: #fff; }
404
405@media (max-width: 720px) {
406 .cc-ic-tab { padding: 12px 14px; font-size: 14px; }
407 .cc-ic-sales-actions { width: 100%; }
408 .cc-ic-card-body { padding: 20px; }
409 .cc-ic-cmd { font-size: 15px; }
410}
411`;
412 return <div className="cc-ic not-prose">
413 <style>{STYLES}</style>
414
415 {}
416 <div className="cc-ic-tab-strip" role="tablist">
417 {TABS.map(t => <button key={t.key} type="button" role="tab" aria-selected={target === t.key} className={'cc-ic-tab' + (target === t.key ? ' cc-ic-active' : '')} onClick={() => setTarget(t.key)}>
418 {t.label}
419 </button>)}
420 </div>
421
422 {}
423 <div className="cc-ic-team-wrap">
424 <button type="button" role="switch" aria-checked={team} className={'cc-ic-team-toggle' + (team ? ' cc-ic-checked' : '')} onClick={() => setTeam(!team)}>
425 <span className="cc-ic-check">{iconCheck(11)}</span>
426 <span>
427 I’m buying for a team or company (SSO, AWS/Azure/GCP, central billing)
428 </span>
429 </button>
430 </div>
431
432 {}
433 {team && <div className="cc-ic-team-reveal">
434 <div className="cc-ic-sales">
435 <div className="cc-ic-sales-text">
436 <strong>Set up your team:</strong> self-serve or talk to sales.
437 </div>
438 <div className="cc-ic-sales-actions">
439 <a href="https://claude.ai/upgrade?initialPlanType=team&utm_source=claude_code&utm_medium=docs&utm_content=configurator_team_get_started" className="cc-ic-btn-ghost">
440 Get started
441 </a>
442 <a href="https://www.anthropic.com/contact-sales?utm_source=claude_code&utm_medium=docs&utm_content=configurator_team_contact_sales" className="cc-ic-btn-clay">
443 Contact sales {iconArrowRight()}
444 </a>
445 </div>
446 </div>
447
448 <div className="cc-ic-provider-bar">
449 <span className="cc-ic-label">Run on</span>
450 <div className="cc-ic-provider-pills" role="radiogroup" aria-label="Provider">
451 {PROVIDERS.map(p => <button key={p.key} type="button" role="radio" aria-checked={provider === p.key} className={'cc-ic-p-pill' + (provider === p.key ? ' cc-ic-active' : '')} onClick={() => setProvider(p.key)}>
452 {p.label}
453 </button>)}
454 </div>
455 </div>
456
457 {showNotice && <div className="cc-ic-provider-notice">
458 {iconInfo()}
459 <div className="cc-ic-provider-notice-body">
460 {PROVIDER_NOTICE[provider]}
461 </div>
462 </div>}
463 </div>}
464
465 {}
466 {target === 'terminal' && <div className="cc-ic-card">
467 <div className="cc-ic-subtabs" role="tablist" aria-label="Install method">
468 {Object.keys(TERM).map(k => <button key={k} type="button" role="tab" aria-selected={pkg === k} className={'cc-ic-subtab' + (pkg === k ? ' cc-ic-active' : '')} onClick={() => setPkg(k)}>
469 {TERM[k].label}
470 </button>)}
471 </div>
472 {isWinInstaller && <div className="cc-ic-shell-switch" role="tablist" aria-label="Shell">
473 {[{
474 k: 'ps',
475 label: 'PowerShell'
476 }, {
477 k: 'cmd',
478 label: 'CMD'
479 }].map(({k, label}) => {
480 const active = k === 'cmd' === winCmd;
481 return <button key={k} type="button" role="tab" aria-selected={active} className={'cc-ic-shell-option' + (active ? ' cc-ic-active' : '')} onClick={() => setWinCmd(k === 'cmd')}>
482 {label}
483 </button>;
484 })}
485 </div>}
486 {cardBodyCmd(terminalCmd, isWinPrompt ? '>' : '$')}
487 </div>}
488
489 {}
490 {target === 'terminal' && <div className="cc-ic-below">
491 {isWinInstaller && <span>
492 <a href="https://git-scm.com/downloads/win" target="_blank" rel="noopener">
493 Git for Windows
494 </a>{' '}
495 recommended. PowerShell is used if Git Bash is absent.
496 </span>}
497 {(pkg === 'brew' || pkg === 'winget') && <span>
498 Does not auto-update. Run{' '}
499 <code>{pkg === 'brew' ? 'brew upgrade claude-code' : 'winget upgrade Anthropic.ClaudeCode'}</code>{' '}
500 periodically.
501 </span>}
502 <a href="/en/troubleshoot-install">Installation troubleshooting</a>
503 </div>}
504
505 {alt && <div className="cc-ic-handoff">
506 <div className="cc-ic-handoff-title">Claude Code for {alt.name}</div>
507 <div className="cc-ic-handoff-sub">{alt.tagline}</div>
508 <div className="cc-ic-handoff-actions">
509 <a href={alt.installHref} className="cc-ic-btn-clay" {...alt.installHref.startsWith('http') ? {
510 target: '_blank',
511 rel: 'noopener'
512 } : {}}>
513 {alt.installLabel} {iconArrowUpRight(13)}
514 </a>
515 <a href={alt.guideHref} className="cc-ic-btn-ghost">
516 {alt.name} guide {iconArrowRight(12)}
517 </a>
518 </div>
519 {alt.altCmd && <div className="cc-ic-handoff-alt">
520 or run <code>{alt.altCmd}</code>
521 <button type="button" className={'cc-ic-copy-sm' + (copied === 'alt' ? ' cc-ic-copied' : '')} onClick={() => handleCopy(alt.altCmd, 'alt')} aria-label="Copy command">
522 {copied === 'alt' ? iconCheck(11) : iconCopy(11)}
523 </button>
524 </div>}
525 </div>}
526 </div>;
527};
528
529export const Experiment = ({flag, treatment, children}) => {
530 const VID_KEY = 'exp_vid';
531 const CONSENT_COUNTRIES = new Set(['AT', 'BE', 'BG', 'HR', 'CY', 'CZ', 'DK', 'EE', 'FI', 'FR', 'DE', 'GR', 'HU', 'IE', 'IT', 'LV', 'LT', 'LU', 'MT', 'NL', 'PL', 'PT', 'RO', 'SK', 'SI', 'ES', 'SE', 'RE', 'GP', 'MQ', 'GF', 'YT', 'BL', 'MF', 'PM', 'WF', 'PF', 'NC', 'AW', 'CW', 'SX', 'FO', 'GL', 'AX', 'GB', 'UK', 'AI', 'BM', 'IO', 'VG', 'KY', 'FK', 'GI', 'MS', 'PN', 'SH', 'TC', 'GG', 'JE', 'IM', 'CA', 'BR', 'IN']);
532 const fnv1a = s => {
533 let h = 0x811c9dc5;
534 for (let i = 0; i < s.length; i++) {
535 h ^= s.charCodeAt(i);
536 h += (h << 1) + (h << 4) + (h << 7) + (h << 8) + (h << 24);
537 }
538 return h >>> 0;
539 };
540 const bucket = (seed, vid) => fnv1a(fnv1a(seed + vid) + '') % 10000 < 5000 ? 'control' : 'treatment';
541 const [decision] = useState(() => {
542 const params = new URLSearchParams(location.search);
543 const preBucketed = document.documentElement.dataset['gb_' + flag.replace(/-/g, '_')];
544 const force = params.get('gb-force');
545 if (force) {
546 for (const p of force.split(',')) {
547 const [k, v] = p.split(':');
548 if (k === flag) return {
549 variant: v || 'treatment',
550 track: false
551 };
552 }
553 }
554 if (navigator.globalPrivacyControl) {
555 return {
556 variant: 'control',
557 track: false
558 };
559 }
560 const prefsMatch = document.cookie.match(/(?:^|; )anthropic-consent-preferences=([^;]+)/);
561 if (prefsMatch) {
562 try {
563 if (JSON.parse(decodeURIComponent(prefsMatch[1])).analytics !== true) {
564 return {
565 variant: 'control',
566 track: false
567 };
568 }
569 } catch {
570 return {
571 variant: 'control',
572 track: false
573 };
574 }
575 } else {
576 const country = params.get('country')?.toUpperCase() || (document.cookie.match(/(?:^|; )cf_geo=([A-Z]{2})/) || [])[1];
577 if (!country || CONSENT_COUNTRIES.has(country)) {
578 return {
579 variant: 'control',
580 track: false
581 };
582 }
583 }
584 let vid;
585 try {
586 const ajsMatch = document.cookie.match(/(?:^|; )ajs_anonymous_id=([^;]+)/);
587 if (ajsMatch) {
588 vid = decodeURIComponent(ajsMatch[1]).replace(/^"|"$/g, '');
589 } else {
590 vid = localStorage.getItem(VID_KEY);
591 if (!vid) {
592 vid = crypto.randomUUID();
593 }
594 document.cookie = `ajs_anonymous_id=${vid}; domain=.claude.com; path=/; Secure; SameSite=Lax; max-age=31536000`;
595 }
596 try {
597 localStorage.setItem(VID_KEY, vid);
598 } catch {}
599 } catch {
600 return {
601 variant: 'control',
602 track: false
603 };
604 }
605 const variant = preBucketed === '1' ? 'treatment' : preBucketed === '0' ? 'control' : bucket(flag, vid);
606 return {
607 variant,
608 track: true,
609 vid
610 };
611 });
612 useEffect(() => {
613 if (!decision.track) return;
614 fetch('https://api.anthropic.com/api/event_logging/v2/batch', {
615 method: 'POST',
616 headers: {
617 'Content-Type': 'application/json',
618 'x-service-name': 'claude_code_docs'
619 },
620 body: JSON.stringify({
621 events: [{
622 event_type: 'GrowthbookExperimentEvent',
623 event_data: {
624 device_id: decision.vid,
625 anonymous_id: decision.vid,
626 timestamp: new Date().toISOString(),
627 experiment_id: flag,
628 variation_id: decision.variant === 'treatment' ? 1 : 0,
629 environment: 'production'
630 }
631 }]
632 }),
633 keepalive: true
634 }).catch(() => {});
635 }, []);
636 return decision.variant === 'treatment' ? treatment : children;
637};
638
639Claude Code는 기능을 구축하고, 버그를 수정하고, 개발 작업을 자동화하는 데 도움이 되는 AI 기반 코딩 어시스턴트입니다. 전체 코드베이스를 이해하고 여러 파일과 도구에 걸쳐 작업할 수 있습니다.
640
641<div data-gb-slot="overview-install-configurator">
642 <Experiment flag="overview-install-configurator" treatment={<InstallConfigurator />} />
643</div>
644
645## 시작하기
646
647환경을 선택하여 시작하세요. 대부분의 환경에는 [Claude 구독](https://claude.com/pricing?utm_source=claude_code\&utm_medium=docs\&utm_content=overview_pricing) 또는 [Anthropic Console](https://console.anthropic.com/) 계정이 필요합니다. Terminal CLI 및 VS Code는 [타사 제공자](/ko/third-party-integrations)도 지원합니다.
648
649<Tabs>
650 <Tab title="Terminal">
651 터미널에서 Claude Code로 직접 작업하기 위한 모든 기능을 갖춘 CLI입니다. 파일을 편집하고, 명령을 실행하고, 명령줄에서 전체 프로젝트를 관리할 수 있습니다.
652
653 To install Claude Code, use one of the following methods:
654
655 <Tabs>
656 <Tab title="Native Install (Recommended)">
657 **macOS, Linux, WSL:**
658
659 ```bash theme={null}
660 curl -fsSL https://claude.ai/install.sh | bash
661 ```
662
663 **Windows PowerShell:**
664
665 ```powershell theme={null}
666 irm https://claude.ai/install.ps1 | iex
667 ```
668
669 **Windows CMD:**
670
671 ```batch theme={null}
672 curl -fsSL https://claude.ai/install.cmd -o install.cmd && install.cmd && del install.cmd
673 ```
674
675 If you see `The token '&&' is not a valid statement separator`, you're in PowerShell, not CMD. If you see `'irm' is not recognized as an internal or external command`, you're in CMD, not PowerShell. Your prompt shows `PS C:\` when you're in PowerShell and `C:\` without the `PS` when you're in CMD.
676
677 [Git for Windows](https://git-scm.com/downloads/win) is recommended on native Windows so Claude Code can use the Bash tool. If Git for Windows is not installed, Claude Code uses PowerShell as the shell tool instead. WSL setups do not need Git for Windows.
678
679 <Info>
680 Native installations automatically update in the background to keep you on the latest version.
681 </Info>
682 </Tab>
683
684 <Tab title="Homebrew">
685 ```bash theme={null}
686 brew install --cask claude-code
687 ```
688
689 Homebrew offers two casks. `claude-code` tracks the stable release channel, which is typically about a week behind and skips releases with major regressions. `claude-code@latest` tracks the latest channel and receives new versions as soon as they ship.
690
691 <Info>
692 Homebrew installations do not auto-update. Run `brew upgrade claude-code` or `brew upgrade claude-code@latest`, depending on which cask you installed, to get the latest features and security fixes.
693 </Info>
694 </Tab>
695
696 <Tab title="WinGet">
697 ```powershell theme={null}
698 winget install Anthropic.ClaudeCode
699 ```
700
701 <Info>
702 WinGet installations do not auto-update. Run `winget upgrade Anthropic.ClaudeCode` periodically to get the latest features and security fixes.
703 </Info>
704 </Tab>
705 </Tabs>
706
707 You can also install with [apt, dnf, or apk](/en/setup#install-with-linux-package-managers) on Debian, Fedora, RHEL, and Alpine.
708
709 그런 다음 모든 프로젝트에서 Claude Code를 시작합니다:
710
711 ```bash theme={null}
712 cd your-project
713 claude
714 ```
715
716 처음 사용할 때 로그인하라는 메시지가 표시됩니다. 이제 끝입니다! [빠른 시작으로 계속하기 →](/ko/quickstart)
717
718 <Tip>
719 [고급 설정](/ko/setup)에서 설치 옵션, 수동 업데이트 또는 제거 지침을 참조하세요. 문제가 발생하면 [설치 문제 해결](/ko/troubleshoot-install)을 방문하세요.
720 </Tip>
721 </Tab>
722
723 <Tab title="VS Code">
724 VS Code 확장 프로그램은 인라인 diff, @-mentions, 계획 검토 및 대화 기록을 편집기에서 직접 제공합니다.
725
726 * [VS Code용 설치](vscode:extension/anthropic.claude-code)
727 * [Cursor용 설치](cursor:extension/anthropic.claude-code)
728
729 또는 확장 프로그램 보기(`Mac에서 Cmd+Shift+X`, `Windows/Linux에서 Ctrl+Shift+X`)에서 "Claude Code"를 검색합니다. 설치 후 명령 팔레트(`Cmd+Shift+P` / `Ctrl+Shift+P`)를 열고 "Claude Code"를 입력한 다음 **새 탭에서 열기**를 선택합니다.
730
731 [VS Code 시작하기 →](/ko/vs-code#get-started)
732 </Tab>
733
734 <Tab title="Desktop app">
735 IDE 또는 터미널 외부에서 Claude Code를 실행하기 위한 독립 실행형 앱입니다. diff를 시각적으로 검토하고, 여러 세션을 나란히 실행하고, 반복되는 작업을 예약하고, 클라우드 세션을 시작할 수 있습니다.
736
737 다운로드 및 설치:
738
739 * [macOS](https://claude.ai/api/desktop/darwin/universal/dmg/latest/redirect?utm_source=claude_code\&utm_medium=docs) (Intel 및 Apple Silicon)
740 * [Windows](https://claude.ai/api/desktop/win32/x64/setup/latest/redirect?utm_source=claude_code\&utm_medium=docs) (x64)
741 * [Windows ARM64](https://claude.ai/api/desktop/win32/arm64/setup/latest/redirect?utm_source=claude_code\&utm_medium=docs)
742
743 설치 후 Claude를 실행하고, 로그인한 다음 **Code** 탭을 클릭하여 코딩을 시작합니다. [유료 구독](https://claude.com/pricing?utm_source=claude_code\&utm_medium=docs\&utm_content=overview_desktop_pricing)이 필요합니다.
744
745 [데스크톱 앱에 대해 자세히 알아보기 →](/ko/desktop-quickstart)
746 </Tab>
747
748 <Tab title="Web">
749 로컬 설정 없이 브라우저에서 Claude Code를 실행합니다. 오래 실행되는 작업을 시작하고 완료되면 다시 확인하거나, 로컬에 없는 리포지토리에서 작업하거나, 여러 작업을 병렬로 실행할 수 있습니다. 데스크톱 브라우저 및 Claude iOS 앱에서 사용할 수 있습니다.
750
751 [claude.ai/code](https://claude.ai/code)에서 코딩을 시작합니다.
752
753 [웹에서 시작하기 →](/ko/web-quickstart)
754 </Tab>
755
756 <Tab title="JetBrains">
757 IntelliJ IDEA, PyCharm, WebStorm 및 기타 JetBrains IDE용 플러그인으로 대화형 diff 보기 및 선택 컨텍스트 공유 기능이 있습니다.
758
759 JetBrains Marketplace에서 [Claude Code 플러그인](https://plugins.jetbrains.com/plugin/27310-claude-code-beta-)을 설치하고 IDE를 다시 시작합니다.
760
761 [JetBrains 시작하기 →](/ko/jetbrains)
762 </Tab>
763</Tabs>
764
765## 할 수 있는 것
766
767Claude Code를 사용할 수 있는 몇 가지 방법은 다음과 같습니다:
768
769<AccordionGroup>
770 <Accordion title="계속 미루고 있는 작업 자동화" icon="wand-magic-sparkles">
771 Claude Code는 하루를 낭비하는 지루한 작업을 처리합니다: 테스트되지 않은 코드에 대한 테스트 작성, 프로젝트 전체의 lint 오류 수정, 병합 충돌 해결, 종속성 업데이트 및 릴리스 노트 작성.
772
773 ```bash theme={null}
774 claude "write tests for the auth module, run them, and fix any failures"
775 ```
776 </Accordion>
777
778 <Accordion title="기능 구축 및 버그 수정" icon="hammer">
779 원하는 것을 일반 언어로 설명합니다. Claude Code는 접근 방식을 계획하고, 여러 파일에 걸쳐 코드를 작성하고, 작동하는지 확인합니다.
780
781 버그의 경우 오류 메시지를 붙여넣거나 증상을 설명합니다. Claude Code는 코드베이스를 통해 문제를 추적하고, 근본 원인을 파악하고, 수정을 구현합니다. 더 많은 예제는 [일반적인 워크플로우](/ko/common-workflows)를 참조하세요.
782 </Accordion>
783
784 <Accordion title="커밋 및 풀 요청 생성" icon="code-branch">
785 Claude Code는 git과 직접 작동합니다. 변경 사항을 스테이징하고, 커밋 메시지를 작성하고, 브랜치를 생성하고, 풀 요청을 엽니다.
786
787 ```bash theme={null}
788 claude "commit my changes with a descriptive message"
789 ```
790
791 CI에서 [GitHub Actions](/ko/github-actions) 또는 [GitLab CI/CD](/ko/gitlab-ci-cd)를 사용하여 코드 검토 및 이슈 분류를 자동화할 수 있습니다.
792 </Accordion>
793
794 <Accordion title="MCP로 도구 연결" icon="plug">
795 [Model Context Protocol (MCP)](/ko/mcp)는 AI 도구를 외부 데이터 소스에 연결하기 위한 개방형 표준입니다. MCP를 사용하면 Claude Code는 Google Drive에서 설계 문서를 읽고, Jira에서 티켓을 업데이트하고, Slack에서 데이터를 가져오거나, 자신의 커스텀 도구를 사용할 수 있습니다.
796 </Accordion>
797
798 <Accordion title="지침, skills 및 hooks로 사용자 정의" icon="sliders">
799 [`CLAUDE.md`](/ko/memory)는 프로젝트 루트에 추가하는 마크다운 파일로 Claude Code가 모든 세션의 시작 부분에서 읽습니다. 이를 사용하여 코딩 표준, 아키텍처 결정, 선호하는 라이브러리 및 검토 체크리스트를 설정합니다. Claude는 또한 작업할 때 [자동 메모리](/ko/memory#auto-memory)를 구축하여 빌드 명령 및 디버깅 인사이트와 같은 학습 내용을 저장하므로 아무것도 작성할 필요가 없습니다.
800
801 [커스텀 명령](/ko/skills)을 생성하여 팀이 공유할 수 있는 반복 가능한 워크플로우를 패키징합니다(예: `/review-pr` 또는 `/deploy-staging`).
802
803 [Hooks](/ko/hooks)를 사용하면 Claude Code 작업 전후에 셸 명령을 실행할 수 있습니다(예: 모든 파일 편집 후 자동 포맷팅 또는 커밋 전 lint 실행).
804 </Accordion>
805
806 <Accordion title="에이전트 팀 실행 및 커스텀 에이전트 구축" icon="users">
807 작업의 다른 부분에서 동시에 작동하는 [여러 Claude Code 에이전트](/ko/sub-agents)를 생성합니다. 리드 에이전트가 작업을 조정하고, 하위 작업을 할당하고, 결과를 병합합니다.
808
809 완전히 커스텀 워크플로우의 경우 [Agent SDK](/ko/agent-sdk/overview)를 사용하면 Claude Code의 도구 및 기능으로 구동되는 자신의 에이전트를 구축할 수 있으며, 오케스트레이션, 도구 액세스 및 권한에 대한 완전한 제어가 가능합니다.
810 </Accordion>
811
812 <Accordion title="CLI로 파이프, 스크립트 및 자동화" icon="terminal">
813 Claude Code는 구성 가능하며 Unix 철학을 따릅니다. 로그를 파이프하고, CI에서 실행하거나, 다른 도구와 연결합니다:
814
815 ```bash theme={null}
816 # 최근 로그 출력 분석
817 tail -200 app.log | claude -p "Slack me if you see any anomalies"
818
819 # CI에서 번역 자동화
820 claude -p "translate new strings into French and raise a PR for review"
821
822 # 파일 전체에 걸친 대량 작업
823 git diff main --name-only | claude -p "review these changed files for security issues"
824 ```
825
826 전체 명령 및 플래그 세트는 [CLI 참조](/ko/cli-reference)를 참조하세요.
827 </Accordion>
828
829 <Accordion title="반복되는 작업 예약" icon="clock">
830 Claude를 일정에 따라 실행하여 반복되는 작업을 자동화합니다: 아침 PR 검토, 야간 CI 실패 분석, 주간 종속성 감사 또는 PR 병합 후 문서 동기화.
831
832 * [Routines](/ko/routines)는 Anthropic 관리 인프라에서 실행되므로 컴퓨터가 꺼져 있어도 계속 실행됩니다. API 호출 또는 GitHub 이벤트에서도 트리거될 수 있습니다. 웹, 데스크톱 앱에서 생성하거나 CLI에서 `/schedule`을 실행하여 생성합니다.
833 * [데스크톱 예약된 작업](/ko/desktop-scheduled-tasks)은 머신에서 실행되며 로컬 파일 및 도구에 직접 액세스할 수 있습니다
834 * [`/loop`](/ko/scheduled-tasks)는 빠른 폴링을 위해 CLI 세션 내에서 프롬프트를 반복합니다
835 </Accordion>
836
837 <Accordion title="어디서나 작업" icon="globe">
838 세션은 단일 환경에 연결되지 않습니다. 컨텍스트가 변경되면 환경 간에 작업을 이동합니다:
839
840 * 책상에서 떠나 [원격 제어](/ko/remote-control)를 사용하여 휴대폰이나 모든 브라우저에서 계속 작업합니다
841 * [Dispatch](/ko/desktop#sessions-from-dispatch)에 휴대폰에서 작업을 메시지로 보내고 생성되는 데스크톱 세션을 엽니다
842 * [웹](/ko/claude-code-on-the-web) 또는 [iOS 앱](https://apps.apple.com/app/claude-by-anthropic/id6473753684)에서 오래 실행되는 작업을 시작한 다음 `claude --teleport`를 사용하여 터미널로 가져옵니다
843 * 터미널 세션을 [데스크톱 앱](/ko/desktop)으로 `/desktop`을 사용하여 시각적 diff 검토를 위해 전달합니다
844 * 팀 채팅에서 작업을 라우팅합니다: [Slack](/ko/slack)에서 `@Claude`를 언급하고 버그 보고서를 포함하면 풀 요청을 다시 받습니다
845 </Accordion>
846</AccordionGroup>
847
848## 모든 곳에서 Claude Code 사용
849
850각 환경은 동일한 기본 Claude Code 엔진에 연결되므로 CLAUDE.md 파일, 설정 및 MCP 서버가 모든 환경에서 작동합니다.
851
852위의 [Terminal](/ko/quickstart), [VS Code](/ko/vs-code), [JetBrains](/ko/jetbrains), [Desktop](/ko/desktop) 및 [Web](/ko/claude-code-on-the-web) 환경 외에도 Claude Code는 CI/CD, 채팅 및 브라우저 워크플로우와 통합됩니다:
853
854| 원하는 것 | 최적의 옵션 |
855| --------------------------------------------------- | -------------------------------------------------------------------------------------------------------------- |
856| 휴대폰이나 다른 기기에서 로컬 세션 계속하기 | [원격 제어](/ko/remote-control) |
857| Telegram, Discord, iMessage 또는 자신의 웹훅에서 세션으로 이벤트 푸시 | [Channels](/ko/channels) |
858| 로컬에서 작업 시작, 모바일에서 계속 | [웹](/ko/claude-code-on-the-web) 또는 [Claude iOS 앱](https://apps.apple.com/app/claude-by-anthropic/id6473753684) |
859| Claude를 반복 일정에 따라 실행 | [Routines](/ko/routines) 또는 [데스크톱 예약된 작업](/ko/desktop-scheduled-tasks) |
860| PR 검토 및 이슈 분류 자동화 | [GitHub Actions](/ko/github-actions) 또는 [GitLab CI/CD](/ko/gitlab-ci-cd) |
861| 모든 PR에서 자동 코드 검토 받기 | [GitHub Code Review](/ko/code-review) |
862| Slack의 버그 보고서를 풀 요청으로 라우팅 | [Slack](/ko/slack) |
863| 라이브 웹 애플리케이션 디버깅 | [Chrome](/ko/chrome) |
864| 자신의 워크플로우를 위한 커스텀 에이전트 구축 | [Agent SDK](/ko/agent-sdk/overview) |
865
866## 다음 단계
867
868Claude Code를 설치한 후 이 가이드를 통해 더 깊이 있게 알아볼 수 있습니다.
869
870* [빠른 시작](/ko/quickstart): 코드베이스 탐색에서 수정 커밋까지 첫 번째 실제 작업을 진행합니다
871* [지침 및 메모리 저장](/ko/memory): CLAUDE.md 파일 및 자동 메모리를 사용하여 Claude에 지속적인 지침을 제공합니다
872* [일반적인 워크플로우](/ko/common-workflows) 및 [모범 사례](/ko/best-practices): Claude Code에서 최대한 활용하기 위한 패턴
873* [설정](/ko/settings): Claude Code를 워크플로우에 맞게 사용자 정의합니다
874* [문제 해결](/ko/troubleshooting): 일반적인 문제에 대한 솔루션
875* [code.claude.com](https://code.claude.com/): 데모, 가격 책정 및 제품 세부 정보