17. 코드 정리하고 나누기 (모듈 시스템)/17.4 Node.js의 구조 맛보기

17.4.3 터미널에서 자바스크립트 실행하기 - 컴퓨터와 직접 대화해보기

thejavascript4kids 2025. 7. 26. 20:11

📘 17.4.3 터미널에서 자바스크립트 실행하기 - 컴퓨터와 직접 대화해보기

이제까지 우리는 Node.js가 무엇인지, 프로젝트는 어떻게 구성하는지 배웠습니다. 이번 시간에는 정말 신나는 일을 해볼 거예요. 바로 터미널이라는 특별한 창을 통해 컴퓨터와 직접 대화하며 자바스크립트 코드를 실행해보는 것입니다.

마치 컴퓨터의 마음속으로 들어가서 직접 명령을 내리는 것 같은 새로운 경험을 해보게 될 거예요.

🧠 먼저 용어를 알아볼까요?

컴퓨터와의 대화를 시작하기 전에, 알아야 할 특별한 용어들을 만나보겠습니다.

용어 의미
터미널 컴퓨터와 글자로 대화할 수 있는 특별한 창을 말합니다.
node 명령어 터미널에서 자바스크립트를 실행하기 위해 사용하는 특별한 명령입니다.
대화형 환경 코드를 입력하면 바로 결과를 보여주는 대화형 환경입니다.
코드 파일 파일에 저장된 자바스크립트 코드 모음을 의미합니다.

✨ 터미널에서 자바스크립트 실행하기의 핵심 개념

터미널은 마치 컴퓨터의 귀와 입과 같아요. 우리가 글자로 명령을 입력하면 컴퓨터가 들어주고, 컴퓨터도 글자로 대답해 줍니다. 웹 브라우저처럼 예쁜 그림은 없지만, 대신 더 빠르고 직접적으로 컴퓨터와 소통할 수 있어요.

Node.js가 설치되어 있으면, 터미널에서 node라는 특별한 명령어를 사용할 수 있어요. 이 명령어에는 두 가지 사용법이 있답니다.

첫 번째는 대화형 모드라고 해서, node만 입력하면 컴퓨터와 실시간으로 대화할 수 있어요. 마치 친구와 카카오톡으로 대화하는 것처럼, 코드를 입력하면 바로바로 결과를 볼 수 있어요.

두 번째는 파일 실행 모드인데, node 파일이름.js라고 입력하면 파일에 저장된 모든 코드를 한 번에 실행할 수 있어요. 마치 긴 편지를 한 번에 읽어주는 것과 같아요.

비유로 이해하기: 컴퓨터 선생님과의 대화

터미널에서 자바스크립트를 실행하는 것을 '매우 똑똑한 수학 선생님과의 대화'로 생각해보겠습니다.

대화형 모드는 선생님과 일대일 과외 수업을 받는 것과 같아요. "7 곱하기 8은 얼마예요?"라고 물으면 바로 "56이에요!"라고 대답해주시죠. 궁금한 것이 있을 때마다 바로바로 질문하고 답을 들을 수 있어요.

파일 실행 모드숙제를 제출하고 검토받는 것과 같아요. 여러 문제를 종이에 써서 한 번에 제출하면, 선생님이 차례차례 검토하시고 모든 답을 한 번에 알려주세요.

두 방법 모두 장점이 있어요. 간단한 질문은 바로바로 물어보고(대화형), 복잡한 문제는 차근차근 정리해서 제출하는(파일) 것이 좋답니다.

🎯 터미널에서 코딩하는 이유

그렇다면 우리는 왜 터미널에서 코딩을 배워야 할까요? 정말 중요한 이유들이 있어요.

첫째로 빠른 실험과 테스트가 가능해요. 브라우저를 열고 HTML 파일을 만들 필요 없이, 터미널에서 바로 코드를 시험해볼 수 있어요. 마치 계산기를 사용하는 것처럼 간단하고 빨라요.

둘째로 진짜 프로그래머가 되는 연습이에요. 실제 회사에서 일하는 프로그래머들은 터미널을 매일 사용해요. 미리 익혀두면 나중에 큰 도움이 될 거예요.

셋째로 서버 프로그래밍의 시작이에요. 웹사이트의 뒷부분(백엔드)을 만들 때는 터미널을 반드시 사용해야 해요. 지금 배우는 것이 미래의 큰 프로젝트를 위한 준비가 되는 거죠.

마지막으로 문제 해결 능력을 기를 수 있어요. 터미널에서는 모든 것을 정확히 입력해야 하고, 오류 메시지를 읽고 이해해야 해요. 이런 경험이 논리적 사고력을 키워줍니다.

