CHANCE AI BUILD LAB · 0회차

개발환경 세팅

VSCode · Git · GitHub · Node.js · AI 코딩도구 — 순서대로만 하면 됩니다 🙌

첫 수업 전에 끝내두는 것이 목표입니다. 설치로 정규 시간을 쓰지 않기 위해서입니다.

📌 이 7개를 순서대로 합니다

  1. VSCode — 코드를 쓰는 프로그램
  2. Git — 코드의 변경 이력을 저장하는 도구
  3. Git 최초 설정 — 내가 누구인지 Git에 알려주기
  4. GitHub 계정 — 내 코드를 인터넷에 보관하는 곳
  5. Node.js — 만든 프로그램을 실행하는 엔진
  6. AI 코딩도구 — 이 과정에서 매 회차 쓰는 핵심 도구
  7. 첫 저장소 올리기 — 여기까지 되면 세팅 완료
막히면 그냥 연락 주세요. 혼자 30분 이상 붙잡지 마시고 010-5000-4950 으로 편하게 주세요. 화면 같이 보면 대부분 5분입니다.
시작 전에 확인: 저장공간이 30GB 이상 남아 있어야 합니다. 화면 왼쪽 위 사과 → 이 Mac에 관하여 → 저장 공간에서 확인하세요. 설치 중 Mac 로그인 비밀번호를 몇 번 물어봅니다. 미리 알아두세요.
1

VSCode 설치

코드를 작성하고 편집하는 메인 프로그램입니다. 한 달 내내 여기서 작업합니다.

  1. 아래 버튼으로 다운로드 페이지에 갑니다.
    VSCode 다운로드 →
  2. Mac 아이콘을 눌러 파일을 받습니다. 칩 종류를 모르면 Universal을 선택하세요.
  3. 받은 zip을 더블클릭하면 Visual Studio Code 앱이 생깁니다.
  4. 그 앱을 응용 프로그램(Applications) 폴더로 드래그해 옮깁니다. 이 단계를 빼먹는 분이 많습니다.
  5. 실행합니다. "인터넷에서 받은 앱" 경고가 뜨면 열기를 누르세요.
터미널에서 code 명령 쓰기: VSCode에서 ⌘⇧P → "shell command" 입력 → Install 'code' command in PATH 클릭.
한글 메뉴를 원하면: 왼쪽 Extensions(네모 4개 아이콘) → "Korean" 검색 → Korean Language Pack 설치 → 재시작.
2

Git 설치

코드의 변경 이력을 저장·관리하는 도구입니다. 맥은 명령 한 줄이면 됩니다.

  1. VSCode 상단 메뉴 Terminal → New Terminal을 엽니다. (화면 아래에 검은 칸이 생깁니다)
  2. 아래를 입력하고 Enter.
    git --version

    → git version 2.xx.x 처럼 나오면 이미 설치되어 있는 것입니다. 3번으로 넘어가세요.

  3. 없으면 "명령어 도구를 설치하시겠습니까?" 팝업이 뜹니다 → 설치 클릭 → 몇 분 기다립니다.
  4. 끝나면 다시 git --version을 입력해 버전이 나오는지 확인합니다.
팝업이 안 뜨면 아래를 직접 입력하세요.
xcode-select --install
3

Git 최초 설정

"이 코드를 누가 저장했는지" Git에 알려주는 단계입니다. 이걸 안 하면 첫 저장에서 바로 에러가 납니다.

  1. 터미널에 아래 두 줄을 본인 것으로 바꿔서 입력합니다.
    git config --global user.name "홍길동" git config --global user.email "본인이메일@example.com"
  2. 이메일은 4번에서 만들 GitHub 계정과 같은 이메일을 쓰세요.
  3. 제대로 들어갔는지 확인합니다.
    git config --global --list

    → user.name=... 과 user.email=... 두 줄이 보이면 성공.

이름은 한글도 되고 영문도 됩니다. 나중에 언제든 같은 명령으로 바꿀 수 있습니다.
4

GitHub 계정 만들기 + 2단계 인증

내 코드를 인터넷에 안전하게 보관하는 곳입니다. 수업 중 코드 공유와 배포가 전부 여기서 시작됩니다.

  1. 가입 페이지로 갑니다.
    GitHub 가입하기 →
  2. 이메일 → 비밀번호 → 사용자 이름(username) 순으로 입력합니다. 사용자 이름은 나중에 주소에 그대로 들어가니 영문 소문자로 간단하게 만드세요. (예: gildong-hong)
  3. 이메일로 온 인증 코드를 입력해 가입을 끝냅니다.
  4. 2단계 인증(2FA)을 반드시 켭니다. GitHub는 이걸 요구합니다. 오른쪽 위 프로필 → Settings → Password and authentication → Enable two-factor authentication.
  5. 휴대폰 인증 앱(예: Google Authenticator)을 쓰거나 SMS를 선택합니다.
  6. 복구 코드(recovery codes)가 나오면 반드시 저장하세요. 휴대폰을 잃어버리면 이것만이 계정을 되찾는 방법입니다.
