용어 사전

내 PC와 터미널

Claude가 내 PC에서 일을 시키려면 먼저 알아 두면 좋은 단어들입니다.

터미널

글자로 PC에 명령을 내리는 창입니다. 식당에서 메뉴판 대신 주방에 쪽지를 직접 건네는 것과 비슷합니다. 마우스로 누르는 대신 글자로 부탁합니다. 2장

PowerShell

Windows에 들어 있는 터미널 프로그램의 이름입니다. 이 교육에서 "터미널"이라고 하면 보통 PowerShell 창을 뜻합니다. 2장

명령어

터미널에 입력하는 한 줄짜리 지시문입니다. 예를 들어 git --version은 "Git 버전이 몇이야?"라는 질문입니다. 대부분은 Claude가 대신 입력해 주므로 외울 필요는 없습니다.

환경 변수와 PATH

환경 변수는 PC가 기억해 두는 설정값이고, 그중 PATH는 "프로그램을 찾아볼 폴더 목록"입니다. 회사 안내 데스크의 방문객 명단처럼, 목록에 없으면 프로그램이 설치되어 있어도 터미널이 "그런 건 모릅니다"라고 답합니다. 2장, 10장

설치 프로그램

새 프로그램을 PC에 깔아 주는 파일입니다. 내려받아 실행하면 안내에 따라 설치되고, 회사 PC에서는 관리자 권한이나 IT 담당자의 허락이 필요할 수 있습니다. 2장

폴더와 경로

폴더는 파일을 담는 서랍이고, 경로는 그 서랍의 위치를 적은 주소입니다. 예를 들어 C:\Users\[내 계정]\Desktop은 "C 드라이브의 사용자 폴더 안, 내 계정, 바탕화면"을 뜻합니다.

작업 폴더

Claude가 파일을 읽고 만들 수 있도록 내가 열어 준 폴더입니다. 사무실로 치면 Claude에게 "이 책상 위에서만 일하세요"라고 정해 준 자리입니다. 하나의 사이트는 하나의 작업 폴더에서 만듭니다. 2장

Node.js

JavaScript로 만든 프로그램을 브라우저 밖, 내 PC에서 실행해 주는 기반 프로그램입니다. 일부 도구(영상 제작 도구 등)가 돌아가려면 이것이 먼저 깔려 있어야 합니다. 영상 도구는 22 버전 이상을 요구합니다. 2장, 8장

npm과 npx

Node.js와 함께 오는 도구입니다. npm은 남이 만든 부품(패키지)을 내려받아 설치하는 도구이고, npx는 설치 과정 없이 도구를 한 번 바로 실행해 보는 방법입니다. 스킬 설치나 영상 렌더 때 npx ... 명령이 등장합니다. 5장, 8장

winget

Windows가 기본으로 제공하는 "앱 설치 도우미"입니다. 스마트폰의 앱스토어를 글자 명령으로 쓰는 셈이며, winget install 뒤에 프로그램 이름을 붙여 설치합니다. 2장, 3장

FFmpeg

영상과 소리를 자르고 붙이고 변환하는 무료 도구입니다. 눈에 띄지 않는 영상 편집 기계실에 해당하며, 영상 제작 도구가 뒤에서 이것을 사용합니다. 8장

코드와 파일

웹사이트를 이루는 재료와, 만드는 도중 자주 듣게 되는 말입니다.

HTML

웹페이지의 뼈대를 적는 언어입니다. 어떤 글과 그림과 버튼이 있는지를 정하며, 집으로 치면 방과 벽의 구조입니다. 7장

CSS

웹페이지의 겉모습을 정하는 언어입니다. 색, 글자 크기, 간격, 배치를 담당하며, 집으로 치면 벽지와 가구 배치입니다. 7장

JavaScript

웹페이지가 움직이고 반응하게 만드는 언어입니다. 버튼을 누르면 무언가 바뀌게 하는 것이 이 역할이며, 집으로 치면 전등 스위치와 문 자동 개폐 장치입니다. 7장

정적 사이트

미리 만들어 둔 파일을 그대로 보여 주는 사이트입니다. 서버에서 그때그때 계산하지 않기 때문에 만들기도 올리기도 쉽습니다. 이 교육에서 만드는 사이트가 모두 이 방식입니다. 1장, 7장

데이터베이스(DB)

회원 정보나 주문 내역처럼 쌓이고 바뀌는 데이터를 저장하는 창고입니다. 이 교육에서는 만들지 않습니다. 보고 만지는 사이트에는 창고가 없어도 충분하기 때문입니다. 1장, 6장

반응형

