통합 요약노트
Ch.3 컴퓨터가 코드를 실행하는 법
프로젝트 구조를 이해하고 Git으로 저장할 수 있게 됩니다.
이 챕터의 내용
하드웨어 기초 — CPU·RAM·SSD가 하는 일
컴퓨터를 '주방'에 비유하면 단번에 이해됩니다. 셰프, 조리대, 냉장고 — 각자의 역할이 있습니다.
컴퓨터 내부를 주방에 비유해봅시다 CPU는 셰프, RAM은 조리대, SSD는 냉장고
CPU = 계산, RAM = 임시 기억, SSD = 영구 저장
조리대(RAM)가 좁으면 어떻게 될까요? 재료를 냉장고(SSD)에서 꺼내고 넣고를 반복 → 요리가 느려집니다
- CPU = 셰프(계산), RAM = 조리대(임시 기억), SSD = 냉장고(영구 저장)
- 바이브코딩에는 RAM 16GB 권장
- 로컬 GPU는 필수가 아님 — 클라우드 GPU 활용
파일과 폴더 — 프로젝트 구조 읽는 법
프로젝트 폴더는 서류 캐비닛과 같습니다. 각 서랍(폴더)에 용도별 서류(파일)가 정리돼 있습니다.
프로젝트란 폴더 하나에 담긴 파일들의 모음입니다
비유: 프로젝트 폴더는 서류 캐비닛입니다. 각 서랍(폴더)에 용도별 서류(파일)가 정리돼 있어요. 서랍 이름만 보면 어떤 서류가 들어있는지 짐작할 수 있습니다.
파일 이름 뒤의 점(.) 뒤가 확장자입니다 확장자만 보면 파일의 용도를 알 수 있어요
- 프로젝트 = 폴더 하나에 담긴 파일 모음
- src/(코드), public/(정적), node_modules/(라이브러리, 수정 금지)
- 확장자로 파일 용도 구별: .ts, .json, .env 등
Git — 코드의 타임머신
Git은 코드의 타임머신입니다. 게임의 '세이브 포인트'처럼, 원하는 시점으로 돌아갈 수 있습니다.
Git은 코드의 타임머신입니다 게임의 '세이브 포인트'처럼, 원하는 시점으로 돌아갈 수 있어요
커밋(commit) = 세이브 포인트. "여기까지 잘 됐으니 저장하자"
Git은 저장까지 3단계를 거칩니다
- Git = 코드의 타임머신 (세이브 포인트로 되돌리기)
- 3단계: 작업 → add(스테이징) → commit(세이브)
- 커밋·브랜치·push·pull — 4가지 필수 용어
터미널 기초 — 명령어로 컴퓨터와 대화하기
터미널은 컴퓨터와 '문자 대화'하는 창입니다. Claude Code도 터미널에서 실행되니, 기초를 알면 더 잘 쓸 수 있습니다.
터미널 = 컴퓨터와 문자로 대화하는 창 GUI(그래픽)의 반대 개념입니다
비유: GUI가 '터치스크린 키오스크'라면, 터미널은 '문자 주문'입니다. 메뉴판을 보고 터치하는 대신, 원하는 걸 글자로 정확히 입력하죠. 더 빠르고 정확하지만, 명령어를 알아야 합니다.
Claude Code는 터미널에서 실행됨 — 터미널 기초를 알면 더 잘 쓸 수 있다
- 터미널 = 컴퓨터와 문자로 대화하는 창
- 필수 명령어: cd, ls, pwd, mkdir, cat, npm run dev
- Ctrl+C로 취소, ↑로 이전 명령어 — 두 가지만 기억
핵심 용어 모음
CPU = 셰프
요리(계산)를 담당. 빠를수록 요리가 빨리 완성됨
RAM = 조리대
지금 쓰는 재료를 올려두는 공간. 넓을수록 여러 요리 동시 가능
SSD = 냉장고
전체 재료를 보관하는 저장소. 전원을 꺼도 사라지지 않음
8GB
웹서핑, 문서 작업 수준
16GB
바이브코딩 권장 — Claude Code + 브라우저 + 에디터 동시 사용
32GB
대규모 프로젝트, 여러 개발 도구 동시 실행
src/
실제 코드가 사는 곳 — 여기가 핵심
public/
이미지·아이콘 등 정적 파일
node_modules/
남이 만든 라이브러리 (절대 직접 수정 금지!)
.git/
Git이 관리하는 히스토리 (보이지 않는 폴더)
.ts / .tsx
TypeScript — 이 코스의 주력 언어
.js
JavaScript — 웹의 기본 언어
퀴즈와 인터랙션으로 더 깊이 학습하세요
play_circle인터랙티브 코스 시작하기