환경 준비

우리 작업은 내 노트북이 아니라 회사 작업 서버(팀이 함께 쓰는 원격 컴퓨터)에서 합니다. 아무나 들어오지 못하도록, 서버는 허가된 사람만 들여보냅니다. 그 허가 수단이 SSH 키입니다.

SSH 키는 한 쌍으로 만들어집니다.

• 개인키: 내 컴퓨터에만 두는 부분. 남에게 주지 않습니다.
• 공개키: 관리자에게 제출하는 부분. 관리자가 이걸 서버에 등록하면, 내 컴퓨터(개인키)만 그 서버에 들어갈 수 있습니다.

자물쇠와 열쇠로 비유하면, 공개키는 서버에 거는 자물쇠, 개인키는 그 자물쇠를 여는 열쇠입니다. 이번 강의는 이 한 쌍을 만들고, 자물쇠(공개키)를 관리자에게 넘기는 데까지 합니다.

키는 터미널에서 만듭니다. 터미널은 마우스 클릭 대신 명령을 글자로 입력하는 창입니다. 운영체제에 따라 여는 방법이 다릅니다.

Windows

• 시작 메뉴를 열고 PowerShell 을 입력해 실행합니다. (Windows 에서는 명령창이 여러 종류인데, 이 강의는 PowerShell 기준입니다.)

macOS

• Command(⌘) + 스페이스 로 검색창을 열고 터미널 을 입력해 실행합니다.

검은(또는 흰) 창이 뜨고 커서가 깜빡이면 준비된 것입니다. 이후 명령은 Windows·macOS 에서 동일하게 입력합니다.

터미널에 아래 한 줄을 입력합니다. -C 뒤에는 회사 이메일의 골뱅이(@) 앞부분(아이디)만 넣습니다. 예를 들어 이메일이 gildong@popupstudio.ai 면 gildong 을 넣습니다.

# 🖥️ 터미널 (Windows·macOS 공통)
ssh-keygen -t ed25519 -C "gildong"

입력하면 세 가지를 순서대로 물어봅니다. 모두 그냥 Enter 로 넘어가면 됩니다 (즉 Enter 를 세 번 누르는 셈입니다).

1. Enter file in which to save the key ... (키를 저장할 위치): Enter (기본 위치 ~/.ssh/id_ed25519 에 저장됩니다).
2. Enter passphrase (empty for no passphrase): (암호 입력): Enter (비워 둡니다).
3. Enter same passphrase again: (같은 암호 다시 입력, 확인용): Enter.

2번과 3번은 암호를 두 번 물어보는 것(입력 + 확인)입니다. 비워 둘 거면 둘 다 그냥 Enter 를 누르면 됩니다. 보안을 위해 2번에서 암호를 직접 입력했다면, 3번에서 같은 암호를 한 번 더 입력합니다(암호를 걸면 접속할 때마다 그 암호를 묻습니다).

Your identification has been saved ... 가 보이면 키 한 쌍이 만들어진 것입니다.

이제 공개키(관리자에게 줄 부분)를 화면에 띄웁니다.

# 🖥️ 터미널 (Windows·macOS 공통)
cat ~/.ssh/id_ed25519.pub

ssh-ed25519 AAAA... 로 시작하는 한 줄이 나옵니다. 이 한 줄 전체를 그대로 복사합니다.

ssh-ed25519 AAAAC3NzaC1lZDI1NTE5AAAA... gildong

복사한 공개키 한 줄을 관리자에게 전달합니다(메신저·메일 등 팀이 쓰는 방법으로). 관리자가 이 공개키를 서버에 등록하면, 다음 강의에서 서버에 접속할 수 있습니다.

• 보내는 것은 공개키(id_ed25519.pub, 끝이 .pub)입니다.
• 개인키(id_ed25519, .pub 없는 파일)는 절대 남에게 보내지 않습니다. 이건 내 컴퓨터에만 있어야 합니다.

