Node.js 사용해 보기

완료됨

이 단원에서는 Node.js 스크립트를 만들고 실행합니다.

브라우저에서 개발 컨테이너 시작

개발 컨테이너 환경은 이 프로젝트의 모든 연습을 완료하는 데 필요한 모든 종속성에서 사용할 수 있습니다. 브라우저의 GitHub Codespaces에서 또는 Visual Studio Code를 사용하여 로컬로 개발 컨테이너를 실행할 수 있습니다.

GitHub Codespaces는 사용자 인터페이스로 웹용 Visual Studio Code를 사용하여 GitHub에서 관리하는 개발 컨테이너를 실행합니다. 가장 간단한 개발 환경의 경우, 이 학습 모듈을 완료하기 위해 올바른 개발자 도구와 종속성이 미리 설치되도록 GitHub Codespaces를 사용합니다.

중요

모든 GitHub 계정은 2개의 코어 인스턴스를 사용하여 매월 최대 60시간 동안 Codespaces를 무료로 사용할 수 있습니다. 자세한 내용은 GitHub Codespaces 월별 포함 스토리지 및 코어 시간을 참조하세요.

  1. MicrosoftDocs/node-essentials GitHub 리포지토리의 main 분기에 새 GitHub Codespace를 만드는 프로세스를 시작합니다.

  2. codespace 만들기 페이지에서 codespace 구성 설정을 검토한 다음, codespace 만들기를 선택합니다.

    새 codespace를 만들기 전에 확인 화면의 스크린샷

  3. codespace가 생성될 때까지 기다립니다. 이 프로세스에는 몇 분 정도 걸릴 수 있습니다.

  4. codespace에서 새 터미널을 엽니다.

    기본 메뉴를 사용하여 터미널 메뉴 옵션으로 이동한 다음, 새 터미널 옵션을 선택할 수 있습니다.

    새 터미널을 여는 codespaces 메뉴 옵션의 스크린샷

Node.js REPL

Node.js에는 빠른 코드 평가 및 실험에 유용한 기본 제공 REPL(read–eval–print loop) 모드가 있습니다. REPL 모드는 JavaScript 코드를 입력하고, Node.js에서 코드를 해석하여 실행하고, 출력을 인쇄할 수 있는 대화형 콘솔 환경입니다.

Node.js REPL 모드는 다음과 같이 작동합니다.

  • 읽기: 사용자의 JavaScript 입력을 읽고 구문 분석하거나 코드가 잘못된 경우 오류를 표시합니다.
  • 평가: 입력한 JavaScript 코드를 평가합니다.
  • 인쇄: 계산된 결과를 인쇄합니다.
  • 루프: 반복하고 사용자가 새 명령을 입력하는 동안 기다리거나, 사용자가 Ctrl+C를 두 번 누르면 종료합니다.

REPL 모드를 시작하려면 개발 컨테이너의 터미널에서 node 프로그램을 실행합니다.

참고 항목

마우스 오른쪽 단추로 >붙여넣기를 클릭하여 복사한 명령을 REPL 콘솔에 입력합니다.

node

REPL 환경이 열립니다. REPL 프롬프트가 나타납니다.

>

REPL 콘솔에서 다음 코드를 입력합니다(>붙여넣기를 마우스 오른쪽 단추로 클릭).

console.log('Hello World, from the REPL.')

이 코드는 REPL 콘솔에 “Hello World, from the REPL.” 메시지를 출력합니다.

Hello World, from the REPL.

REPL 콘솔을 종료하려면 Ctrl+C를 두 번 입력합니다.

Node.js 스크립트 만들기

또한 Node.js는 파일에서 코드를 실행하도록 지원합니다.

  1. 개발 컨테이너에 hello-world라는 새 폴더를 만듭니다.

  2. 폴더 이름을 마우스 오른쪽 단추로 클릭한 다음 통합 터미널에서 열기를 선택하여 터미널에서 새 폴더를 엽니다.

  3. 터미널에서 노드 프로젝트를 초기화합니다.

    npm init -y
    
  4. node-fetch 노드 패키지를 설치하여 비동기 HTTP 요청을 수행합니다.

    npm install node-fetch
    
  5. package.json 파일을 열고 다음 속성을 추가하여 최상위 비동기/대기를 허용합니다.

    "type":"module",
    
  6. 새 폴더에 이름이 index.js인 파일을 만듭니다.

  7. 다음 코드를 index.js 파일에 복사합니다.

    console.log('Hello World, from a script file.');
    
  8. 터미널에서 node 명령을 입력한 다음 파일 이름 index.js를 입력합니다.

    node index.js
    

    다음 출력이 표시됩니다.

     Hello World, from a script file.
    

이제 첫 번째 Node.js JavaScript 코드를 실행했습니다.

  • 질문: console.log는 동기식인가요, 비동기식인가요?
  • 대답: console.log 메서드는 개발 중에 즉시 실행되는 것으로 나타나므로 비동기식으로 간주됩니다. 이 메서드에 대한 비동기 동작이 보장되지 않으므로 동기식으로 간주되어야 합니다. console.log 메서드가 완료될 때까지 코드 실행이 차단될 수 있으므로 프로덕션 코드에 console.log 문을 유지하지 않도록 주의해야 합니다.

최상위 비동기 함수 추가

다음 최상위 비동기 코드는 HTTP JSON 데이터 원본을 요청한 다음 이를 표시합니다.

  1. 비동기 HTTP 요청을 만들려면 index.js 파일에 다음 코드를 추가합니다.

    import fetch from 'node-fetch';
    
    console.log(`start`);
    try {
      const res = await fetch('https://github.com/MicrosoftDocs/node-essentials');
    
      console.log('statusCode:', res.status);
    } catch (error) {
      console.log(`error: ${error}`);
    }
    console.log(`end`);
    

    https.get 메서드는 Node.js 웹 사이트에 HTTP 요청을 하고 응답을 반환합니다. get 메서드는 요청할 URL과 응답 수신 시 호출되는 콜백 함수라는 두 가지 매개 변수를 사용합니다. 콜백 함수는 응답 개체인 단일 매개 변수 res를 사용합니다.

  2. 애플리케이션 다시 실행:

    node index.js
    
  3. 콘솔 로그의 순서는 다음과 같습니다.

    start
    statusCode: 200
    end
    

출력에서 이벤트 루프가 작동하는 것을 볼 수 있습니다. HTTP 메서드가 호출되어 작업 큐에 배치되고 반환될 때까지 기다립니다. 이벤트 루프는 다음 작업인 console.log 메서드를 사용합니다.

개발 컨테이너 중지

GitHub Codespaces 환경을 삭제하면 계정에 대해 얻을 수 있는 코어당 무료 사용 권한을 최대화할 수 있습니다.

중요

GitHub 계정의 자격에 대한 자세한 내용은 GitHub Codespaces 월별 포함된 스토리지 및 코어 시간을 참조하세요.

  1. GitHub Codespaces 대시보드(https://github.com/codespaces)에 로그인합니다.

  2. MicrosoftDocs/node-essentials GitHub 리포지토리에서 제공된 현재 실행 중인 Codespaces를 찾습니다.

    상태 및 템플릿을 포함하여 실행 중인 모든 Codespaces의 스크린샷.

  3. codespace에 대한 상황에 맞는 메뉴를 열고 삭제를 선택합니다.

    삭제 옵션이 강조 표시된 단일 codespace에 대한 상황에 맞는 메뉴의 스크린샷