화면 크기에 맞춰 배치가 알아서 바뀌는 성질입니다. 같은 사이트가 PC에서는 가로로 넓게, 휴대폰에서는 세로로 길게 자연스럽게 보이게 만듭니다. 7장

모션/애니메이션

화면 속 요소가 움직이는 효과를 통틀어 부르는 말입니다. 글자가 서서히 나타나거나 배경이 천천히 흐르는 것이 예입니다. 7장

인터랙션

사용자의 행동에 사이트가 반응하는 것입니다. 누르면 펼쳐지고, 스크롤하면 장면이 바뀌고, 올려 두면 색이 변하는 것이 모두 인터랙션입니다. 6장, 7장

렌더링

설계도를 실제 결과물로 뽑아내는 작업입니다. 웹에서는 브라우저가 코드를 화면으로 그리는 일이고, 영상 제작에서는 HTML 설계도를 MP4 영상 파일로 뽑아내는 일입니다. 8장

로컬 미리보기와 localhost

로컬은 "내 PC 안"이라는 뜻입니다. 로컬 미리보기는 인터넷에 올리기 전에 내 PC에서 결과를 확인하는 것이고, localhost는 그때 브라우저 주소창에 보이는 "내 PC 자신"을 가리키는 주소입니다. 나만 볼 수 있습니다. 7장

캐시

브라우저가 속도를 위해 이전에 받은 파일을 저장해 둔 것입니다. 고쳤는데 화면이 그대로일 때는 캐시가 옛 모습을 보여 주는 경우가 많으며, 강력 새로고침(Ctrl+Shift+R)으로 해결되기도 합니다. 10장

에러 메시지

무언가 잘못되었을 때 나오는 안내 문구입니다. 겁먹을 필요 없이, 문구를 그대로 복사해서 Claude에게 보여 주면 원인과 해결법을 알려 줍니다. 10장

GitHub와 버전 기록

내 작업을 안전하게 기록하고 인터넷에 보관하는 흐름에서 쓰는 말입니다.

Git

내 PC에 설치되어 파일의 변경 이력을 기록해 주는 프로그램입니다. 문서의 "수정 기록 보기" 기능을 프로젝트 전체에 적용한 것과 비슷합니다. 3장

커밋(commit)

"지금 상태를 기록해 둔다"는 저장 지점입니다. 짧은 설명을 붙여 두므로 나중에 이전 모습으로 돌아가거나 무엇을 바꿨는지 볼 수 있습니다. 게임의 세이브 포인트와 같습니다. 커밋은 내 PC 안에서만 일어납니다. 3장, 7장

푸시(push)

내 PC에 쌓아 둔 커밋을 GitHub로 올려 보내는 일입니다. 커밋이 "내 PC에 저장"이라면 푸시는 "인터넷 보관함에 올리기"입니다. 3장, 7장

저장소(Repository)

프로젝트 파일과 그 변경 이력을 함께 담은 보관함입니다. 줄여서 "레포"라고도 부르며, 이 교육에서는 사이트 하나가 저장소 하나입니다. 3장

브랜치(branch)

같은 프로젝트에서 갈라져 나온 작업 줄기입니다. 원본은 그대로 두고 복사본에서 실험해 볼 수 있습니다. 기본 줄기의 이름은 보통 main입니다. 4장

GitHub

Git으로 기록한 저장소를 인터넷에 올려 두는 서비스입니다. 내 PC의 Git이 일기장이라면 GitHub는 그 일기장을 보관해 주는 클라우드 서랍입니다. 이름이 비슷하지만 서로 다른 것입니다. 3장

GitHub CLI(gh)

터미널에서 GitHub를 다룰 수 있게 해 주는 도구이고, 명령어는 gh입니다. 로그인과 저장소 만들기를 글자 한 줄로 할 수 있습니다. 3장

OAuth

비밀번호를 건네지 않고 "이 프로그램에게 내 계정 사용을 허락합니다"라고 브라우저에서 승인하는 방식입니다. 호텔 카드키처럼 열쇠 원본을 주지 않고 정해진 범위만 열어 줍니다. gh auth login이 이 방식을 씁니다. 3장

SSH 키

비공개 키와 공개 키 한 쌍으로 컴퓨터끼리 서로를 확인하는 방법입니다. 공개 키만 GitHub에 맡기고, 비공개 키는 내 PC에만 두며 절대 다른 곳에 보내지 않습니다. 이 교육에서는 선택 사항입니다. 3장

토큰

비밀번호 대신 쓰는, 길고 알아볼 수 없는 문자열 열쇠입니다. 가진 사람은 내 계정으로 행동할 수 있으므로, 대화창, 파일, 스크린샷 어디에도 붙여넣지 않습니다. 3장, 1장

