설치부터 첫 화면까지

셋 중 하나를 고르세요

프롬프트는 특정 도구용이 아닙니다. 어디에 붙여넣어도 됩니다. 지금 상태에서 제일 부담 없는 걸 고르시면 되고, 나중에 갈아타도 됩니다.

• 

  5분 · 무료

  설치 없이 — 브라우저 챗봇

  쓰던 챗봇에 붙여넣고, 나온 코드를 파일 하나로 저장해 더블클릭합니다.

  일단 뭐라도 눈앞에서 돌아가는 걸 보고 싶은 분

• 

  30분 · 유료 또는 무료

  제대로 — 터미널에서 CLI

  파일을 여러 개 만들고 스스로 고쳐가며 돌려보는 건 이쪽만 됩니다.

  여기 있는 것들을 실제로 가져다 쓰고 싶은 분

• 

  5분 · 부분 무료

  남한테 맡기고 — 웹 빌더

  붙여넣으면 화면도 주소도 알아서 만들어줍니다. 대신 나중에 손대기 어렵습니다.

  내일까지 누군가에게 보여줘야 하는 분

1. 01챗봇을 엽니다

   claude.ai, chatgpt.com, gemini.google.com 아무거나 좋습니다. 무료 계정으로 됩니다.

2. 02프롬프트를 붙여넣습니다

   서비스 하나를 골라 그 페이지의 “이렇게 시켰습니다” 칸을 통째로 드래그해서 복사하세요. 붙여넣은 다음, 맨 아래에 한 줄만 덧붙입니다.

   하나의 HTML 파일로 만들어줘.

   이 한 줄이 중요합니다. 안 붙이면 파일을 여러 개로 쪼개서 주는데, 그건 이 갈래로는 열어볼 수가 없습니다.

3. 03나온 코드를 복사합니다

   코드 상자 오른쪽 위의 복사 버튼을 누르세요. 상자 안의 내용을 읽을 필요는 없습니다.

4. 04index.html 로 저장합니다 — 여기서 제일 많이 막힙니다

   맥 — 텍스트편집을 열고, 붙여넣기 전에 먼저 상단 메뉴에서 포맷 → 일반 텍스트로 만들기(⇧⌘T)를 누르세요. 이걸 안 하면 글씨 서식이 같이 저장돼서 브라우저가 못 읽습니다. 그다음 붙여넣고 ⌘S → 저장 위치는 바탕화면 → 이름은 index.html. 확장자를 바꾸겠냐고 물으면 .html 사용을 고릅니다.

   윈도우 — 메모장을 열고 붙여넣은 뒤 Ctrl+S → 저장 위치는 바탕화면 → 파일 형식을 “모든 파일”로 바꾸고 이름은 index.html. 이걸 안 바꾸면 index.html.txt 로 저장돼서 열리지 않습니다.

5. 05더블클릭합니다

   바탕화면의 그 파일을 더블클릭하면 브라우저가 뜨고, 그 자리에서 돌아갑니다. 여기까지가 5분입니다.

6. 06고칩니다

   다시 챗봇으로 돌아가서 “버튼이 너무 작아요”처럼 거슬리는 걸 한 번에 하나씩 말하세요. 새 코드가 나오면 3~5번을 반복하면 됩니다.

이 갈래의 한계 — 파일 하나에 들어가는 것까지만 됩니다. 로그인이나 데이터 저장이 필요한 건 여기서는 안 됩니다. 그게 필요해지면 아래 갈래로 넘어가시면 됩니다.

1. 00터미널을 엽니다

   맥 — ⌘ + Space 를 누르고 터미널이라고 친 뒤 Enter.

   윈도우 — 시작 버튼을 누르고 powershell 이라고 친 뒤, 뜨는 “Windows PowerShell” 을 엽니다.

   창이 하나 뜨고 글자 몇 개 뒤에 커서가 깜빡입니다. 거기가 명령어를 적는 자리입니다. 마우스는 거의 안 씁니다. 앞으로 할 일은 아래 줄들을 하나씩 붙여넣고 Enter 를 누르는 것뿐입니다.

