Node.js - day01

node.js

node.js 란

  • 서버에서 실행되는 자바스크립트
  • 백엔드와 프론트엔드가 같은 언어를 사용하는게 장점
  • Google v8 Javascript 엔진을 사용하여 코드를 실행하고 기본 모듈이 자바스크립트로 사용
  • 웹 서버(Apach, iis, zeus..)등과 같은 소프트웨어가 필요없이 웹 서버 역할을 할 수 있는 내장 라이브러리가 존재
  • npm이라는 패키지 관리자(라이브러리를 다운받아 탑재시키는 역할)이 포함

설치 확인
cmd 또는 문서편집기의 터미널 >> node -v

npm 버전 확인 : npm -v

package.json 만들기

  • 실행 시 참고하는 json 파일
  • npm init : 옵션을 직접 제공해서 생성(enter로 문답 진행, 괄호는 기본값)
  • npm init -y : 기본 설정

    해당 폴더에 위와 같이 node_modules 폴더와 package.json, package-lock.json 2개의 파일이 생성된다.

fs 모듈

  • 파일 처리와 관련된 모듈
  • node.ljs에서 가장 중요하고 기초적인 모듈
    • readFile() : 파일을 비동기적으로 읽음
    • readFileSync() : 파일을 동기적으로 읽음
    • writeFile() : 파일을 비동기적으로 씀
    • writeFileSync() : 파일을 동기적으로 씀

fs모듈을 이용하여 파일 읽기

readFile()은 비동기 파일 실행함수이다. 따라서 비동기적으로 실행하기 때문에 아래의 코드가 존재한다음 아래의 코드를 먼저 실행하고 마지막으로 실행 될 것이다.
그러나 임의적으로 만든 setTimeOut함수보다 먼저 실행되는 것을 알 수 있다. 단, setTimeOut에서 delayTime을 0으로 한다면 해당 함수의 비동기적 실행이 먼저 실행 되는 것을 알 수 있다.

//require() : 다른 곳에 있는 모듈을 불러오는 함수
const fs = require("fs");

// 비동기식
// readFile('파일경로', '인코딩방식', 콜백함수) : 경로에 있는 파일을 읽고 넘겨주는 콜백함수 호출
//콜백함수의 첫번째 매개변수 : 파일 읽기 실패 시 에러에 대한 무언가가 담김.
// 콜백함수의 두번째 매개변수 : 파일 읽기 성공 시 파일의 데이터를 담아줌
fs.readFile("./text1.txt", "utf-8", (err, data) => {
  if (err) {
    console.log(err);
  } else {
    console.log("비동기식으로 파일 읽기: " + data);
  }
});

// 즉시 실행 함수로써 동기적으로 실행되는 console과 setTimeout으로 비동기적으로 실행되는 코드가 2개 존재한다.
const first = (function () {
  // 실행컨텍스트에서 먼저 실행됨
  console.log("비동기 보다 빠르게 실행됨");
  // 비동기 파일읽기가 실행된 다음 가장 늦게 실행됨. 단, 0초를 주면 먼저 실행됨
  setTimeout(() => {
    console.log("이것도 먼저 실행될까?");
  }, 0);
})();

const text = fs.readFileSync("./text1.txt", "utf-8");
console.log("동기식으로 파일 읽기 : " + text);

// 파일 여는데 시간이 걸리니 비동기식으로 파일을 열면서 지나갔다가
// 동기식 먼저 처리하고 다시 돌아와서 콜백함수를 보여줌
// readFile의 함수부분은 태스크 큐로 보내고
// 아래의 코드 먼저 콜스택으로 실행컨텍스트로 처리한다.

fs모듈로 파일 쓰기

동기방식과 비동기방식은 읽기 방식과 동일하게 작동되는 것을 알 수있다.
쓰고자하는 파일의 크기가 용량이 클때 비동기식으로 처리하는 것이 유리하다.
이 것은 파일 읽기도 마찬가지이다.

const fs = require("fs");
const data = "Hello Node.js! 정말 재밌는 node.js야!";

// 비동기식
// 첫번째 매개변수 : 만들고자 하는 파일 이름과 위치
// 두번째 매개변수 : 넣고자하는 내용
// 세번째 매개변수 : 인코딩 방식
// 네번째 매개변수 : callback 함수
fs.writeFile("./text2.txt", data, "utf-8", (err) => {
  if (err) {
    console.log(err);
  } else {
    console.log("비동기식으로 파일 저장");
  }
});

// 동기식으로 파일 저장
// 첫번째 매개변수 : 만들고자 하는 파일 이름과 위치
// 두번째 매개변수 : 넣고자하는 내용
// 세번째 매개변수 : 인코딩 방식
// 네번째 매개변수는 존재하지 않음.
fs.writeFileSync("./text3.txt", data, "utf-8");
console.log("동기식으로 파일 저장");

예외처리

try{
예외가 발생할 수 있는 문장
} catch(e){
예외가 발생했을 경우 수행할 문장
}finally{
예외 발생 여부에 상관없이 수행할 문장
}

try catch문을 이용하면 오류가 발생시 프로그램 강제종류 없이 다음 코드로 넘어 갈 수있도록 만들어 준다.
아래 예시 코드는 파일이 있을 경우 try에서 처리되는 경우와 파일이 존재하지 않아 읽기에 실패했을 경우 error를 catch하는 경우이다.

const fs = require("fs");
let text = null;