⚙️ 터미널 사용법 배우기

이제 실제로 터미널을 사용하는 방법을 배워보겠습니다.

기본 명령어들:

# 자바스크립트 파일 실행하기
node 파일이름.js

# 대화형 모드 시작하기 (대화 모드)
node

# 대화형 모드에서 나가기
.exit

파일 실행할 때 주의사항:

  • 파일 이름을 정확히 입력해야 해요
  • .js 확장자를 꼭 붙여야 해요
  • 파일이 현재 폴더에 있어야 해요

🧪 첫 번째 터미널 코딩 경험하기

이제 실제로 터미널에서 자바스크립트를 실행해보는 시간을 가져보겠습니다.

🔹 예제 1: 첫 번째 자바스크립트 파일 만들고 실행하기

먼저 간단한 인사 프로그램을 만들어보겠습니다.

// hello.js 파일을 만들어주세요
// 우리의 첫 번째 터미널 프로그램입니다!

// 터미널에 인사말을 출력해요
console.log("🌟 안녕하세요! 터미널에서 만나뵙니다!");

// 현재 날짜와 시간을 보여줘요
const now = new Date();                                    // 현재 시간을 가져와요
console.log("📅 오늘 날짜:", now.toLocaleDateString());    // 오늘 날짜를 예쁘게 출력
console.log("⏰ 현재 시간:", now.toLocaleTimeString());    // 현재 시간을 예쁘게 출력

// 간단한 계산을 해보겠습니다
const myAge = 11;                          // 내 나이를 변수에 저장
const friendAge = 10;                      // 친구 나이를 변수에 저장
const totalAge = myAge + friendAge;        // 두 나이를 더해서 총 나이 계산

console.log("👫 우리 나이를 합치면:", totalAge, "살이에요!");

// 프로그램이 끝났다고 알려줘요
console.log("✅ 프로그램이 완료되었습니다!");

이 파일을 저장한 후, 터미널에서 다음과 같이 실행해보세요:

node hello.js

실행하면 이런 결과를 볼 수 있을 거예요:

🌟 안녕하세요! 터미널에서 만나뵙니다!
📅 오늘 날짜: 2025. 6. 15.
⏰ 현재 시간: 오후 2:30:00
👫 우리 나이를 합치면: 21 살이에요!
✅ 프로그램이 완료되었습니다!

🔹 예제 2: 대화형 모드에서 즉석 실험하기

이번에는 터미널에서 node만 입력해서 대화형 모드로 들어가보겠습니다.

// 터미널에서 node를 입력하고 Enter를 누르세요
// 그러면 > 표시가 나타날 거예요

// 간단한 계산해보기
> 5 + 7
12

// 변수 만들어보기
> let myName = "지수"
undefined

// 변수 사용해보기  
> console.log("안녕하세요, " + myName + "님!")
안녕하세요, 지수님!
undefined

// 함수 만들어보기
> function multiply(a, b) { return a * b; }
undefined

// 함수 사용해보기
> multiply(6, 7)
42

// 배열 만들어보기
> let fruits = ["사과", "바나나", "딸기"]
undefined

// 배열 내용 보기
> fruits
[ '사과', '바나나', '딸기' ]

// 대화형 모드 나가기
> .exit

🔹 예제 3: 간단한 게임 만들어보기

이번에는 조금 더 재미있는 숫자 맞추기 게임을 만들어보겠습니다.

// game.js 파일을 만들어주세요
// 간단한 숫자 맞추기 게임입니다!

// 게임 시작 인사
console.log("🎮 숫자 맞추기 게임에 오신 것을 환영합니다!");
console.log("1부터 10 사이의 숫자를 컴퓨터가 선택했어요.");

// 컴퓨터가 1부터 10 사이의 랜덤 숫자를 선택해요
const computerNumber = Math.floor(Math.random() * 10) + 1;  // 1부터 10까지 랜덤 숫자 생성

// 우리가 추측할 숫자들을 배열에 넣어볼게요
const myGuesses = [3, 7, 5, 9, 1];                         // 추측할 숫자들을 미리 정해놓기

// 추측할 숫자들을 문자열로 만들어서 보여주기 (join 대신 for문 사용)
let guessString = "";
for (let i = 0; i < myGuesses.length; i++) {
  if (i > 0) guessString += ", ";                           // 첫 번째가 아니면 쉼표 추가
  guessString += myGuesses[i];                              // 숫자를 문자열에 추가
}

console.log("🤔 제가 추측할 숫자들:", guessString);
console.log("🤖 컴퓨터가 선택한 숫자:", computerNumber);