• 핵심 정리: 내 컴퓨터에서 SSH 키 한 쌍을 생성(ssh-keygen -t ed25519)하고, 공개키(cat ~/.ssh/id_ed25519.pub 한 줄)를 관리자에게 제출했습니다.
• 주의 사항: 개인키(.pub 없는 파일)를 보내면 안 됩니다. 관리자에게 주는 것은 .pub 로 끝나는 공개키 한 줄뿐입니다.
• 다음 시간: 관리자가 공개키를 서버에 등록하면, VS Code Remote-SSH 로 그 서버에 접속합니다.

VS Code(Visual Studio Code)는 코드와 파일을 다루는 편집기입니다. Microsoft 가 무료로 배포합니다. 우리는 이 프로그램으로 회사 작업 서버에 접속해서 일합니다. 이번 강의는 이 프로그램을 내 컴퓨터에 설치하는 것까지 합니다.

브라우저에서 https://code.visualstudio.com 에 접속하면 큰 다운로드 버튼이 있습니다. 운영체제에 맞는 것을 내려받습니다.

Windows

• Windows 용 버튼을 눌러 설치 파일(.exe)을 내려받습니다.

macOS

• Mac 용 버튼을 눌러 설치 파일(.dmg)을 내려받습니다.

Windows

1. 내려받은 설치 파일(.exe)을 더블클릭해 실행합니다.
2. 사용권 동의에 체크하고 Next 를 눌러 진행합니다.
3. 중간 옵션은 기본값 그대로 두고 계속 Next, 마지막에 Install 을 누릅니다.
4. Finish 를 누르면 설치가 끝납니다.

macOS

1. 내려받은 .dmg 파일을 더블클릭해서 엽니다.
2. 창이 뜨면 Visual Studio Code 앱 아이콘을 응용 프로그램(Applications) 폴더로 드래그해서 옮깁니다.

VS Code 를 실행해 봅니다.

Windows

• 시작 메뉴를 열고 Visual Studio Code 를 입력해 실행합니다.

macOS

• Command(⌘) + 스페이스 로 검색창을 열고 Visual Studio Code 를 입력해 실행합니다.

처음 실행하면 환영(Welcome) 탭이 있는 창이 뜹니다. 여기까지 보이면 설치가 정상입니다.

• 핵심 정리: https://code.visualstudio.com 에서 내 운영체제용 VS Code 를 내려받아 설치하고, 실행까지 확인했습니다.
• 주의 사항: macOS 는 내려받은 앱을 응용 프로그램 폴더로 옮겨야 합니다(옮기지 않고 내려받기 폴더에서 바로 열면 나중에 헷갈립니다).
• 다음 시간: 설치한 VS Code 로 회사 작업 서버에 접속합니다.

• 앞 강의(SSH 키 생성)에서 낸 공개키를 관리자가 개발·운영 서버 모두에 등록 완료(관리자에게 확인).
• 내 컴퓨터에 VS Code 설치돼 있음.
• 관리자에게 받은 내 계정 이름. (아래 예시는 gildong. 본인 계정 이름으로 바꿔 넣으세요.)

1. VS Code 왼쪽 세로 막대에서 확장(Extensions) 아이콘(네모 조각 모양)을 클릭합니다. (단축키: Windows Ctrl+Shift+X / macOS ⌘+Shift+X)
2. 검색창에 Remote - SSH 를 입력합니다.
3. Microsoft 가 만든 Remote - SSH 항목을 봅니다. Install 버튼이 있으면 누르고, 이미 Installed 면 그냥 다음으로 넘어갑니다.

1. F1 키를 누릅니다. (F1 이 안 되면 Windows Ctrl+Shift+P / macOS ⌘+Shift+P)
2. Remote-SSH: Open SSH Configuration File 을 입력해 선택합니다.
3. 파일을 고르라고 하면 이걸 선택합니다. macOS 는 /Users/유저명/.ssh/config, Windows 는 C:\Users\내계정\.ssh\config.
4. 열린 파일에 아래를 그대로 붙여넣습니다. gildong 두 곳을 내 계정 이름으로 바꿉니다.

Host popupstudio-dev-server
  HostName 43.200.38.93
  User gildong

Host popupstudio-prod-server
  HostName 52.79.132.206
  User gildong