// 예외 처리
try {
  // text에 동기식으로 읽은 파일을 내용을 할당한다.
  text = fs.readFileSync("./text3.txt", "utf-8");
  console.log(text);
} catch (error) {
  // 에러가 발생하면 아래와 같이 에러와 안내문구를 출력한다.
  console.log(error);
  console.log("동기식으로 파일 읽기 실패염");
} finally {
  //위의 구문에 상관없이 해당 내용을 실행한다.
  console.log("완료");
}

위 코드는 아래와 같이 실행하도록 한다.

const fs = require("fs");
let text = null;

// 예외 처리
try {
  // text에 동기식으로 읽은 파일을 내용을 할당한다.
  text = fs.readFileSync("./text4.txt", "utf-8");
  console.log(text);
} catch (error) {
  // 에러가 발생하면 아래와 같이 에러와 안내문구를 출력한다.
  console.log(error);
  console.log("동기식으로 파일 읽기 실패염");
} finally {
  //위의 구문에 상관없이 해당 내용을 실행한다.
  console.log("완료");
}

위 코드는 아래와 같이 에러구문과 해당 문구를 출력한다.

node 실행을 보면 알 수 있듯이 trycatch문을 사용하였을 경우 에러가 발생 시 프로그램이 종료되거나 정지하지 않고 개발자의 의도대로 에러 내용과 에러 문구, finally의 내용을 보여준다.
크롬으로 실행 시 보면 위의 내용은 console로 에러발생이 아닌 에러구문, 즉 문자열 자체를 반환하여 보여준다.

http 모듈

  • http 웹 서버를 생성하는 것과 관련된 모든 기능을 담당
    • createServer() : server 객체를 생성
    • writeHead() : 응답 header를 구성
    • end() : 응답 body를 작성
    • listen() : 서버를 실행하고 클라이언트를 기다림

MIME형식

  • 응답의 형식이 무엇인지를 Header에 포함된 MIME을 통해 브라우저에 알려줌 브라우저는 이것을 참고하여 응답을 어떻게 해석할 지 알 수 있다.

형식은 매우 다양하여 여기에는 간단히 짚고 넘어가겠다
text/plain 일반적인 text 파일
text/html
text/css
text/xml
image/jpeg jpeg 이미지 파일
image/png
video/mpeg
audio/mp3
...

// http 모듈을 사용한다.
const http = require("http");

// createServer는 콜백함수를 매개변수를 가지고
// 콜백함수는 2개의 매개변수를 가진다
// 첫번째 매개변수 : 사용자 요청에 대한 정보
// 두번째 매개변수 : 사용자에게 응답을 하기 위한 정보
const server = http.createServer((req, resp) => {
 // writeHead함수는 createServer의 두번째 매개변수인 response의 메소드로 첫번째 매개변수는 서버응답 코드이다.(보통 완료는 200), 두번째 매개변수는 content-type으로 응답body에 들어갈 MIME 형식을 작성한다. 두번째 매개변수는 key value의 객체타임으로 작성한다.
 resp.writeHead(200, { "content-type": "text/html" });
 // end함수의 매개변수로 바디그대로 들어간다.
 resp.end(`<!DOCTYPE html>
 <html lang="en">
 <head>
   <meta charset="UTF-8">
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <title>HTTP 모듈 테스트</title>
 </head>
 <body>
   <h2>http 모듈 테스트</h2>
   <p>처음으로 실행하는 node.js http 서버</p>
 </body>
 </html>`);
});
// 위와 같이 서버를 만들었다면 아래와 같이 listen으로 클라이언트를 기다려 응답해줄 준비를 한다.
// 첫 번째 매개변수는 호스트 num을 작성하고 2번째 매개변수는 callback함수로 즉시 실행되는 함수이다.
server.listen(3000, () => {
 console.log(`3000번 포트로 서버 실행중...`);
});

위와 같이 사용할 때는 body를 전부 써야되는 불편함이 존재하여 파일읽기를 이용한다.
html파일을 만들고 해당 파일을 불러와서 서버로 만들면 되는 것이다.

서버에서 요청 응답할 html을 만든다.

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>HTTP 모듈 테스트</title>
</head>
<body>
  <h2>http 모듈 테스트</h2>
  <p>처음으로 실행하는 node.js http 서버</p>
  <p>파일 입출력을 통해서 응답중</p>
</body>
</html>

요청 받을 서버를 만든다.

//파일을 불러오기 위해서 fs모듈을 가져온다.
const fs = require("fs");
// http서버를 만들기위해서 http 모듈을 가져온다.
const http = require("http");

//http 서버를 만든다.
http
  .createServer((req, resp) => {
    // 서버를 요청 받을 때 해당 코드를 응답함.
    // 비동기적으로 파일을 가져온다.
    fs.readFile("./text.html", "utf-8", (err, data) => {
      // 파일이 존재하지 않을 때 에러처리
      if (err) {
        console.log(err);
      } else {
        // 파일이 존재하때 응답,
        resp.writeHead(200, { "content-type": "text/html" });
        // data에는 html이 할당되어 있다.
        resp.end(data);
        //console.log(req.headers["user-agent"]);
      }
    });
  })
  .listen(3000, () => {
    // 응답준비가 되면 다음과 같이 실행
    console.log(`3000번 포트로 서버 실행중...`);
  });

위와 같이 사용하면 코드의 가독성이 좋아진다.

좋은 웹페이지 즐겨찾기