📝 TIL: 마피아 게임 웹 개발 시작

📌 오늘 한 일

1. 프로젝트 개요 정리

• 마피아 게임은 소셜 디덕션 게임으로, 실시간 채팅과 투표 시스템이 핵심.
• NestJS를 백엔드 프레임워크로 선정.
• Socket.IO를 활용한 실시간 채팅 및 투표 기능 추가 계획.
• MySQL을 데이터베이스로 사용하고 TypeORM을 통해 관리 예정.
• JWT를 이용한 인증 시스템 적용.
• 배포는 AWS 환경에서 진행.

2. 기술 스택 결정 및 역할 정리

✅ 백엔드

• NestJS + TypeScript 활용.
• WebSocket을 이용한 실시간 채팅 및 게임 진행.
• TypeORM을 통한 MySQL 데이터 관리.

✅ 데이터베이스

• MySQL 테이블 설계 진행 예정.
• 주요 테이블: 유저, 게임 세션, 채팅 로그, 투표 기록, 업적 시스템.

✅ 실시간 통신

• Socket.IO를 활용하여 실시간 채팅 & 투표 기능 구현.
• WebRTC를 추가하여 음성 채팅 지원 가능성 검토.

✅ 배포 & 인프라

• AWS에 배포 (EC2, ALB 사용 예정).
• Redis를 활용한 캐싱 및 세션 관리 고려.

✅ 인증 시스템

• JWT를 활용하여 로그인/회원가입 시스템 개발 예정.

3. 첫 번째 개발 목표 설정

• ✅ NestJS 초기 프로젝트 세팅.
• ✅ TypeORM + MySQL 연결 설정.
• ⏳ 유저 엔터티(Entity) 및 인증 시스템 설계 시작.
• ⏳ WebSocket 기본 환경 설정.

🤔 오늘의 회고

• NestJS의 구조를 다시 복습하며 개발을 시작.
• 실시간 통신을 위한 WebSocket과 인증 시스템을 어떻게 효율적으로 연계할지 고민 필요.
• 마피아 게임의 게임 진행 흐름을 백엔드에서 어떻게 설계할지 큰 그림을 그려야 함.

---

TIL을 매일 기록하며 프로젝트를 진행하면 체계적으로 개발할 수 있을 것 같다.

---

면접카타

1. var, let, const에 대해 설명해주세요.

var, let, const는 JavaScript에서 변수를 선언할 때 사용하는 키워드입니다.

• var

  • 함수 스코프(Function Scope)를 가짐
  • 중복 선언 가능
  • 호이스팅(Hoisting) 시 초기화되지 않은 상태가 아니라 undefined로 초기화됨
  • var로 선언된 변수는 의도치 않은 재할당이 발생할 수 있음

• let

  • 블록 스코프(Block Scope)를 가짐
  • 중복 선언 불가능
  • 호이스팅 시 초기화되지 않고 TDZ(Temporal Dead Zone)에 머물러 참조할 경우 에러 발생
  • 값의 변경이 가능

• const

  • 블록 스코프(Block Scope)를 가짐
  • 중복 선언 불가능
  • 선언과 동시에 초기화 필수
  • 재할당 불가능 (하지만 객체나 배열의 내부 값 변경은 가능)

📌 결론
변수 선언 시 기본적으로 const를 사용하고, 값이 변경될 필요가 있을 경우 let을 사용하는 것이 좋습니다. var는 사용하지 않는 것이 권장됩니다.

---

2. Promise란 무엇인지 설명해주세요.

Promise는 JavaScript에서 비동기 작업을 처리할 때 사용되는 객체로, 미래에 완료될(또는 실패할) 작업을 나타냅니다.

특징

• 비동기 작업의 결과를 .then(), .catch(), .finally()로 처리 가능
• pending → fulfilled 또는 rejected 상태로 변환됨
• then()을 사용하여 비동기 작업의 성공 결과를 처리하고, catch()를 통해 에러를 처리할 수 있음

예제

const myPromise = new Promise((resolve, reject) => {
  setTimeout(() => {
    resolve("작업 완료!");
  }, 2000);
});

myPromise
  .then(result => console.log(result))  // "작업 완료!" 출력
  .catch(error => console.error(error));

📌 결론
Promise는 콜백 지옥(Callback Hell)을 방지하고, 비동기 코드의 가독성을 향상시킵니다.

---

3. async/await 이란 무엇인지 설명해주세요.

async/await는 Promise를 보다 간결하고 가독성 좋게 사용할 수 있도록 도와주는 ES8(ES2017) 문법입니다.

특징

• async 키워드를 함수 앞에 붙이면 해당 함수는 Promise를 반환하는 비동기 함수가 됨
• await 키워드는 Promise가 완료될 때까지 기다린 후 값을 반환함
• try...catch 문을 사용하여 Promise의 에러 처리를 간단하게 할 수 있음

예제

async function fetchData() {
  try {
    let response = await fetch("https://jsonplaceholder.typicode.com/todos/1");
    let data = await response.json();
    console.log(data);
  } catch (error) {
    console.error("에러 발생:", error);
  }
}

fetchData();

📌 결론
async/await는 Promise를 더욱 직관적으로 사용할 수 있도록 하며, 동기적인 코드처럼 보이게 만들어 가독성을 높여줍니다.