// 각 추측을 하나씩 확인해보겠습니다 (forEach 대신 for문 사용)
for (let i = 0; i < myGuesses.length; i++) {               // 추측 목록을 하나씩 확인하면서
  const guess = myGuesses[i];                               // 현재 추측 숫자를 가져와요

  if (guess === computerNumber) {                           // 만약 추측한 숫자가 정답과 같다면
    console.log(`🎉 ${i + 1}번째 추측 ${guess}: 정답입니다!`);
  } else if (guess < computerNumber) {                      // 추측한 숫자가 정답보다 작다면
    console.log(`📈 ${i + 1}번째 추측 ${guess}: 너무 작아요!`);
  } else {                                                  // 추측한 숫자가 정답보다 크다면
    console.log(`📉 ${i + 1}번째 추측 ${guess}: 너무 커요!`);
  }
}

// 게임 결과 발표 (includes 대신 for문 사용)
let isWinner = false;                                       // 정답을 맞혔는지 확인하는 변수
for (let i = 0; i < myGuesses.length; i++) {               // 추측 목록을 하나씩 확인하면서
  if (myGuesses[i] === computerNumber) {                   // 만약 추측 중에 정답이 있다면
    isWinner = true;                                        // 승리 표시를 해요
    break;                                                  // 반복을 멈춰요
  }
}

if (isWinner) {                                            // 만약 정답을 맞혔다면
  console.log("🏆 축하합니다! 숫자를 맞혔어요!");
} else {                                                   // 정답을 맞히지 못했다면
  console.log("😅 아쉽네요! 다음에 다시 도전해보세요!");
}

console.log("🎮 게임이 끝났습니다. 재미있으셨나요?");

🔄 터미널 코딩 과정 정리

터미널에서 자바스크립트를 실행하는 전체 과정을 정리해보겠습니다.

파일 실행 방식:

  1. 코드 작성: 텍스트 에디터에서 자바스크립트 파일을 만들어요
  2. 파일 저장: .js 확장자로 저장해요
  3. 터미널 열기: 컴퓨터의 터미널을 실행해요
  4. 명령어 입력: node 파일이름.js를 입력해요
  5. 결과 확인: 터미널에 출력된 결과를 확인해요

대화형 모드 방식:

  1. 터미널 열기: 컴퓨터의 터미널을 실행해요
  2. 대화형 시작: node만 입력하고 Enter를 눌러요
  3. 코드 입력: 한 줄씩 자바스크립트 코드를 입력해요
  4. 즉시 결과: 입력하자마자 결과를 바로 확인해요
  5. 종료: .exit으로 대화형 모드를 나가요

🧚‍♀️ 이야기로 다시 배우기: 컴퓨터와의 대화 교실

지금까지 배운 내용을 하나의 이야기로 다시 정리해볼게요.

한때 똑똑한 학생이 있었어요. 이 학생은 특별한 컴퓨터 교실에서 글자로 된 명령어(자바스크립트 코드)를 사용해서 컴퓨터와 대화하는 방법을 배우게 되었어요.

교실에는 두 가지 대화 방식이 있었어요.

첫 번째는 즉석 질문 방식(대화형 모드)이었어요. 학생이 컴퓨터에게 "5 + 3은 얼마예요?"라고 질문하면, 컴퓨터가 즉시 "8이에요!"라고 대답해주었어요. 간단한 궁금증을 해결할 때는 이 방법이 최고였죠.

두 번째는 과제 제출 방식(파일 실행)이었어요. 복잡한 문제를 해결할 때는 노트에 여러 단계의 문제를 차근차근 적어놓고, 완성되면 컴퓨터에게 전체 과제를 한 번에 제출했어요. 이렇게 하면 복잡하고 멋진 프로그램도 완성할 수 있었답니다.

학생은 처음에는 간단한 즉석 질문으로 연습을 했어요. "숫자 더하기", "인사말 만들기" 같은 기초 대화부터 시작했죠. 그리고 점점 실력이 늘어나면서 긴 과제를 써서 "숫자 맞추기 게임", "계산기" 같은 복잡한 프로그램도 만들 수 있게 되었어요.

이제 여러분도 이 학생처럼 터미널이라는 컴퓨터 교실에서 자바스크립트로 컴퓨터와 대화할 수 있게 되었답니다!

🧠 자주 하는 실수와 주의할 점

터미널에서 자바스크립트를 실행할 때 자주 하는 실수들을 미리 알아두면 도움이 될 거예요.

❌ 실수 1: 파일 이름을 잘못 입력하기