복구 코드는 캡처해서 두지 말고 메모 앱이나 인쇄물로 따로 보관하세요. 이걸 잃어버려서 계정을 못 찾는 경우가 실제로 자주 생깁니다.
5

Node.js 설치

만든 프로그램을 실제로 실행시키는 엔진입니다.

  1. 아래 버튼으로 다운로드 페이지에 갑니다.
    Node.js 다운로드 →
  2. 반드시 LTS 버전, macOS Installer(.pkg)를 받습니다.
  3. 받은 .pkg 파일을 실행 → 계속 / 동의 / 설치 → Mac 비밀번호 입력.
  4. VSCode 터미널을 껐다 새로 연 뒤 아래 두 줄을 입력합니다.
    node -v npm -v

    → v22.x.x 와 10.x.x 처럼 숫자 두 줄이 나오면 성공입니다.

LTS = 안정 버전. Current(최신) 말고 LTS라고 적힌 쪽을 받으세요. 버전 숫자는 시기에 따라 다릅니다. 숫자가 나오기만 하면 정상이니 제 화면과 달라도 걱정하지 마세요.
터미널을 껐다 켜는 것이 중요합니다. 설치 직후 열려 있던 터미널은 Node를 못 찾습니다. "없다"고 나오면 대부분 이것 때문입니다.
6

AI 코딩도구 설치

이 과정에서 매 회차 쓰는 핵심 도구입니다. 여기까지 와야 실제 수업 준비가 끝납니다.

  1. 어떤 도구를 쓸지는 진단 때 안내드린 조합을 따릅니다. 보통 Claude Code를 씁니다.
  2. VSCode 왼쪽 Extensions(네모 4개 아이콘)을 누릅니다.
  3. 검색창에 Claude Code(또는 안내받은 도구 이름)를 입력합니다.
  4. 만든 곳이 Anthropic인 항목을 골라 Install을 누릅니다.
  5. 설치되면 로그인 화면이 나옵니다. 결제된 계정으로 로그인합니다.
유료 계정이 필요합니다. 무료 계정으로는 수업 분량을 감당하지 못합니다. 어떤 플랜을 결제해야 하는지는 진단 때 안내드린 대로 준비해 주세요. 결제 카드가 등록되어 있어야 합니다.
터미널로 설치하는 방법(선택): 5번에서 Node를 깔았다면 아래 한 줄로도 설치됩니다.
npm install -g @anthropic-ai/claude-code
설치 후 터미널에 claude 를 입력하면 실행되고, 처음 실행할 때 로그인 안내가 나옵니다.
로그인까지 반드시 끝내주세요. 설치만 하고 로그인을 안 한 상태로 오시면 첫 회차 시간을 여기에 씁니다.
7

첫 저장소 올려보기

여기까지 성공하면 세팅이 진짜로 끝난 것입니다. 5분이면 됩니다.

  1. 바탕화면에 test-project 라는 빈 폴더를 하나 만듭니다.
  2. VSCode에서 File → Open Folder → 방금 만든 폴더를 엽니다. "신뢰하십니까?" 물으면 Yes, I trust.
  3. 왼쪽 파일 목록 위 새 파일 아이콘으로 hello.txt 를 만들고 아무 글이나 씁니다. ⌘S로 저장.
  4. 왼쪽에서 Source Control(가지 갈라진 아이콘)을 누릅니다.
  5. Publish to GitHub 버튼을 누릅니다. 브라우저가 열리며 GitHub 로그인·권한 승인을 요청합니다 → 승인.
  6. private(비공개)를 선택합니다.
  7. 잠시 뒤 "성공적으로 게시되었습니다" 안내가 나옵니다. GitHub 사이트에 들어가 test-project 저장소가 보이면 완료입니다.
이 방법을 권하는 이유: VSCode가 GitHub 로그인을 알아서 처리해 줍니다. 터미널에서 직접 push하면 비밀번호 대신 토큰을 만들어야 해서 처음에는 훨씬 복잡합니다.

