SpyBara
Go Premium

quickstart.md 2026-05-02 18:14 UTC to 2026-05-04 22:58 UTC

976 added, 0 removed.

2026
Sun 31 06:39 Sat 30 06:23 Fri 29 06:38 Thu 28 06:37 Wed 27 06:42 Tue 26 06:33 Sun 24 06:25 Sat 23 06:18 Fri 22 06:33 Thu 21 06:36 Wed 20 06:35 Tue 19 06:34 Mon 18 23:59 Sun 17 01:01 Fri 15 22:58 Thu 14 17:02 Wed 13 23:01 Tue 12 22:57 Mon 11 23:00 Sun 10 23:03 Sat 9 04:57 Fri 8 22:00 Thu 7 22:59 Tue 5 23:00 Mon 4 22:58 Sat 2 18:14 Fri 1 18:19

빠른 시작

Claude Code에 오신 것을 환영합니다!

export const InstallConfigurator = ({defaultSurface = 'terminal'}) => { const TERM = { mac: { label: 'macOS / Linux', cmd: 'curl -fsSL https://claude.ai/install.sh | bash' }, win: { label: 'Windows' }, brew: { label: 'Homebrew', cmd: 'brew install --cask claude-code' }, winget: { label: 'WinGet', cmd: 'winget install Anthropic.ClaudeCode' } }; const WIN_VARIANTS = { ps: 'irm https://claude.ai/install.ps1 | iex', cmd: 'curl -fsSL https://claude.ai/install.cmd -o install.cmd && install.cmd && del install.cmd' }; const TABS = [{ key: 'terminal', label: 'Terminal' }, { key: 'desktop', label: 'Desktop' }, { key: 'vscode', label: 'VS Code' }, { key: 'jetbrains', label: 'JetBrains' }]; const ALT_TARGETS = { desktop: { name: 'Desktop', tagline: 'The full agent in a native app for macOS and Windows.', installLabel: 'Download the app', installHref: 'https://claude.com/download?utm_source=claude_code&utm_medium=docs&utm_content=configurator_desktop_download', guideHref: '/en/desktop-quickstart' }, vscode: { name: 'VS Code', tagline: 'Review diffs, manage context, and chat without leaving your editor.', installLabel: 'Install from Marketplace', installHref: 'https://marketplace.visualstudio.com/items?itemName=anthropic.claude-code', altCmd: 'code --install-extension anthropic.claude-code', guideHref: '/en/vs-code' }, jetbrains: { name: 'JetBrains', tagline: 'Native plugin for IntelliJ, PyCharm, WebStorm, and other JetBrains IDEs.', installLabel: 'Install from Marketplace', installHref: 'https://plugins.jetbrains.com/plugin/27310-claude-code-beta-', guideHref: '/en/jetbrains' } }; const PROVIDERS = [{ key: 'anthropic', label: 'Anthropic' }, { key: 'bedrock', label: 'Amazon Bedrock' }, { key: 'foundry', label: 'Microsoft Foundry' }, { key: 'vertex', label: 'Google Vertex AI' }]; const PROVIDER_NOTICE = { bedrock: <> Configure your AWS account first. Running on Bedrock requires model access enabled in the AWS console and IAM credentials.{' '} Bedrock setup guide → </>, vertex: <> Configure your GCP project first. Running on Vertex AI requires the Vertex API enabled and a service account with the right permissions.{' '} Vertex setup guide → </>, foundry: <> Configure your Azure resources first. Running on Microsoft Foundry requires an Azure subscription with a Foundry resource and model deployments provisioned.{' '} Foundry setup guide → </> }; 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"> ; 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"> ; 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"> ; 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"> ; 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"> ; const [target, setTarget] = useState(defaultSurface); const [team, setTeam] = useState(false); const [provider, setProvider] = useState('anthropic'); const [pkg, setPkg] = useState(() => (/Win/).test(navigator.userAgent) ? 'win' : 'mac'); const [winCmd, setWinCmd] = useState(false); const [copied, setCopied] = useState(null); const copyTimer = useRef(null); const handleCopy = async (text, key) => { try { await navigator.clipboard.writeText(text); } catch { const ta = document.createElement('textarea'); ta.value = text; document.body.appendChild(ta); ta.select(); document.execCommand('copy'); document.body.removeChild(ta); } clearTimeout(copyTimer.current); setCopied(key); copyTimer.current = setTimeout(() => setCopied(null), 1800); }; const cardBodyCmd = (cmd, prompt) => { const on = copied === 'term'; return <div className="cc-ic-card-body"> <span className="cc-ic-prompt">{prompt || '$'} <div className="cc-ic-cmd">{cmd}

<button type="button" className={'cc-ic-copy' + (on ? ' cc-ic-copied' : '')} onClick={() => handleCopy(cmd, 'term')}> {on ? iconCheck(13) : iconCopy(13)} {on ? 'Copied' : 'Copy'}
; }; const isWinInstaller = pkg === 'win'; const isWinPrompt = pkg === 'win' || pkg === 'winget'; const terminalCmd = isWinInstaller ? WIN_VARIANTS[winCmd ? 'cmd' : 'ps'] : TERM[pkg].cmd; const alt = ALT_TARGETS[target]; const showNotice = team && provider !== 'anthropic'; const STYLES = ` .cc-ic { --ic-slate: #141413; --ic-clay: #d97757; --ic-clay-deep: #c6613f; --ic-gray-000: #ffffff; --ic-gray-150: #f0eee6; --ic-gray-550: #73726c; --ic-gray-700: #3d3d3a; --ic-border-subtle: rgba(31, 30, 29, 0.08); --ic-border-default: rgba(31, 30, 29, 0.15); --ic-border-strong: rgba(31, 30, 29, 0.3); --ic-font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, 'Courier New', monospace; font-family: 'Anthropic Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; font-size: 14px; line-height: 1.5; color: var(--ic-slate); margin: 8px 0 32px; } .dark .cc-ic { --ic-slate: #f0eee6; --ic-gray-000: #262624; --ic-gray-150: #1f1e1d; --ic-gray-550: #91908a; --ic-gray-700: #bfbdb4; --ic-border-subtle: rgba(240, 238, 230, 0.08); --ic-border-default: rgba(240, 238, 230, 0.14); --ic-border-strong: rgba(240, 238, 230, 0.28); } .dark .cc-ic-check { background: transparent; } .dark .cc-ic-card { border: 0.5px solid var(--ic-border-subtle); } .dark .cc-ic-p-pill.cc-ic-active { box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3); } .cc-ic *, .cc-ic *::before, .cc-ic *::after { box-sizing: border-box; } .cc-ic a { text-decoration: none; } .cc-ic a:not([class]) { color: inherit; } .cc-ic button { font-family: inherit; cursor: pointer; }

.cc-ic-tab-strip { display: inline-flex; gap: 2px; padding: 4px; background: var(--ic-gray-150); border-radius: 10px; overflow-x: auto; max-width: 100%; } .cc-ic-tab { appearance: none; background: none; border: none; padding: 10px 18px; font-size: 15px; font-weight: 430; color: var(--ic-gray-550); border-radius: 7px; white-space: nowrap; transition: color 0.12s, background-color 0.12s; } .cc-ic-tab:hover { color: var(--ic-gray-700); } .cc-ic-tab.cc-ic-active { color: var(--ic-slate); font-weight: 500; background: var(--ic-gray-000); box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08); } .dark .cc-ic-tab.cc-ic-active { box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4); }

.cc-ic-team-wrap { padding: 16px 0 20px; } .cc-ic-team-toggle { display: flex; align-items: center; gap: 12px; font-family: inherit; padding: 12px 16px; font-size: 14px; font-weight: 430; color: var(--ic-gray-700); cursor: pointer; user-select: none; width: fit-content; background: var(--ic-gray-150); border: 0.5px solid var(--ic-border-subtle); border-radius: 8px; transition: border-color 0.15s; } .cc-ic-team-toggle:hover { border-color: var(--ic-border-default); } .cc-ic-team-toggle.cc-ic-checked { background: rgba(217, 119, 87, 0.08); border-color: rgba(217, 119, 87, 0.25); } .cc-ic-check { width: 16px; height: 16px; border: 1px solid var(--ic-border-strong); border-radius: 4px; background: var(--ic-gray-000); display: flex; align-items: center; justify-content: center; flex-shrink: 0; } .cc-ic-check svg { color: #fff; display: none; } .cc-ic-team-toggle.cc-ic-checked .cc-ic-check { background: var(--ic-clay-deep); border-color: var(--ic-clay-deep); } .cc-ic-team-toggle.cc-ic-checked .cc-ic-check svg { display: block; }

.cc-ic-team-reveal { display: flex; flex-direction: column; gap: 12px; margin-bottom: 16px; } .cc-ic-sales { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 14px 16px; background: var(--ic-gray-000); border: 0.5px solid var(--ic-border-default); border-radius: 8px; flex-wrap: wrap; } .cc-ic-sales-text { font-size: 13px; color: var(--ic-gray-700); line-height: 1.5; flex: 1; min-width: 200px; } .cc-ic-sales-text strong { font-weight: 550; color: var(--ic-slate); } .cc-ic-sales-actions { display: flex; align-items: center; gap: 8px; flex-shrink: 0; } .cc-ic-btn-clay { display: inline-flex; align-items: center; gap: 8px; background: var(--ic-clay-deep); color: #fff; border: none; border-radius: 8px; padding: 8px 14px; font-size: 13px; font-weight: 500; transition: background-color 0.15s; white-space: nowrap; } .cc-ic-btn-clay:hover { background: var(--ic-clay); } .cc-ic-btn-ghost { display: inline-flex; align-items: center; gap: 8px; background: transparent; color: var(--ic-gray-700); border: 0.5px solid var(--ic-border-default); border-radius: 8px; padding: 8px 14px; font-size: 13px; font-weight: 500; } .cc-ic-btn-ghost:hover { background: rgba(0, 0, 0, 0.04); }

.cc-ic-provider-bar { display: flex; align-items: center; gap: 12px; padding: 14px 16px; background: var(--ic-gray-150); border-radius: 8px; font-size: 13px; flex-wrap: wrap; } .cc-ic-provider-bar .cc-ic-label { color: var(--ic-gray-550); flex-shrink: 0; } .cc-ic-provider-pills { display: flex; gap: 4px; flex-wrap: wrap; } .cc-ic-p-pill { appearance: none; border: none; background: transparent; padding: 6px 12px; border-radius: 6px; font-size: 13px; font-weight: 430; color: var(--ic-gray-700); white-space: nowrap; } .cc-ic-p-pill:hover { background: rgba(0, 0, 0, 0.04); } .cc-ic-p-pill.cc-ic-active { background: var(--ic-gray-000); color: var(--ic-slate); font-weight: 500; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05); } .cc-ic-provider-notice { display: flex; padding: 16px 18px; background: var(--ic-gray-000); border: 0.5px solid var(--ic-border-default); border-radius: 8px; gap: 14px; align-items: flex-start; } .cc-ic-provider-notice > svg { color: var(--ic-gray-550); margin-top: 2px; flex-shrink: 0; } .cc-ic-provider-notice-body { font-size: 14px; line-height: 1.55; color: var(--ic-gray-700); } .cc-ic-provider-notice-body strong { font-weight: 550; color: var(--ic-slate); } .cc-ic-provider-notice-body a { color: var(--ic-clay-deep); font-weight: 500; } .cc-ic-provider-notice-body a:hover { text-decoration: underline; }

.cc-ic-card { background: #141413; border-radius: 12px; overflow: hidden; } .cc-ic-subtabs { display: flex; align-items: center; background: #1a1918; border-bottom: 0.5px solid rgba(255, 255, 255, 0.08); padding: 0 8px; overflow-x: auto; } .cc-ic-subtab { appearance: none; background: none; border: none; padding: 12px 16px; font-size: 12px; color: rgba(255, 255, 255, 0.5); position: relative; white-space: nowrap; } .cc-ic-subtab:hover { color: rgba(255, 255, 255, 0.75); } .cc-ic-subtab.cc-ic-active { color: #fff; } .cc-ic-subtab.cc-ic-active::after { content: ''; position: absolute; left: 12px; right: 12px; bottom: -0.5px; height: 2px; background: var(--ic-clay); } .cc-ic-shell-switch { display: inline-flex; gap: 2px; margin: 14px 26px 0; padding: 3px; background: rgba(255, 255, 255, 0.06); border: 0.5px solid rgba(255, 255, 255, 0.08); border-radius: 8px; font-family: inherit; } .cc-ic-shell-option { font: inherit; font-size: 12px; font-weight: 500; padding: 5px 12px; border-radius: 6px; background: transparent; border: none; color: rgba(255, 255, 255, 0.55); cursor: pointer; user-select: none; white-space: nowrap; transition: color 120ms ease, background-color 120ms ease; } .cc-ic-shell-option:hover { color: rgba(255, 255, 255, 0.85); } .cc-ic-shell-option.cc-ic-active { background: rgba(255, 255, 255, 0.12); color: #fff; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.25); }

.cc-ic-card-body { padding: 24px 26px; display: flex; align-items: flex-start; gap: 14px; } .cc-ic-prompt { color: var(--ic-clay); font-family: var(--ic-font-mono); font-size: 17px; user-select: none; padding-top: 2px; } .cc-ic-cmd { flex: 1; font-family: var(--ic-font-mono); font-size: 17px; color: #f0eee6; line-height: 1.55; white-space: pre-wrap; word-break: break-word; } .cc-ic-copy { display: inline-flex; align-items: center; gap: 6px; background: rgba(255, 255, 255, 0.08); border: 0.5px solid rgba(255, 255, 255, 0.12); color: rgba(255, 255, 255, 0.85); padding: 7px 13px; border-radius: 8px; font-size: 13px; font-weight: 500; flex-shrink: 0; } .cc-ic-copy:hover { background: rgba(255, 255, 255, 0.14); } .cc-ic-copy.cc-ic-copied { background: var(--ic-clay-deep); border-color: var(--ic-clay-deep); color: #fff; }

.cc-ic-below { margin-top: 12px; font-size: 13px; color: var(--ic-gray-550); display: flex; gap: 16px; flex-wrap: wrap; align-items: baseline; } .cc-ic-below a { color: var(--ic-gray-700); border-bottom: 0.5px solid var(--ic-border-default); } .cc-ic-below a:hover { color: var(--ic-clay-deep); border-bottom-color: var(--ic-clay-deep); } .cc-ic-handoff { padding: 22px 24px; background: linear-gradient(180deg, #faf9f4 0%, #f3f1e9 100%); border: 0.5px solid var(--ic-border-default); border-radius: 12px; box-shadow: 0 1px 2px rgba(31, 30, 29, 0.04), 0 6px 16px -4px rgba(31, 30, 29, 0.06); } .dark .cc-ic-handoff { background: linear-gradient(180deg, #262624 0%, #1f1e1d 100%); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3), 0 6px 16px -4px rgba(0, 0, 0, 0.4); } .cc-ic-handoff-title { font-size: 16px; font-weight: 550; color: var(--ic-slate); letter-spacing: -0.01em; margin-bottom: 4px; } .cc-ic-handoff-sub { font-size: 14px; line-height: 1.5; color: var(--ic-gray-700); margin-bottom: 18px; } .cc-ic-handoff-actions { display: flex; gap: 10px; flex-wrap: wrap; } .cc-ic-handoff-alt { margin-top: 12px; font-size: 12px; color: var(--ic-gray-550); } .cc-ic-handoff-alt code { font-family: var(--ic-font-mono); font-size: 11px; background: var(--ic-gray-150); padding: 2px 6px; border-radius: 4px; color: var(--ic-gray-700); } .cc-ic-copy-sm { appearance: none; border: none; display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; margin-left: 4px; vertical-align: middle; background: var(--ic-gray-150); color: var(--ic-gray-550); border-radius: 4px; transition: color 0.1s, background-color 0.1s; } .cc-ic-copy-sm:hover { color: var(--ic-gray-700); background: var(--ic-border-default); } .cc-ic-copy-sm.cc-ic-copied { background: var(--ic-clay-deep); color: #fff; }

@media (max-width: 720px) { .cc-ic-tab { padding: 12px 14px; font-size: 14px; } .cc-ic-sales-actions { width: 100%; } .cc-ic-card-body { padding: 20px; } .cc-ic-cmd { font-size: 15px; } } `; return <div className="cc-ic not-prose">

  {}
  <div className="cc-ic-tab-strip" role="tablist">
    {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)}>
        {t.label}
      </button>)}
  </div>

  {}
  <div className="cc-ic-team-wrap">
    <button type="button" role="switch" aria-checked={team} className={'cc-ic-team-toggle' + (team ? ' cc-ic-checked' : '')} onClick={() => setTeam(!team)}>
      <span className="cc-ic-check">{iconCheck(11)}</span>
      <span>
        I’m buying for a team or company (SSO, AWS/Azure/GCP, central billing)
      </span>
    </button>
  </div>

  {}
  {team && <div className="cc-ic-team-reveal">
      <div className="cc-ic-sales">
        <div className="cc-ic-sales-text">
          <strong>Set up your team:</strong> self-serve or talk to sales.
        </div>
        <div className="cc-ic-sales-actions">
          <a href="https://claude.ai/upgrade?initialPlanType=team&amp;utm_source=claude_code&amp;utm_medium=docs&amp;utm_content=configurator_team_get_started" className="cc-ic-btn-ghost">
            Get started
          </a>
          <a href="https://www.anthropic.com/contact-sales?utm_source=claude_code&amp;utm_medium=docs&amp;utm_content=configurator_team_contact_sales" className="cc-ic-btn-clay">
            Contact sales {iconArrowRight()}
          </a>
        </div>
      </div>

      <div className="cc-ic-provider-bar">
        <span className="cc-ic-label">Run on</span>
        <div className="cc-ic-provider-pills" role="radiogroup" aria-label="Provider">
          {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)}>
              {p.label}
            </button>)}
        </div>
      </div>

      {showNotice && <div className="cc-ic-provider-notice">
          {iconInfo()}
          <div className="cc-ic-provider-notice-body">
            {PROVIDER_NOTICE[provider]}
          </div>
        </div>}
    </div>}

  {}
  {target === 'terminal' && <div className="cc-ic-card">
      <div className="cc-ic-subtabs" role="tablist" aria-label="Install method">
        {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)}>
            {TERM[k].label}
          </button>)}
      </div>
      {isWinInstaller && <div className="cc-ic-shell-switch" role="tablist" aria-label="Shell">
          {[{
k: 'ps',
label: 'PowerShell'

}, { k: 'cmd', label: 'CMD' }].map(({k, label}) => { const active = k === 'cmd' === winCmd; return <button key={k} type="button" role="tab" aria-selected={active} className={'cc-ic-shell-option' + (active ? ' cc-ic-active' : '')} onClick={() => setWinCmd(k === 'cmd')}> {label} ; })}

} {cardBodyCmd(terminalCmd, isWinPrompt ? '>' : '$')} }

  {}
  {target === 'terminal' && <div className="cc-ic-below">
      {isWinInstaller && <span>
          <a href="https://git-scm.com/downloads/win" target="_blank" rel="noopener">
            Git for Windows
          </a>{' '}
          recommended. PowerShell is used if Git Bash is absent.
        </span>}
      {(pkg === 'brew' || pkg === 'winget') && <span>
          Does not auto-update. Run{' '}
          <code>{pkg === 'brew' ? 'brew upgrade claude-code' : 'winget upgrade Anthropic.ClaudeCode'}</code>{' '}
          periodically.
        </span>}
      <a href="/anthropic/claude-code/history/docs/en/2026-05-02-1814..2026-05-04-2258/troubleshoot-install/">Installation troubleshooting</a>
    </div>}

  {alt && <div className="cc-ic-handoff">
      <div className="cc-ic-handoff-title">Claude Code for {alt.name}</div>
      <div className="cc-ic-handoff-sub">{alt.tagline}</div>
      <div className="cc-ic-handoff-actions">
        <a href={alt.installHref} className="cc-ic-btn-clay" {...alt.installHref.startsWith('http') ? {
target: '_blank',
rel: 'noopener'

} : {}}> {alt.installLabel} {iconArrowUpRight(13)} <a href={alt.guideHref} className="cc-ic-btn-ghost"> {alt.name} guide {iconArrowRight(12)} {alt.altCmd && <div className="cc-ic-handoff-alt"> or run {alt.altCmd} <button type="button" className={'cc-ic-copy-sm' + (copied === 'alt' ? ' cc-ic-copied' : '')} onClick={() => handleCopy(alt.altCmd, 'alt')} aria-label="Copy command"> {copied === 'alt' ? iconCheck(11) : iconCopy(11)} } } ; };