1. 저장합니다. (Windows Ctrl+S / macOS ⌘+S)

1. VS Code 왼쪽 아래 구석의 초록색 >< 버튼을 클릭합니다.
2. Connect to Host... → popupstudio-dev-server 를 선택합니다.
3. 새 창이 열립니다. 처음이면 서버 종류는 Linux, 확인창이 뜨면 Continue 를 고릅니다.
4. 왼쪽 아래에 SSH: popupstudio-dev-server 가 보이면 접속된 것입니다.

평소 작업은 popupstudio-dev-server, 배포는 나중에 popupstudio-prod-server 를 같은 방법으로 고릅니다.

1. 위쪽 메뉴 Terminal → New Terminal 로 터미널을 엽니다. (단축키로도 열립니다: Windows Ctrl+J / macOS ⌘+J)

2. 터미널 줄 맨 앞에 gildong@ip-172-31-39-132:~$ 같은 표시가 뜹니다. 각 부분의 뜻은:

   • gildong : 내 계정 이름 (사람마다 다름)
   • ip-172-31-39-132 : 서버 이름
   • ~ : 지금 있는 위치 (~ 는 내 홈 폴더)
   • $ 뒤 : 내가 입력할 명령

   앞으로 코드에서는 $ 뒤 부분만 칩니다. 3. whoami 를 입력해 내 계정 이름이 나오면 정상입니다.

# 🖥️ 서버 터미널
gildong@ip-172-31-39-132:~$ whoami

• 핵심 정리: 설정 파일에 서버를 등록하고 Connect to Host... 로 개발 서버에 접속했습니다.
• 주의 사항: 접속이 안 되면 (1) 관리자가 내 공개키를 등록했는지, (2) 계정 이름·별명 철자가 맞는지 확인합니다.
• 다음 시간: 서버 안에서 GitHub 로그인을 합니다.

앞 강의에서 접속한 VS Code 창(서버에 연결된 창)에서 터미널을 엽니다. 여기서 치는 명령은 모두 서버 안에서 실행됩니다.

• 위쪽 메뉴 Terminal → New Terminal. (단축키: Windows Ctrl+J / macOS ⌘+J)

우리 코드 저장소는 비공개라, 처음 한 번 GitHub 인증이 필요합니다.

# 🖥️ 서버 터미널
gildong@ip-172-31-39-132:~$ gh auth login

질문이 순서대로 나옵니다. 아래대로 고릅니다.

1. GitHub.com
2. HTTPS
3. Authenticate Git with your GitHub credentials? → Yes
4. Login with a web browser
5. 화면에 one-time code 가 나옵니다. 복사한 뒤 Enter 를 누르면 브라우저가 열립니다. https://github.com/login/device 에서 그 코드를 입력하고 승인합니다.

# 🖥️ 서버 터미널
gildong@ip-172-31-39-132:~$ gh auth status

Logged in to github.com as ... 가 보이면 성공입니다. (최초 1회만 하면 됩니다.)

• 핵심 정리: 서버 터미널에서 gh auth login 으로 GitHub 에 로그인하고 gh auth status 로 확인했습니다.
• 다음 시간: Claude Code 설치.

Claude Code 는 명령을 대신 수행해 주는 AI 도구입니다. 내 컴퓨터에 설치합니다. 아래 명령 한 줄이면 설치되고, 한 번 설치하면 이후에는 알아서 최신으로 유지됩니다(업데이트를 직접 할 필요가 없습니다).

내 컴퓨터의 운영체제에 맞는 것만 따라 합니다.

Windows

1. 작업 표시줄 검색창에 PowerShell 을 입력해 Windows PowerShell 을 엽니다.
2. 아래를 복사해 붙여 넣고 Enter 를 누릅니다.

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

1. 설치가 자동으로 진행됩니다(1~2분).

macOS

1. Command(⌘) + 스페이스 로 검색창을 열고 터미널 을 입력해 터미널(Terminal) 을 엽니다.
2. 아래를 복사해 붙여 넣고 Enter 를 누릅니다.

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

1. 설치가 자동으로 진행됩니다(1~2분).

