본인 서버 실행하기
서버를 살아 움직이게 하기
⏱ 예상 ~7분
01 · 읽기
서버 코드는 작성됐지만, 지금은 그냥 컴퓨터에 누워 있는 파일일 뿐이에요. 아직 아무것도 하지 않고 있어요.
node app.js 를 실행하면, 마법 같은 일이 일어나요. 본인 컴퓨터가 평범한 기계에서 web 서버로 변해요. 요청을 듣기 시작해요. 식당이 문을 열고 손님을 기다리는 것처럼요.
듣고 있는 주소는 localhost 예요. 글자 그대로 '이 컴퓨터' 라는 뜻이에요. 전체 인터넷에 서비스를 제공하는 게 아니라, 본인에게 제공해요. 바로 여기, 바로 지금이요.
💡 상상해 봐요서버를 시작하는 건 가게 입구의 '영업 중' 표지판을 뒤집는 것 같아요. 가게는 항상 거기 있지만, 이제 손님을 받을 준비가 됐어요. 본인 컴퓨터도 항상 거기 있지만, 이제 web 요청에 응답할 준비가 됐어요.
핵심 정리
- node app.js 는 본인 서버를 시작해서 계속 돌게 해요
- 터미널이 '멈춘' 것처럼 보일 거예요. 정상이에요. 서버가 듣고 있는 거예요
- localhost 는 본인 컴퓨터가 서버 역할을 한다는 뜻이에요
02 · 실기 실습
Node 로 app.js 를 실행해서 서버를 시작해요. 프로젝트 디렉토리 (app.js 와 package.json 이 있는 폴더) 에 있는지 확인해요.
node app.js
03 · 빈칸 채우기
서버가 돌아가고 터미널이 '멈춘' 것처럼 보일 때, 그건 서버가 요청을 ___ 있다는 뜻이에요.
04 · 실기 실습
서버가 돌아가고 있어요! 브라우저 (Chrome, Safari, Firefox — 뭐든 좋아요) 를 열고, 주소창에 이렇게 쳐요: http://localhost:3000 브라우저에 'Hello, World!' 메시지가 보일 거예요. 그 텍스트는 본인 서버에서 온 거예요. 본인 컴퓨터가 브라우저의 요청을 받고, 응답을 보낸 거죠.
http://localhost:3000
05 · 읽기
방금 web 서버를 만들었어요. 진짜 그것 말이에요.
브라우저에 localhost:3000 을 치면, 뒤에서 이런 일이 일어나요:
1. 본인 브라우저가 본인 컴퓨터의 port 3000 에 HTTP GET 요청을 보내요 2. 본인의 Express 서버가 요청을 받아요 3. app.get('/') 핸들러가 URL 과 매치돼요 4. 본인 서버가 'Hello, World!' 텍스트를 돌려보내요 5. 본인 브라우저가 그걸 표시해요
인터넷의 모든 웹사이트가 이렇게 동작해요. 유일한 차이? 그 서버들은 본인 노트북이 아니라 데이터 센터의 큰 컴퓨터에서 돌아가요. 하지만 메커니즘은 완전히 같아요.
핵심 정리
- 본인 브라우저는 클라이언트이고, 본인의 Node.js 앱은 서버예요
- 이게 모든 웹사이트를 떠받치는 요청-응답 사이클이에요
- 터미널로 돌아가요. 서버가 아직 돌아가고, 다음 요청을 기다려요
06 · 퀴즈
브라우저에서 http://localhost:3000 을 방문하면, 뒤에서 무슨 일이 일어나나요?
- 브라우저가 app.js 를 다운로드해서 로컬에서 실행해요
- 브라우저가 본인 컴퓨터에 HTTP 요청을 보내고, 본인 서버가 응답을 돌려보내요
- Express 가 인터넷에 연결해서 페이지를 가져와요
- Node.js 가 자동으로 새 브라우저 창을 열어요
⚠ 전체 인터랙티브 경험에는 JavaScript가 필요해요. JavaScript를 켜고 새로 고침해 주세요.
※ 이 사이트는 독립 운영되는 교육 프로젝트로, Anthropic의 공식 제품이 아니에요. Claude™ 는 Anthropic, PBC 의 상표예요.