# 이렇게 하면 안 돼요!
node hello        # .js 확장자가 빠졌어요
node helo.js      # 파일 이름에 오타가 있어요

정확한 파일 이름과 확장자를 입력해야 해요. 파일이 있는지도 확인해보세요.

❌ 실수 2: 현재 폴더에 파일이 없을 때

# 이런 오류가 나타날 수 있어요
Error: Cannot find module '/path/to/hello.js'

파일이 현재 폴더에 있는지 확인하고, 없다면 올바른 폴더로 이동하거나 전체 경로를 입력해야 해요.

❌ 실수 3: 코드에 문법 오류가 있을 때

// 이런 코드는 실행되지 않아요
console.log("안녕하세요"  // 괄호가 닫히지 않았어요
let name = "민수;        // 따옴표가 맞지 않아요

코드를 실행하기 전에 문법을 꼼꼼히 확인해야 해요.

❌ 실수 4: 대화형 모드에서 나가는 법을 모를 때

대화형 모드에서 나가려면 .exit을 입력하거나 Ctrl+C를 두 번 눌러요. 그냥 터미널 창을 닫아도 돼요.

✏️ 연습문제로 개념 다지기

조용히 흘러가는 이 시간에, 우리가 터미널이라는 새로운 세계와 만나는 순간입니다. 마치 처음 피아노 건반에 손을 올리는 것처럼, 첫 번째 연습이 시작됩니다.

Ex1) 자기소개 프로그램을 만들어보자

// introduce.js 파일을 만들어주세요
// 나만의 자기소개 프로그램입니다!

// 개인 정보를 변수에 저장해요
const myName = "김민수";                               // 내 이름을 저장해요
const myAge = 11;                                     // 내 나이를 저장해요
const myGrade = 5;                                    // 내 학년을 저장해요
const myHobbies = ["축구", "게임", "독서"];            // 내 취미들을 배열에 저장해요
const myDream = "프로그래머";                          // 내 꿈을 저장해요

// 예쁘게 자기소개를 출력해요
console.log("=".repeat(30));                         // 선을 그어서 구분해요
console.log("🌟 나의 자기소개 🌟");
console.log("=".repeat(30));
console.log("");                                     // 빈 줄을 추가해요

console.log(`👋 안녕하세요! 저는 ${myName}입니다.`);   // 이름으로 인사해요
console.log(`🎂 나이: ${myAge}살`);                   // 나이를 알려줘요
console.log(`📚 학년: ${myGrade}학년`);               // 학년을 알려줘요

// 취미들을 for문으로 문자열로 만들어서 보여줘요 (join 대신)
let hobbyString = "";
for (let i = 0; i < myHobbies.length; i++) {
  if (i > 0) hobbyString += ", ";                     // 첫 번째가 아니면 쉼표 추가
  hobbyString += myHobbies[i];                        // 취미를 문자열에 추가
}
console.log(`🎨 취미: ${hobbyString}`);                // 취미들을 보여줘요

console.log(`💭 꿈: ${myDream}`);                     // 내 꿈을 알려줘요

console.log("");                                     // 빈 줄을 추가해요
console.log("🚀 Node.js로 프로그래밍을 배우고 있어요!");
console.log("✨ 앞으로 멋진 프로그램을 많이 만들고 싶어요!");

Ex2) 구구단을 출력하는 프로그램을 만들어보자

// gugudan.js 파일을 만들어주세요
// 구구단을 예쁘게 출력하는 프로그램입니다!

// 출력할 구구단의 단을 설정해요
const dan = 7;                                        // 7단을 출력할 거예요

// 구구단 시작을 알려줘요
console.log(`🔢 ${dan}단을 출력합니다!`);
console.log("─".repeat(20));                         // 선을 그어서 구분해요

// 1부터 9까지 반복하며 구구단을 계산해요
for (let i = 1; i <= 9; i++) {                       // 1부터 9까지 하나씩 증가하며 반복
  const result = dan * i;                             // 단 곱하기 i를 계산해요
  console.log(`${dan} × ${i} = ${result}`);           // 계산 결과를 출력해요
}

console.log("─".repeat(20));                         // 마무리 선을 그어요
console.log("✅ 구구단 출력이 완료되었습니다!");

Ex3) 간단한 계산기 프로그램을 만들어보자

// calculator.js 파일을 만들어주세요
// 간단한 계산기 프로그램입니다!

// 계산할 두 숫자를 설정해요
const num1 = 15;                                      // 첫 번째 숫자
const num2 = 4;                                       // 두 번째 숫자

// 계산기 시작을 알려줘요
console.log("🔧 간단한 계산기를 시작합니다!");
console.log(`📊 계산할 숫자: ${num1}, ${num2}`);
console.log("─".repeat(25));