2. 01Claude Code를 깝니다 — 한 줄입니다

   운영체제에 맞는 줄을 복사해서 터미널에 붙여넣고 Enter 를 누르세요.

   맥

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

   윈도우 (PowerShell)

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

   붙여넣기는 맥에서 ⌘V, 윈도우에서는 마우스 오른쪽 클릭(또는 Ctrl+V)입니다. 터미널에서는 붙여넣어도 아무 표시가 안 뜰 때가 있는데 정상입니다.

   Node.js 같은 걸 미리 깔 필요는 없습니다. 이 한 줄이 알아서 다 합니다. 설치가 끝나면 터미널 창을 완전히 닫았다가 다시 열고 아래를 쳐서 확인하세요.

   claude --version

   2.1.211 (Claude Code) 처럼 숫자가 나오면 된 겁니다. command not found 가 나오면 대부분 창을 안 닫아서 그렇습니다. 창을 완전히 닫고 새로 열어보세요.

3. 02작업할 폴더를 만듭니다

   두 줄을 차례로 붙여넣고 각각 Enter 를 누르세요.

   mkdir first-app
   cd first-app

   위는 폴더를 만들고, 아래는 그 안으로 들어가는 명령입니다. 폴더는 내 홈 폴더 안에 생깁니다 (맥은 /Users/내이름, 윈도우는 C:\Users\내이름).

   이게 불안하면 우회로가 있습니다. Finder나 탐색기에서 폴더를 직접 만든 다음, 터미널에 cd 를 치고 한 칸 띄운 뒤 그 폴더를 터미널 창으로 드래그하면 경로가 자동으로 채워집니다. 그리고 Enter.

4. 03실행하고 로그인합니다

   claude

   처음 실행하면 브라우저가 열리고 로그인 화면이 나옵니다. 계정을 고르면 끝입니다.

   여기가 돈이 드는 자리입니다. Claude Code는 Pro(월 20달러, 연간 결제 시 17달러) 이상 구독이 필요하고 무료 플랜에는 들어 있지 않습니다. 돈을 안 쓰고 하고 싶으면 아래 06번으로 가세요 — 같은 방식으로 무료로 할 수 있습니다.

5. 04프롬프트를 붙여넣습니다

   서비스 하나를 골라 그 페이지의 “이렇게 시켰습니다” 칸을 통째로 복사해서 그대로 붙여넣고 Enter. 여러 줄이 한 번에 안 들어가면 나눠서 붙여넣고 마지막에 Enter 를 누르면 됩니다.

   중간에 파일을 만들어도 되냐고 물어보면 y 를 누르시면 됩니다. 내 폴더 안에서만 일어나는 일이라 컴퓨터가 어떻게 되지 않습니다.

6. 05결과를 봅니다

   다 만들었다고 하면, 읽지 말고 이렇게 물어보세요.

   방금 만든 거 어떻게 실행해? 명령어 그대로 알려줘.

   알려주는 줄을 그대로 붙여넣으면 됩니다. 보통 브라우저 주소창에 localhost:3000 같은 걸 치면 화면이 뜹니다. 그다음부터는 그냥 대화입니다 — 거슬리는 걸 말하면 고쳐줍니다.

7. 06돈을 안 쓰고 하려면 — Gemini CLI

   구글 계정으로 로그인하면 하루 1,000번까지 무료입니다. 대신 이쪽은 Node.js를 먼저 깔아야 합니다.

   1. nodejs.org 에서 LTS 라고 적힌 버튼을 눌러 받은 뒤, 계속 다음을 누르면 설치됩니다.

   2. 터미널을 닫았다 다시 열고 아래를 붙여넣습니다.

   npm install -g @google/gemini-cli

   3. 그다음 실행합니다. 로그인 방법을 물으면 구글 로그인을 고르세요.

   gemini

   여기서부터는 위 02·04·05번과 똑같습니다.

8. 07터미널이 도저히 안 되면

   Claude Code는 데스크톱 앱도 있습니다. 터미널을 열지 않고 창에서 같은 일을 합니다. 명령어에서 계속 걸리면 이쪽으로 시작하셔도 됩니다.

1. 01아무거나 하나 엽니다

   v0, Bolt, Lovable. 셋 다 비슷합니다.

2. 02프롬프트를 붙여넣습니다

   그게 전부입니다. 화면이 옆에 바로 뜨고, 인터넷 주소도 같이 생겨서 남에게 링크로 보여줄 수 있습니다.

대가 — 만들어진 코드가 그 서비스 안에 있습니다. 나중에 마음대로 고치거나 내 서버로 옮기려고 하면 그때부터 답답해집니다. 내일까지 뭔가를 보여줘야 할 때 쓰고, 계속 만들 생각이면 위의 터미널 갈래가 낫습니다.