📌 이 7개를 순서대로 합니다

  1. VSCode — 코드를 쓰는 프로그램
  2. Git — 코드의 변경 이력을 저장하는 도구
  3. Git 최초 설정 — 내가 누구인지 Git에 알려주기
  4. GitHub 계정 — 내 코드를 인터넷에 보관하는 곳
  5. Node.js — 만든 프로그램을 실행하는 엔진
  6. AI 코딩도구 — 이 과정에서 매 회차 쓰는 핵심 도구
  7. 첫 저장소 올리기 — 여기까지 되면 세팅 완료
막히면 그냥 연락 주세요. 혼자 30분 이상 붙잡지 마시고 010-5000-4950 으로 편하게 주세요.
시작 전에 확인: 저장공간이 30GB 이상 남아 있어야 합니다. 설치 중 "이 앱이 장치를 변경하도록 허용하시겠습니까?" 창이 뜨면 모두 예를 누르세요.
1

VSCode 설치

코드를 작성하고 편집하는 메인 프로그램입니다.

  1. 아래 버튼으로 다운로드 페이지에 갑니다.
    VSCode 다운로드 →
  2. Windows 아이콘(파란 버튼)을 눌러 설치 파일을 받습니다.
  3. 받은 VSCodeUserSetup.exe 를 실행합니다.
  4. 동의 체크 후 계속 다음(Next).
  5. 꼭 체크: "PATH에 추가", "Code로 열기" 항목이 보이면 전부 체크하세요.
  6. 설치(Install) → 완료되면 VSCode를 실행합니다.
한글 메뉴를 원하면: 왼쪽 Extensions(네모 4개 아이콘) → "Korean" 검색 → Korean Language Pack 설치 → 재시작.
2

Git 설치

코드의 변경 이력을 저장·관리하는 도구입니다.

  1. 아래 버튼으로 다운로드합니다.
    Git 다운로드 →
  2. 64-bit Git for Windows Setup 을 눌러 파일을 받고 실행합니다.
  3. 설치 화면이 많이 나오지만 전부 기본값 그대로 두고 Next 만 눌러도 됩니다.
  4. 마지막 Install → 완료.
  5. VSCode를 완전히 껐다 켠 뒤 상단 Terminal → New Terminal 에서 아래를 입력합니다.
    git --version

    → git version 2.xx.x 처럼 나오면 성공.

VSCode를 껐다 켜는 것이 중요합니다. 안 그러면 방금 깐 Git을 못 찾습니다.
3

Git 최초 설정

"이 코드를 누가 저장했는지" Git에 알려주는 단계입니다. 이걸 안 하면 첫 저장에서 바로 에러가 납니다.

  1. 터미널에 아래 두 줄을 본인 것으로 바꿔서 입력합니다.
    git config --global user.name "홍길동" git config --global user.email "본인이메일@example.com"
  2. 이메일은 4번에서 만들 GitHub 계정과 같은 이메일을 쓰세요.
  3. 확인합니다.
    git config --global --list

    → user.name=... 과 user.email=... 두 줄이 보이면 성공.

4

GitHub 계정 만들기 + 2단계 인증

내 코드를 인터넷에 안전하게 보관하는 곳입니다.

  1. 가입 페이지로 갑니다.
    GitHub 가입하기 →
  2. 이메일 → 비밀번호 → 사용자 이름(username) 순으로 입력합니다. 사용자 이름은 주소에 그대로 들어가니 영문 소문자로 간단하게. (예: gildong-hong)
  3. 이메일로 온 인증 코드를 입력해 가입을 끝냅니다.
  4. 2단계 인증(2FA)을 반드시 켭니다. 오른쪽 위 프로필 → Settings → Password and authentication → Enable two-factor authentication.
  5. 복구 코드(recovery codes)가 나오면 반드시 저장하세요.
복구 코드는 따로 보관하세요. 휴대폰을 잃어버리면 이것만이 계정을 되찾는 방법입니다.
5

Node.js 설치

만든 프로그램을 실제로 실행시키는 엔진입니다.

  1. 아래 버튼으로 다운로드 페이지에 갑니다.
    Node.js 다운로드 →
  2. 반드시 LTS 버전, Windows Installer(.msi) 를 받습니다.
  3. 받은 .msi 를 실행 → 계속 Next → Install.
  4. "Tools for Native Modules" 체크 화면이 나오면 체크하지 않고 넘어가도 됩니다.
  5. VSCode를 껐다 켠 뒤 터미널에서 아래 두 줄을 입력합니다.
    node -v npm -v

    → v22.x.x 와 10.x.x 처럼 숫자 두 줄이 나오면 성공입니다.