설치가 끝나면 터미널/PowerShell 창을 완전히 닫고 새로 연 뒤 아래를 입력합니다.

claude --version

아래처럼 버전 번호가 나오면 정상입니다.

2.1.211 (Claude Code)

버전이 안 나오고 "명령을 찾을 수 없다"(command not found / not recognized)고 나오면, 창을 새로 열지 않아서입니다. 창을 닫고 다시 열어 한 번 더 실행합니다.

한 번 설치하면 업데이트는 알아서 됩니다. Claude Code 를 켤 때 새 버전이 있으면 내려받아 두고, 다음에 켤 때 최신으로 시작합니다. 따로 할 일은 없습니다.

• 핵심 정리: 내 컴퓨터에 Claude Code 를 설치했습니다. Windows 는 PowerShell, macOS 는 터미널에 명령 한 줄을 붙여 넣으면 끝이고, 이후 업데이트는 자동입니다.
• 주의 사항: 설치 직후 claude --version 이 안 되면 터미널/PowerShell 창을 닫고 새로 열어야 합니다.
• 다음 시간: 설치한 Claude Code 에 내 계정으로 로그인해 사용을 시작합니다.

Claude Code 는 명령을 대신 수행해 주는 AI 도구입니다. 서버에는 이미 설치돼 있고, 처음 한 번 내 계정으로 로그인만 하면 됩니다.

VS Code 서버 터미널에 아래를 입력합니다.

# 🖥️ 서버 터미널
gildong@ip-172-31-39-132:~$ claude auth login

그러면 터미널에 아래처럼 로그인 링크(URL) 가 나옵니다.

# 🖥️ 서버 터미널 (이런 안내가 나옵니다. 주소는 매번 다릅니다)
Sign in to Claude Code
아래 주소를 브라우저에서 여세요:
https://claude.ai/oauth/authorize?code=AbC123...&state=xyz789...

Paste code here if prompted >

1. 위 화면에서 https:// 로 시작하는 줄 전체를 마우스로 드래그해 복사합니다.
2. 웹 브라우저 주소창에 붙여 넣고 이동해 본인 Claude 계정으로 로그인한 뒤 승인(Authorize) 을 누릅니다(회사에서 안내한 계정. 모르면 관리자에게 확인).
3. 승인하면 브라우저에 인증 코드가 나옵니다. 그 코드를 복사해 터미널의 Paste code here 뒤에 붙여 넣고 Enter 를 누릅니다.

# 🖥️ 서버 터미널 (복사한 코드를 붙여 넣고 Enter)
Paste code here if prompted > AbC123XyZ...
Login successful. Welcome!

• 로그인은 최초 1회만 하면 됩니다.

Claude Code 를 어떤 폴더에서 처음 열면 "이 폴더의 파일을 신뢰하시겠습니까?"(Do you trust the files in this folder?) 라고 물어봅니다. Claude Code 가 그 폴더의 파일을 읽고 다뤄도 되는지 확인하는 보안 질문이라, 무작정 넘기면 안 됩니다. 경로를 먼저 보고 판단합니다.

1. 프롬프트 위에 표시된 폴더 경로를 확인합니다.
2. 그 경로가 내 홈 폴더(/home/내계정)이거나 내 프로젝트 폴더이면 내 것이니 신뢰합니다. 방향키로 Yes, proceed 를 골라 Enter.
3. 만약 내가 모르는 폴더나 시스템 폴더(예: /, /etc, /usr 로 시작하는 경로)라면 신뢰하지 말고 No 를 골라 빠져나온 뒤, 올바른 폴더에서 다시 엽니다.

지금은 홈 폴더에서 로그인했으니 신뢰해도 됩니다. 다만 매번 경로를 확인하는 습관을 들이세요. 아무 폴더에서나 무작정 신뢰하면 안 됩니다.

• 핵심 정리: 서버 터미널에서 claude auth login 으로 로그인하고, "이 폴더를 신뢰하겠냐"는 물음에 신뢰하고 진행을 선택했습니다.
• 다음 시간: 이제 계정·도구 준비가 끝났습니다. devtools 설치로 넘어갑니다.