노드심화 3-4,5

·2022년 12월 27일
0

study

목록 보기
33/81
post-thumbnail

왜 코드 분리해야하는가?

  1. 가독성 향상: 코드를 분리하면서 추상화가 자연스럽게 되기 때문에 코드를 읽기가 훨씬 수월해집니다.
  2. 관리(유지보수)의 용이: 어떤 함수가 어떤 역할을 갖는지 비교적 쉽게 파악할 수 있습니다.

추상화

추상화: 코드를 이해하기 쉽게 원래 있던 코드를 분리하면서 새로운 함수를 만들어 나가는 과정

//소켓 연결 이벤트
io.on("connection", (sock) => {
  const { watchBuying, watchByeBye } = initSocket(sock);

  watchBuying();
  watchByeBye();
});

function initSocket(sock) {
  console.log("새로운 소켓이 연결되었습니다.");

  //sock.on을 대신해서, 어떤 역할을 하는지 추상화 한 함수
  function watchEvent(eventName, func) {
    sock.on(eventName, func);
  }

  function sendMessageAll(eventName, data) {
    io.emit(eventName, data);
  }

  return {
    watchBuying: () => {
      watchEvent("BUY", (data) => {
        console.log(data);
        const emitDate = {
          nickname: data.nickname,
          goodsId: data.goodsId,
          goodsName: data.goodsName,
          date: new Date().toISOString(),
          //string으로 date타입을 보여줄수있도록
        };
        //io.emit하면 소켓이 연결된 모든 사용자들에게 이벤트로 데이터가 전달됨
        //sock.emit하면 로그인으로 연결된 사용자 1명에게만 전달
        //추상화해서 sendMessageAll로
        sendMessageAll("BUY_GOODS", emitDate);
      });
    },
    watchByeBye: () => {
      watchEvent("disconnect", () => {
        console.log(sock.id, "해당하는 사용자가 연결이 끊어졌어요!");
      });
    },
  };
}

파일분리

  1. 소켓 관련된 코드만 따로 정리해둘 socket.js 파일 만들기
  2. 서버를 여는 코드만 따로 뺴서 server.js 파일을 생성
    => 추상화를 통해 소켓 관련 코드의 가독성을 높이고, app.js 파일에 있던 소켓과 관련된 모든 코드를 socket.js 파일로 분리해서 app.js 파일의 가독성을 높일 수 있게 됨.
//socket.js
const socketIo = require("socket.io");
const http = require("./app");

const io = socketIo(http);

io.on("connection", (sock) => {
  const {watchBuying, watchByeBye} = initSocket(sock);

  watchBuying();

  watchByeBye();
});

function initSocket(sock) {
  console.log("새로운 소켓이 연결됐어요!");

  // 특정 이벤트가 전달됐는지 감지할 때 사용될 함수
  function watchEvent(event, func) {
    sock.on(event, func);
  }

  // 연결된 모든 클라이언트에 데이터를 보낼때 사용될 함수
  function notifyEveryone(event, func) {
    io.emit(event, func);
  }

  return {
    watchBuying: () => {
      watchEvent("BUY", (data) => {

        const emitData = {
          nickname: data.nickname,
          goodsId: data.goodsId,
          goodsName: data.goodsName,
          date: new Date().toISOString(),
        }

        notifyEveryone("BUY_GOODS", emitData);
      });
    },
    watchByeBye: () => {
      watchEvent("disconnect", () => {
        console.log(sock.id, "연결이 끊어졌어요!");
      });
    },
  }
}
//server.js
const http = require("./app");
require("./socket"); // 이렇게 불러오기만 해도 소켓에 연결이 됩니다.

http.listen(8080, () => {
  console.log("서버가 요청을 받을 준비가 됐어요");
});
profile
개발자 꿈나무

0개의 댓글