2단계 인증(2FA)

비밀번호 외에 휴대폰 앱이나 문자로 받은 번호를 한 번 더 입력하는 보안 방법입니다. 비밀번호가 새어도 계정이 쉽게 뚫리지 않도록 해 줍니다. 3장

배포와 인터넷 주소

내 PC의 사이트를 다른 사람이 열어 볼 수 있게 만드는 단계의 말입니다.

Vercel

GitHub의 사이트 파일을 가져다 인터넷에 올려 주고 주소를 만들어 주는 서비스입니다. 정적 사이트는 무료 플랜으로 시작할 수 있습니다. 요금 정책은 바뀔 수 있으니 가입 화면에서 확인하세요. 4장

배포(deploy)

내 PC에 있는 사이트를 인터넷에 올려 누구나 주소로 열 수 있게 만드는 일입니다. 가게로 치면 준비를 마치고 간판을 내걸어 문을 여는 순간입니다. 4장

Production과 Preview

Production(프로덕션)은 진짜 사이트 주소에 보이는 공식 버전이고, Preview(프리뷰)는 공식 주소에 영향을 주지 않는 시험용 미리보기 버전입니다. 보통 main 브랜치에 올리면 Production, 다른 브랜치에 올리면 Preview가 됩니다. 4장

도메인

사이트의 인터넷 주소 이름입니다. 예를 들어 내이름.vercel.app처럼 사람이 읽을 수 있는 글자로 되어 있으며, 숫자로 된 진짜 주소를 대신 불러 주는 전화번호부의 이름과 같습니다. 4장

자동 재배포

GitHub에 새 내용을 푸시하면 Vercel이 알아채고 사이트를 자동으로 새로 고쳐 올려 주는 기능입니다. 파일을 고치고 푸시만 하면 몇 분 안에 인터넷의 사이트가 바뀝니다. 4장

Import(가져오기)

Vercel에서 GitHub 저장소를 골라 "이 저장소로 사이트를 만들어 주세요"라고 연결하는 단계입니다. 화면의 Import 버튼을 누르면 시작합니다. 4장

AI와 스킬

Claude, Codex 같은 AI 도구를 쓸 때 대화창에서 만나는 말입니다.

Claude Code

Claude가 대화만 하는 데서 나아가, 내 PC의 파일을 읽고 만들고 명령을 실행하는 도구입니다. 말로 일을 맡기면 직접 손을 움직이는 비서에 가깝습니다. 2장

프롬프트

AI에게 건네는 부탁의 글입니다. 질문이든 지시든 모두 프롬프트이며, 하고 싶은 일, 조건, 원하는 결과를 구체적으로 적을수록 결과가 좋아집니다. 7장, 부록 A

세션

AI와 이어서 나누는 하나의 대화 묶음입니다. 새 세션을 시작하면 이전 대화는 이어지지 않습니다. 스킬이나 플러그인을 새로 설치한 뒤에는 새 세션에서 목록에 반영됩니다. 5장

컨텍스트

AI가 지금 대화에서 기억하며 참고하는 내용의 범위입니다. 한 세션이 너무 길어지면 앞의 내용이 흐려질 수 있어, 새로운 일은 새 세션에서 시작하는 편이 좋습니다.

스킬(Skill)

AI에게 특정 일을 잘하는 방법을 가르쳐 주는 설명서 묶음입니다. 신입 직원에게 건네는 업무 매뉴얼과 같으며, /스킬이름으로 불러 씁니다. 5장

플러그인과 마켓플레이스

플러그인은 스킬 등 기능을 한 묶음으로 담은 확장 패키지이고, 마켓플레이스는 그런 패키지를 모아 둔 카탈로그입니다. 먼저 카탈로그를 등록한 뒤 그 안에서 골라 설치하며, 부를 때는 /플러그인명:스킬명 형식을 씁니다. 5장, 8장

권한(허용) 질문

Claude가 파일을 만들거나 명령을 실행하기 전에 "이 작업을 해도 될까요?"라고 묻는 창입니다. 내용을 읽고 이해될 때만 허용합니다. 2장

hyperframes

HTML로 설계도를 쓰면 MP4 영상으로 만들어 주는 영상 제작 도구입니다. 이 교육의 모션 영상 실습에 사용합니다. 8장

Codex

Claude와 다른 회사가 만든 코딩용 AI 도구입니다. 이 교육의 스킬과 도구는 Claude와 Codex 모두에서 쓸 수 있도록 설치 방법을 따로 안내합니다. 5장, 8장