export const Experiment = ({flag, treatment, children}) => { const VID_KEY = 'exp_vid'; 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']); const fnv1a = s => { let h = 0x811c9dc5; for (let i = 0; i < s.length; i++) { h ^= s.charCodeAt(i); h += (h << 1) + (h << 4) + (h << 7) + (h << 8) + (h << 24); } return h >>> 0; }; const bucket = (seed, vid) => fnv1a(fnv1a(seed + vid) + '') % 10000 < 5000 ? 'control' : 'treatment'; const [decision] = useState(() => { const params = new URLSearchParams(location.search); const preBucketed = document.documentElement.dataset['gb_' + flag.replace(/-/g, '_')]; const force = params.get('gb-force'); if (force) { for (const p of force.split(',')) { const [k, v] = p.split(':'); if (k === flag) return { variant: v || 'treatment', track: false }; } } if (navigator.globalPrivacyControl) { return { variant: 'control', track: false }; } const prefsMatch = document.cookie.match(/(?:^|; )anthropic-consent-preferences=([^;]+)/); if (prefsMatch) { try { if (JSON.parse(decodeURIComponent(prefsMatch[1])).analytics !== true) { return { variant: 'control', track: false }; } } catch { return { variant: 'control', track: false }; } } else { const country = params.get('country')?.toUpperCase() || (document.cookie.match(/(?:^|; )cf_geo=([A-Z]{2})/) || [])[1]; if (!country || CONSENT_COUNTRIES.has(country)) { return { variant: 'control', track: false }; } } let vid; try { const ajsMatch = document.cookie.match(/(?:^|; )ajs_anonymous_id=([^;]+)/); if (ajsMatch) { vid = decodeURIComponent(ajsMatch[1]).replace(/^"|"$/g, ''); } else { vid = localStorage.getItem(VID_KEY); if (!vid) { vid = crypto.randomUUID(); } document.cookie = ajs_anonymous_id=${vid}; domain=.claude.com; path=/; Secure; SameSite=Lax; max-age=31536000; } try { localStorage.setItem(VID_KEY, vid); } catch {} } catch { return { variant: 'control', track: false }; } const variant = preBucketed === '1' ? 'treatment' : preBucketed === '0' ? 'control' : bucket(flag, vid); return { variant, track: true, vid }; }); useEffect(() => { if (!decision.track) return; fetch('https://api.anthropic.com/api/event_logging/v2/batch', { method: 'POST', headers: { 'Content-Type': 'application/json', 'x-service-name': 'claude_code_docs' }, body: JSON.stringify({ events: [{ event_type: 'GrowthbookExperimentEvent', event_data: { device_id: decision.vid, anonymous_id: decision.vid, timestamp: new Date().toISOString(), experiment_id: flag, variation_id: decision.variant === 'treatment' ? 1 : 0, environment: 'production' } }] }), keepalive: true }).catch(() => {}); }, []); return decision.variant === 'treatment' ? treatment : children; };

이 빠른 시작 가이드를 통해 몇 분 안에 AI 기반 코딩 지원을 사용할 수 있습니다. 이 가이드를 마치면 일반적인 개발 작업에 Claude Code를 사용하는 방법을 이해하게 됩니다.

<Experiment flag="quickstart-install-configurator" treatment={<InstallConfigurator />} />

시작하기 전에

다음을 확인하십시오:

단계 1: Claude Code 설치

To install Claude Code, use one of the following methods:

macOS, Linux, WSL:

curl -fsSL https://claude.ai/install.sh | bash

Windows PowerShell:

irm https://claude.ai/install.ps1 | iex

Windows CMD:

curl -fsSL https://claude.ai/install.cmd -o install.cmd && install.cmd && del install.cmd

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.

Git for Windows 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.

You can also install with apt, dnf, or apk on Debian, Fedora, RHEL, and Alpine.

단계 2: 계정에 로그인

Claude Code를 사용하려면 계정이 필요합니다. claude 명령으로 대화형 세션을 시작할 때 로그인해야 합니다:

claude
# 처음 사용할 때 로그인하라는 메시지가 표시됩니다
/login
# 프롬프트를 따라 계정으로 로그인하십시오

다음 계정 유형 중 하나를 사용하여 로그인할 수 있습니다:

로그인하면 자격 증명이 저장되고 다시 로그인할 필요가 없습니다. 나중에 계정을 전환하려면 /login 명령을 사용하십시오.

단계 3: 첫 번째 세션 시작

프로젝트 디렉토리에서 터미널을 열고 Claude Code를 시작하십시오:

cd /path/to/your/project
claude

세션 정보, 최근 대화 및 최신 업데이트가 포함된 Claude Code 환영 화면이 표시됩니다. 사용 가능한 명령을 보려면 /help를 입력하거나 이전 대화를 계속하려면 /resume을 입력하십시오.

단계 4: 첫 번째 질문 하기

코드베이스를 이해하는 것부터 시작하겠습니다. 다음 명령 중 하나를 시도하십시오:

이 프로젝트는 무엇을 하나요?

Claude가 파일을 분석하고 요약을 제공합니다. 더 구체적인 질문을 할 수도 있습니다:

이 프로젝트는 어떤 기술을 사용하나요?
주요 진입점은 어디인가요?
폴더 구조를 설명해주세요

Claude의 기능에 대해 물어볼 수도 있습니다:

Claude Code는 무엇을 할 수 있나요?
Claude Code에서 사용자 정의 skills를 만드는 방법은?
Claude Code는 Docker와 함께 작동할 수 있나요?

단계 5: 첫 번째 코드 변경 수행

이제 Claude Code가 실제 코딩을 하도록 해봅시다. 간단한 작업을 시도하십시오:

주 파일에 hello world 함수 추가

Claude Code는 다음을 수행합니다:

  1. 적절한 파일 찾기
  2. 제안된 변경 사항 표시
  3. 승인 요청
  4. 편집 수행

단계 6: Claude Code와 함께 Git 사용

Claude Code는 Git 작업을 대화형으로 만듭니다:

어떤 파일을 변경했나요?
설명적인 메시지로 변경 사항 커밋

더 복잡한 Git 작업을 요청할 수도 있습니다:

feature/quickstart라는 새 브랜치 생성
마지막 5개의 커밋 표시
병합 충돌을 해결하는 데 도움을 주세요

단계 7: 버그 수정 또는 기능 추가

Claude는 디버깅 및 기능 구현에 능숙합니다.

자연어로 원하는 것을 설명하십시오:

사용자 등록 양식에 입력 유효성 검사 추가

또는 기존 문제를 수정하십시오:

사용자가 빈 양식을 제출할 수 있는 버그가 있습니다 - 수정하세요

Claude Code는 다음을 수행합니다:

단계 8: 다른 일반적인 워크플로우 시도

Claude와 함께 작업하는 여러 가지 방법이 있습니다:

코드 리팩토링

인증 모듈을 콜백 대신 async/await를 사용하도록 리팩토링

테스트 작성

계산기 함수에 대한 단위 테스트 작성

문서 업데이트

설치 지침으로 README 업데이트

코드 검토

내 변경 사항을 검토하고 개선 사항을 제안해주세요

필수 명령

일상적인 사용을 위한 가장 중요한 명령은 다음과 같습니다:

명령 기능 예시
claude 대화형 모드 시작 claude
claude "task" 일회성 작업 실행 claude "fix the build error"
claude -p "query" 일회성 쿼리 실행 후 종료 claude -p "explain this function"
claude -c 현재 디렉토리에서 가장 최근 대화 계속 claude -c
claude -r 이전 대화 재개 claude -r
claude commit Git 커밋 생성 claude commit
/clear 대화 기록 지우기 /clear
/help 사용 가능한 명령 표시 /help
exit 또는 Ctrl+C Claude Code 종료 exit

전체 명령 목록은 CLI 참조를 참조하십시오.

초보자를 위한 팁

자세한 내용은 모범 사례일반적인 워크플로우를 참조하십시오.

대신: "버그 수정"
시도: "사용자가 잘못된 자격 증명을 입력한 후 빈 화면을 보는 로그인 버그 수정"
단계별 지침 사용

복잡한 작업을 단계로 나누기:

1. 사용자 프로필을 위한 새 데이터베이스 테이블 생성
2. 사용자 프로필을 가져오고 업데이트하는 API 엔드포인트 생성
3. 사용자가 자신의 정보를 보고 편집할 수 있는 웹페이지 구축
Claude가 먼저 탐색하도록 하기

변경하기 전에 Claude가 코드를 이해하도록 하기:

데이터베이스 스키마 분석
영국 고객이 가장 자주 반품하는 제품을 보여주는 대시보드 구축
바로가기로 시간 절약
  • ?를 눌러 사용 가능한 모든 키보드 바로가기 보기
  • Tab을 사용하여 명령 완성
  • ↑를 눌러 명령 기록 보기
  • /를 입력하여 모든 명령 및 skills 보기

다음 단계

기본 사항을 배웠으므로 더 고급 기능을 살펴보십시오:

microchip Claude Code 작동 방식

에이전트 루프, 기본 제공 도구 및 Claude Code가 프로젝트와 상호 작용하는 방식 이해

star 모범 사례

효과적인 프롬프팅 및 프로젝트 설정으로 더 나은 결과 얻기

graduation-cap 일반적인 워크플로우

일반적인 작업에 대한 단계별 가이드

puzzle-piece Claude Code 확장

CLAUDE.md, skills, hooks, MCP 등으로 사용자 정의

도움 받기