02 · JavaScript와 Node
짧은 ASCII 예제를 실행하고, 함수와 모듈을 바꾸고, package.json을 읽습니다.
만들 결과물: 코드의 입력과 출력, 실행 방법을 설명할 수 있는 작은 Node.js 프로젝트.
Node 실습 ZIP 다운로드 · 개념 찾아보기 · 선택 · 실행 용어 지도
각 예제에서 예상 → 실행 → 한 가지 변경 → 설명을 반복합니다. 하루 안에 전부 마칠 필요는 없습니다. 입력과 출력은 우선 Sam, Hello 같은 ASCII 문자로 실험합니다. 한글과 문자 인코딩은 통신 단원에서 별도로 배웁니다.
준비
압축을 푼 02-JavaScript와Node 폴더를 편집기와 터미널에서 엽니다. Node.js 24가 필요합니다.
node --version
npm --version첫 실행과 모듈 예제는 설치 없이 할 수 있습니다. 패키지·TypeScript 단계 전에 이 폴더에서 설치합니다.
npm ci --ignore-scripts미션 1 · 두 줄부터 읽기
01-runtime/hello.mjs의 전체 코드는 두 줄입니다.
const name = process.argv[2];
console.log(`Hello, ${name}!`);다음 출력을 예상한 뒤 실행합니다.
node 01-runtime/hello.mjs Sam
node 01-runtime/hello.mjs AlexHello를 Welcome으로 바꾸고 다시 실행합니다. 이름을 생략하면 무엇이 출력되는지도 확인합니다. 아직 기본 이름이나 입력 검증을 추가하지 않습니다.
npm run environment -- one two| 찾을 것 | 기록할 내용 |
|---|---|
process.cwd() | 명령을 실행한 작업 폴더 |
process.argv[1] | Node가 읽은 코드 파일 |
process.argv.slice(2) | 전달한 인자 |
typeof document | 브라우저와 Node 환경의 차이 |
작은 도전: cd 01-runtime 후 node environment.mjs를 실행합니다. 작업 폴더와 코드 파일 위치 중 무엇이 바뀌었는지 비교하고 cd ..로 돌아옵니다.
미션 2 · 객체 하나를 함수에 전달하기
npm run modules02-modules/demo.mjs와 notes.mjs를 나란히 읽습니다.
export function formatNote(note) {
return `${note.id}. ${note.text}`;
}- 배열에
{ id: 3, text: "Try modules" }를 추가합니다. - 객체 하나가 함수에 들어가고 문자열 하나가 나오는 곳을 찾습니다.
- 출력 형식을
1. Learn JavaScript에서[1] Learn JavaScript로 바꿉니다. - 어느 파일의 어느 줄을 바꾸었는지 설명합니다.
힌트: 함수와 출력은 어떻게 이어질까요?
for...of가 배열에서 객체를 하나씩 꺼냅니다. formatNote(note)의 반환값이 console.log의 입력으로 들어갑니다. 함수 안의 return과 호출한 곳의 console.log를 함께 보세요.
이 함수는 입력을 검증하거나 번호를 자동으로 만들지 않습니다. 학생이 직접 만든 두 객체를 문자열로 바꾸는 일에 집중합니다.
미션 3 · 명령에 이름 붙이기
앞의 설치를 마친 뒤 실행합니다.
npm run
npm run package:demopackage.json에서 실제 명령과 필요한 패키지를 찾습니다.
| 항목 | 확인할 질문 |
|---|---|
scripts.hello | 어떤 파일을 실행하는가? |
dependencies.lesson-label | 자료 안의 어느 폴더를 사용하는가? |
devDependencies.typescript | 어떤 개발 도구를 설치하는가? |
package-lock.json | 구체적인 버전과 구조는 어디에 기록되는가? |
node_modules | 설치한 코드나 연결은 어디에 놓이는가? |
자기 이름으로 실행하는 hello:me 스크립트를 추가합니다.
"hello:me": "node 01-runtime/hello.mjs Sam"npm run hello:me로 실행합니다. 기존 항목 사이의 쉼표에 주의하세요.
lesson-label은 자료 안의 로컬 패키지입니다. 03-package/lesson-label/을 열고 패키지 이름 import와 연결해 보세요. 더 자세한 설정은 개념 찾아보기에서 확인할 수 있습니다.
다음 단계로 가기 전
- JavaScript는 언어, Node.js는 실행 환경이라고 설명합니다.
- 실행 명령에서 실제 파일까지 따라갑니다.
- 객체를 받아 문자열을 반환하는 함수를 바꿀 수 있습니다.
- 직접 만든 모듈, Node 내장 모듈, 설치한 패키지를 구분합니다.
다음: 기다리고, 쓰고, 읽기.