Socket.io를 사용하여 실시간 영화 예매 시스템 구현하기

Socket.io는 실시간 웹 기능을 구현하기 위해 사용되는 라이브러리입니다. 이를 이용하여 영화 예매 시스템을 실시간으로 업데이트할 수 있습니다. 이제 Socket.io를 사용하여 실시간 영화 예매 시스템을 어떻게 구현할 수 있는지 알아보겠습니다.

단계 1: 프로젝트 설정

먼저 Node.js와 Express 프레임워크를 사용하여 기본적인 프로젝트 구조를 설정합니다. 아래 명령어를 사용하여 Express 애플리케이션을 생성합니다.

$ mkdir movie-booking-system
$ cd movie-booking-system
$ npm init
$ npm install express --save

단계 2: Socket.io 설정

다음으로 Socket.io를 설치하고 설정합니다. 아래 명령어를 사용하여 Socket.io를 설치합니다.

$ npm install socket.io --save

그리고 app.js 파일에 아래 코드를 추가하여 Socket.io를 초기화합니다.

const express = require('express');
const app = express();
const http = require('http').Server(app);
const io = require('socket.io')(http);

// Socket.io 코드 작성
// ...

http.listen(3000, () => {
  console.log('Server is running on port 3000');
});

단계 3: 실시간 예매 업데이트

이제 Socket.io를 사용하여 실시간 예매 업데이트를 구현할 수 있습니다. 클라이언트가 예매를 진행할 때마다 서버로 해당 정보를 전송하고, 서버는 이를 다른 모든 연결된 클라이언트에게 브로드캐스팅하여 실시간으로 예매 내역을 업데이트합니다.

io.on('connection', (socket) => {
  console.log('A user connected');

  // 예매 정보 전송
  socket.on('booking', (bookingInfo) => {
    // 예매 정보를 다른 클라이언트에게 브로드캐스팅
    socket.broadcast.emit('bookingUpdate', bookingInfo);
  });

  // 연결 해제
  socket.on('disconnect', () => {
    console.log('A user disconnected');
  });
});

단계 4: 클라이언트 구현

이제 클라이언트에서 Socket.io를 사용하여 실시간 예매 업데이트를 받아올 수 있도록 구현합니다. 예매 정보가 업데이트될 때마다 클라이언트는 해당 정보를 받아올 수 있습니다.

// index.html

<!DOCTYPE html>
<html>
  <head>
    <title>Movie Booking System</title>
    <script src="/socket.io/socket.io.js"></script>
    <script>
      const socket = io();

      // 실시간 예매 업데이트를 받아옴
      socket.on('bookingUpdate', (bookingInfo) => {
        // 예매 정보를 사용하여 UI를 업데이트
        // ...
      });

      // 예매 진행 시 서버로 정보를 전송
      function bookMovie(movieId) {
        const bookingInfo = {
          movieId: movieId,
          // 추가 정보
        };
        socket.emit('booking', bookingInfo);
      }
    </script>
  </head>
  <body>
    <!-- 영화 목록 -->
    <!-- <button onclick="bookMovie(movieId)">예매</button> -->
  </body>
</html>

위와 같은 방식으로 Socket.io를 사용하여 실시간 영화 예매 시스템을 구현할 수 있습니다. 클라이언트에서 예매 진행 시 서버로 정보를 전송하고, 서버는 해당 정보를 다른 클라이언트에게 브로드캐스팅하여 실시간으로 예매 내역을 업데이트합니다.

더 많은 정보는 Socket.io 공식 문서를 참고하시기 바랍니다.