⬇️
STEP 01
Claude Code 설치하기
AI와 함께 무엇이든 만드는 첫걸음. 5분이면 설치 끝.
Claude Code가 뭔가요
Claude Code는 터미널(또는 브라우저·앱)에서 자연어로 말하면, 코드를 쓰고 파일을 만들고 배포까지 해주는 AI 도구입니다. 이 사이트도 Claude Code로 만들었습니다.
1준비물
- 컴퓨터(맥/윈도우/리눅스)
- Node.js (자바스크립트 실행기) — 없으면 [nodejs.org](https://nodejs.org)에서 설치
- Claude 계정 (Pro 또는 Max 구독 권장)
Node.js 설치가 막히면? 그냥 Claude(claude.ai)에게 "내 컴퓨터는 맥인데 Node.js 어떻게 설치해?"라고 물어보세요. 그게 이 커뮤니티의 방식입니다.
2설치 한 줄
터미널을 열고:
npm install -g @anthropic-ai/claude-code3실행
프로젝트를 만들 폴더에서:
claude처음 실행하면 로그인 안내가 나옵니다. Claude 계정으로 로그인하면 끝.
4첫 마디
이제 그냥 말하면 됩니다.
"간단한 자기소개 웹페이지 만들어줘. 이름이랑 사진, 연락처가 들어가게."
코드를 한 줄도 모르셔도 됩니다. 무엇을 원하는지 사람의 말로 말하세요.
어디서든 쓸 수 있어요
Claude Code는 터미널뿐 아니라 브라우저(claude.ai/code), 데스크톱 앱, 모바일 앱, VS Code 같은 에디터에서도 쓸 수 있습니다. 다음 가이드에서 만든 걸 세상에 공개하는 법을 다룹니다.
📖 쉬운 용어 사전
어려운 말은 없습니다. 헷갈리면 여기를 보세요.
Claude Code — 자연어로 말하면 코드·파일·배포까지 해주는 AI 도구
호스팅 (Hosting) — 만든 사이트를 인터넷에 올려 주소를 주는 것 (예: Vercel)
데이터베이스 (Database) — 정보를 저장하고 기억하는 곳 (예: Supabase)
배포 (Deploy) — 만든 걸 실제 인터넷에 띄워 사람들이 쓰게 하는 것
API — 다른 서비스의 기능을 내 사이트에서 가져다 쓰는 연결 통로
API 키 (Key) — 그 API를 쓸 수 있게 해주는 비밀 열쇠
SaaS — 구독형 소프트웨어 — 설치 없이 인터넷으로 쓰는 서비스
크론 (Cron) — 정해진 시각마다 자동으로 작업을 실행하는 예약 기능
에이전트 (Agent) — 목표를 주면 스스로 판단·도구사용·반복해 끝내는 AI
환경변수 (Env) — API 키 같은 비밀값을 코드에 노출 않고 안전히 보관하는 곳
DNS — 도메인 주소를 실제 서버로 연결해주는 인터넷 전화번호부
프레임워크 (Framework) — 웹사이트를 빠르게 만들게 도와주는 기본 뼈대 (예: Next.js)