// 사칙연산을 모두 계산해요
const addition = num1 + num2;                         // 더하기 계산
const subtraction = num1 - num2;                      // 빼기 계산
const multiplication = num1 * num2;                   // 곱하기 계산
const division = num1 / num2;                         // 나누기 계산

// 결과를 예쁘게 출력해요
console.log(`➕ 더하기: ${num1} + ${num2} = ${addition}`);
console.log(`➖ 빼기: ${num1} - ${num2} = ${subtraction}`);
console.log(`✖️  곱하기: ${num1} × ${num2} = ${multiplication}`);
console.log(`➗ 나누기: ${num1} ÷ ${num2} = ${division.toFixed(2)}`); // 소수점 둘째 자리까지 표시

console.log("─".repeat(25));
console.log("🎯 모든 계산이 완료되었습니다!");

지금까지 터미널에서 자바스크립트를 실행하는 방법에 대해 자세히 알아보았습니다. 처음에는 검은 화면이 조금 무섭게 느껴질 수도 있지만, 익숙해지면 정말 강력하고 편리한 도구가 될 거예요. 마치 자전거 타기와 같아서, 한 번 배우면 평생 유용하게 사용할 수 있답니다!

📝 복습 문제 - 이전 단원 내용 기억하기

이번 시간에 새로운 내용을 배웠으니, 이전에 배운 중요한 내용도 복습해볼까요?

🔢 Node.js 프로젝트 구조 복습 (17.4.2단원에서 배운 내용)

문제 1: Node.js 프로젝트의 기본 구조에서 각 파일의 역할을 설명해보세요.

해답:

  1. package.json: 프로젝트의 신분증 역할을 해요. 프로젝트의 이름, 버전, 필요한 다른 프로그램들의 목록 등 모든 중요한 정보가 들어있어요.

  2. index.js (또는 app.js): 프로그램이 시작되는 시작점이에요. 마치 집의 현관문처럼, 프로그램의 첫 번째 파일이죠.

  3. config.js: 프로젝트의 설정 정보를 모아둔 파일이에요. 프로젝트 이름, 포트 번호, 디버그 모드 등의 설정들이 들어있어요.

  4. utils.js: 여러 곳에서 자주 사용하는 유용한 함수들을 모아둔 파일이에요. 도구창고 같은 역할을 해요.

문제 2: 모듈을 만들 때 꼭 해야 하는 중요한 작업은 무엇인가요?

해답:
모듈을 만들 때는 반드시 module.exports를 사용해서 다른 파일에서 사용할 수 있도록 내보내기를 해야 해요.

// 함수를 만들었다면
function createGreeting(name) {
  return `안녕하세요, ${name}님!`;
}

// 반드시 내보내기를 해줘야 해요
module.exports = { createGreeting };

이렇게 해야 다른 파일에서 require로 가져와서 사용할 수 있어요.

해설: Node.js 프로젝트에서는 각 파일이 고유한 역할을 가지고 체계적으로 구성되어야 해요. 그리고 모듈 시스템을 통해 코드를 재사용할 수 있게 만드는 것이 중요해요.

✅ 학습 완료 체크리스트

이번 시간에 배운 내용들을 모두 이해했는지 확인해보세요!

학습 내용 이해했나요?
터미널의 기본 개념
node 명령어 사용법
대화형 모드와 파일 실행 방식
자주 하는 실수들
실전 예제 이해

📂 마무리 정보

오늘 배운 17.4.3 내용이 여러분의 자바스크립트 지식 상자에 잘 저장되었나요? 터미널은 처음에는 어색할 수 있지만, 익숙해지면 정말 강력한 도구가 될 거예요. 다음 시간에는 더 재미있는 내용으로 만나요!

기억할 점: 터미널에서 자바스크립트를 실행하는 것은 마치 컴퓨터와 직접 대화하는 것과 같다는 점을 꼭 기억해두세요. 대화형 모드는 간단한 실험에, 파일 실행은 복잡한 프로그램에 적합해요.


🚀 더 체계적인 JavaScript 학습을 원하신다면?
이 포스팅에서 다룬 내용을 실제로 실습해보세요!
무료 JavaScript 학습 플랫폼에서 단계별 학습과 실시간 코드 실행을 통해
더욱 효과적이고 재미있게 학습하실 수 있습니다.
📝 실시간 코드 실행 📊 학습 진도 관리 👥 체계적 커리큘럼
📚 171개 체계적 학습레슨 · 📋 855개 4지선다 연습문제 · 🆓 완전 무료 · ⚡ 즉시 시작