LTS = 안정 버전. Current(최신) 말고 LTS 쪽을 받으세요. 버전 숫자는 시기에 따라 다릅니다. 숫자가 나오기만 하면 정상입니다.
6

AI 코딩도구 설치

이 과정에서 매 회차 쓰는 핵심 도구입니다.

  1. 어떤 도구를 쓸지는 진단 때 안내드린 조합을 따릅니다. 보통 Claude Code를 씁니다.
  2. VSCode 왼쪽 Extensions(네모 4개 아이콘)을 누릅니다.
  3. 검색창에 Claude Code(또는 안내받은 도구 이름)를 입력합니다.
  4. 만든 곳이 Anthropic인 항목을 골라 Install을 누릅니다.
  5. 설치되면 결제된 계정으로 로그인합니다.
유료 계정이 필요합니다. 무료 계정으로는 수업 분량을 감당하지 못합니다. 결제 카드가 등록되어 있어야 합니다.
로그인까지 반드시 끝내주세요. 설치만 하고 오시면 첫 회차 시간을 여기에 씁니다.
7

첫 저장소 올려보기

여기까지 성공하면 세팅이 진짜로 끝난 것입니다. 5분이면 됩니다.

  1. 바탕화면에 test-project 라는 빈 폴더를 하나 만듭니다.
  2. VSCode에서 File → Open Folder → 방금 만든 폴더를 엽니다. "신뢰하십니까?" 물으면 Yes, I trust.
  3. hello.txt 파일을 만들고 아무 글이나 쓴 뒤 Ctrl+S로 저장합니다.
  4. 왼쪽 Source Control(가지 갈라진 아이콘)을 누릅니다.
  5. Publish to GitHub 를 누릅니다. 브라우저에서 GitHub 로그인·승인 → 승인.
  6. private(비공개)를 선택합니다.
  7. GitHub 사이트에 test-project 저장소가 보이면 완료입니다.
이 방법을 권하는 이유: VSCode가 GitHub 로그인을 알아서 처리해 줍니다. 터미널에서 직접 push하면 토큰을 따로 만들어야 해서 처음에는 훨씬 복잡합니다.

FINAL CHECK

✅ 세팅 완료 체크리스트

첫 수업 전까지 아래 8개가 전부 체크되어야 합니다.

0 / 8 완료

자주 막히는 곳

명령을 입력했는데 "command not found" / "인식할 수 없습니다" 라고 나와요

열에 아홉은 터미널을 껐다 켜지 않아서입니다. 방금 설치한 프로그램은 새로 연 터미널에서만 잡힙니다. VSCode를 완전히 종료했다가 다시 켜고, Terminal → New Terminal 로 새 터미널을 연 뒤 다시 입력해 보세요.

터미널 창이 어디 있는지 모르겠어요

VSCode 상단 메뉴에서 Terminal → New Terminal 입니다. 화면 아래쪽에 검은 칸이 생기고 커서가 깜빡이면 그게 터미널입니다.

복사한 명령을 붙여넣기가 안 돼요

Mac은 ⌘V, Windows 터미널은 Ctrl+V 또는 마우스 오른쪽 클릭입니다. 붙여넣은 뒤 반드시 Enter를 눌러야 실행됩니다.

"Author identity unknown" 이라는 에러가 나요

3번(Git 최초 설정)을 안 하셨거나 오타가 있는 경우입니다. 아래 두 줄을 본인 것으로 다시 입력하세요.

git config --global user.name "홍길동" git config --global user.email "본인이메일@example.com"
Publish to GitHub 버튼이 안 보여요

폴더를 연 것이 맞는지 확인하세요. File → Open Folder 로 폴더 자체를 열어야 합니다(파일 하나만 열면 안 됩니다). 그리고 파일을 최소 하나는 만들어 저장해야 버튼이 나타납니다.

버전 숫자가 설명서와 달라요

정상입니다. 시간이 지나면 버전이 올라갑니다. 숫자가 나오기만 하면 성공이니 그대로 진행하세요.

AI 도구 로그인에서 결제하라고 나와요

맞습니다. 이 과정은 유료 계정을 전제로 합니다. 어떤 플랜이 필요한지는 진단 때 안내드린 대로 준비해 주세요. 확실하지 않으면 결제 전에 010-5000-4950 으로 먼저 물어보세요.

도저히 안 돼요

혼자 30분 이상 붙잡지 마세요. 010-5000-4950 으로 연락 주시면 화면을 같이 보고 잡아드립니다. 막힌 화면을 그대로 캡처해서 보내주시면 더 빠릅니다.