메이크샵: 상품 재입고 알림 시스템 구현 🛍️🔔

안녕, 친구들! 오늘은 정말 재미있고 유용한 주제로 이야기를 나눠볼 거야. 바로 메이크샵에서 상품 재입고 알림 시스템을 구현하는 방법에 대해서 말이지. 😊 이 기능은 쇼핑몰 운영자들에게는 꿀팁이 될 거고, 개발자들에게는 흥미진진한 도전이 될 거야. 그럼 지금부터 시작해볼까?

💡 알고 가자! 재입고 알림 시스템은 고객 서비스의 질을 높이고 매출 증대에 큰 도움을 줄 수 있어. 이 시스템을 통해 고객들은 원하는 상품이 재입고되면 바로 알림을 받을 수 있고, 쇼핑몰 운영자는 잠재적인 구매 기회를 놓치지 않을 수 있지.

자, 이제 본격적으로 재입고 알림 시스템 구현에 대해 알아보자. 우리는 이 과정을 여러 단계로 나눠서 자세히 살펴볼 거야. 각 단계마다 필요한 기술과 팁들을 친절하게 설명해줄 테니 걱정하지 마!

그리고 잠깐! 우리가 이런 멋진 시스템을 만들 수 있는 것처럼, 재능넷(https://www.jaenung.net)에서는 다양한 재능을 가진 사람들이 자신의 능력을 공유하고 거래할 수 있어. 혹시 개발에 도움이 필요하다면 재능넷을 통해 전문가의 도움을 받을 수도 있다는 걸 기억해둬!

자, 이제 정말 시작해볼까? 준비됐지? 그럼 고고! 🚀

1. 재입고 알림 시스템의 기본 구조 이해하기 🏗️

먼저, 재입고 알림 시스템의 기본 구조에 대해 알아보자. 이 시스템은 크게 세 가지 주요 컴포넌트로 구성돼 있어:

사용자 인터페이스 (UI)
백엔드 서버
데이터베이스

각 컴포넌트의 역할을 간단히 설명해줄게.

1. 사용자 인터페이스 (UI): 고객이 재입고 알림을 신청하고 관리할 수 있는 화면이야. 여기서 고객은 원하는 상품에 대한 알림을 설정하고, 기존 알림을 확인하거나 취소할 수 있어.

2. 백엔드 서버: 사용자의 요청을 처리하고, 데이터베이스와 상호작용하며, 실제 알림을 발송하는 역할을 해. 재고 상태를 주기적으로 체크하고, 조건이 맞으면 알림을 트리거하지.

3. 데이터베이스: 상품 정보, 재고 상태, 사용자 알림 설정 등의 데이터를 저장하고 관리해. 효율적인 데이터 구조 설계가 중요해!

이 세 가지 컴포넌트가 유기적으로 연결되어 작동하면서 재입고 알림 시스템이 완성되는 거야. 각 부분이 어떻게 상호작용하는지 그림으로 한번 볼까?

이 그림을 보면 각 컴포넌트가 어떻게 연결되어 있는지 한눈에 알 수 있지? 사용자 인터페이스에서 시작된 요청이 백엔드 서버를 거쳐 데이터베이스로 전달되고, 다시 역순으로 정보가 전달되는 과정을 볼 수 있어. 그리고 백엔드 서버에서 직접 알림을 발송하는 흐름도 확인할 수 있지.

이런 구조를 이해하는 것이 재입고 알림 시스템 구현의 첫 걸음이야. 각 컴포넌트의 역할과 상호작용을 잘 파악해야 효율적이고 안정적인 시스템을 만들 수 있거든.

자, 이제 기본 구조를 알았으니 각 컴포넌트를 어떻게 구현할지 더 자세히 알아볼까? 다음 섹션에서는 사용자 인터페이스 구현에 대해 이야기해볼 거야. 재미있을 거야, 기대해! 😉

2. 사용자 인터페이스(UI) 구현하기 🖥️

자, 이제 우리의 재입고 알림 시스템의 얼굴이라고 할 수 있는 사용자 인터페이스를 만들어볼 차례야. 고객들이 직접 보고 사용하는 부분이니까 정말 중요하지? 😊

🎨 UI 디자인 팁: 사용자 경험(UX)을 최우선으로 생각하자! 직관적이고 사용하기 쉬운 인터페이스가 핵심이야. 복잡한 것보다는 단순하고 깔끔한 디자인이 좋아.

UI를 구현할 때 고려해야 할 주요 요소들을 하나씩 살펴볼게:

1. 재입고 알림 신청 버튼 📢

상품 페이지에 '재입고 알림 신청' 버튼을 추가해야 해. 이 버튼은 상품이 품절 상태일 때만 보이도록 설정하는 게 좋아. 버튼 디자인은 눈에 잘 띄면서도 전체적인 페이지 디자인과 조화를 이루어야 해.


<button id="restockAlert" style="display: none; background-color: #f39c12; color: white; padding: 10px 20px; border: none; border-radius: 5px; cursor: pointer;">
  재입고 알림 신청
</button>

<script>
  // 상품 재고 상태에 따라 버튼 표시 여부 결정
  function checkStock() {
    if (productOutOfStock) {
      document.getElementById('restockAlert').style.display = 'block';
    } else {
      document.getElementById('restockAlert').style.display = 'none';
    }
  }
  
  // 페이지 로드 시 재고 확인
  window.onload = checkStock;
</script>

이런 식으로 버튼을 만들고, JavaScript를 사용해서 상품의 재고 상태에 따라 버튼을 보여주거나 숨길 수 있어.

2. 알림 신청 모달 창 💌

버튼을 클릭하면 알림 신청을 위한 모달 창이 뜨도록 만들자. 이 창에서는 사용자의 이메일 주소나 휴대폰 번호를 입력받을 거야.


<div id="alertModal" style="display: none; position: fixed; z-index: 1; left: 0; top: 0; width: 100%; height: 100%; overflow: auto; background-color: rgba(0,0,0,0.4);">
  <div style="background-color: #fefefe; margin: 15% auto; padding: 20px; border: 1px solid #888; width: 80%; max-width: 500px;">
    <h3>재입고 알림 신청</h3>
    <input type="email" id="userEmail" placeholder="이메일 주소를 입력하세요" style="width: 100%; padding: 10px; margin: 10px 0;">
    <button onclick="submitAlert()" style="background-color: #f39c12; color: white; padding: 10px 20px; border: none; border-radius: 5px; cursor: pointer;">신청하기</button>
    <button onclick="closeModal()" style="background-color: #ccc; color: black; padding: 10px 20px; border: none; border-radius: 5px; cursor: pointer; margin-left: 10px;">취소</button>
  </div>
</div>

<script>
  function openModal() {
    document.getElementById('alertModal').style.display = 'block';
  }

  function closeModal() {
    document.getElementById('alertModal').style.display = 'none';
  }

  function submitAlert() {
    // 여기에 알림 신청 로직 구현
    let email = document.getElementById('userEmail').value;
    // 이메일 유효성 검사 및 서버로 전송
    closeModal();
  }
</script>

이렇게 하면 깔끔한 모달 창이 뜨고, 사용자가 쉽게 알림을 신청할 수 있어.

3. 알림 관리 페이지 📋

사용자가 자신이 신청한 알림을 확인하고 관리할 수 있는 페이지도 필요해. 이 페이지에서는 신청한 알림 목록을 볼 수 있고, 원하면 알림을 취소할 수도 있어야 해.


<div id="alertManagement" style="max-width: 800px; margin: 0 auto; padding: 20px;">
  <h2>내 재입고 알림 관리</h2>
  <table style="width: 100%; border-collapse: collapse;">
    <thead>
      <tr>
        <th style="border: 1px solid #ddd; padding: 8px;">상품명</th>
        <th style="border: 1px solid #ddd; padding: 8px;">신청일</th>
        <th style="border: 1px solid #ddd; padding: 8px;">상태</th>
        <th style="border: 1px solid #ddd; padding: 8px;">관리</th>
      </tr>
    </thead>
    <tbody id="alertList">
      <!-- 여기에 동적으로 알림 목록 추가 -->
    </tbody>
  </table>
</div>

<script>
  function loadAlerts() {
    // 서버에서 알림 목록을 가져와 표시하는 로직
    // 예시:
    let alerts = [
      { product: "멋진 티셔츠", date: "2023-05-01", status: "대기 중" },
      { product: "편한 운동화", date: "2023-04-28", status: "알림 완료" }
    ];
    
    let alertList = document.getElementById('alertList');
    alertList.innerHTML = '';
    
    alerts.forEach(alert => {
      let row = `
        <tr>
          <td style="border: 1px solid #ddd; padding: 8px;">${alert.product}</td>
          <td style="border: 1px solid #ddd; padding: 8px;">${alert.date}</td>
          <td style="border: 1px solid #ddd; padding: 8px;">${alert.status}</td>
          <td style="border: 1px solid #ddd; padding: 8px;">
            <button onclick="cancelAlert('${alert.product}')" style="background-color: #e74c3c; color: white; padding: 5px 10px; border: none; border-radius: 3px; cursor: pointer;">취소</button>
          </td>
        </tr>
      `;
      alertList.innerHTML += row;
    });
  }

  function cancelAlert(product) {
    // 알림 취소 로직 구현
    console.log(`${product} 알림 취소`);
    // 서버에 취소 요청 보내고 목록 새로고침
    loadAlerts();
  }

  // 페이지 로드 시 알림 목록 불러오기
  window.onload = loadAlerts;
</script>

이렇게 하면 사용자가 자신의 알림을 쉽게 관리할 수 있는 페이지가 완성돼.

💡 프로 팁: 반응형 디자인을 적용해서 모바일에서도 잘 작동하도록 만드는 게 중요해. 요즘은 모바일 쇼핑이 대세니까!

자, 이렇게 해서 우리의 재입고 알림 시스템의 사용자 인터페이스가 거의 완성됐어. 물론 실제로 구현할 때는 더 많은 세부 사항들을 고려해야 하겠지만, 기본적인 구조는 이런 식이야.

UI는 사용자와 직접 맞닿는 부분이라 정말 중요해. 아무리 뛰어난 기능이 있어도 사용하기 어려우면 소용없잖아? 그래서 항상 사용자의 입장에서 생각하고 테스트해보는 게 중요해.

다음 섹션에서는 이 UI와 연결될 백엔드 서버 구현에 대해 알아볼 거야. 백엔드는 우리 시스템의 두뇌 역할을 하는 부분이니까 정말 흥미진진할 거야. 기대해! 🧠💻

그리고 잠깐! 혹시 UI 디자인이나 프론트엔드 개발에 도움이 필요하다면, 재능넷(https://www.jaenung.net)에서 관련 전문가를 찾아볼 수 있어. 다양한 분야의 전문가들이 모여 있으니 꼭 한번 둘러보는 것도 좋을 거야!

3. 백엔드 서버 구현하기 🖥️

안녕, 친구들! 이제 우리의 재입고 알림 시스템의 핵심인 백엔드 서버를 구현해볼 차례야. 백엔드는 사용자에게 보이지 않지만, 모든 데이터 처리와 비즈니스 로직을 담당하는 중요한 부분이지. 😎

🧠 백엔드의 역할: 사용자 요청 처리, 데이터베이스 관리, 재고 상태 모니터링, 알림 발송 등 시스템의 핵심 기능을 담당해.

자, 이제 백엔드 서버를 구현하는 과정을 단계별로 살펴볼게. 우리는 Node.js와 Express.js를 사용해서 서버를 만들 거야. 준비됐니? 시작해볼까?

1. 프로젝트 설정 🛠️

먼저 새 프로젝트를 만들고 필요한 패키지들을 설치해야 해.


mkdir restock-alert-system
cd restock-alert-system
npm init -y
npm install express mongoose nodemailer

여기서 express는 웹 서버 프레임워크, mongoose는 MongoDB 데이터베이스 연결을 위한 ODM(Object Document Mapper), nodemailer는 이메일 발송을 위한 라이브러리야.

2. 서버 기본 구조 만들기 🏗️

이제 서버의 기본 구조를 만들어볼게. app.js 파일을 만들고 다음 코드를 작성해:


const express = require('express');
const mongoose = require('mongoose');
const app = express();
const port = 3000;

// 미들웨어 설정
app.use(express.json());

// 데이터베이스 연결
mongoose.connect('mongodb://localhost/restock-alert', { useNewUrlParser: true, useUnifiedTopology: true });

// 라우트 설정
app.get('/', (req, res) => {
  res.send('재입고 알림 시스템이 작동 중입니다!');
});

// 서버 시작
app.listen(port, () => {
  console.log(`서버가 http://localhost:${port} 에서 실행 중입니다.`);
});

이렇게 하면 기본적인 서버 구조가 완성돼. 이제 여기에 필요한 기능들을 하나씩 추가해 나갈 거야.

3. 데이터 모델 정의하기 📊

우리 시스템에 필요한 데이터 모델을 정의해볼게. models 폴더를 만들고 그 안에 Product.js와 Alert.js 파일을 만들자.

Product.js:


const mongoose = require('mongoose');

const productSchema = new mongoose.Schema({
  name: { type: String, required: true },
  sku: { type: String, required: true, unique: true },
  price: { type: Number, required: true },
  stock: { type: Number, default: 0 },
});

module.exports = mongoose.model('Product', productSchema);

Alert.js:


const mongoose = require('mongoose');

const alertSchema = new mongoose.Schema({
  user: { type: String, required: true }, // 사용자 이메일
  product: { type: mongoose.Schema.Types.ObjectId, ref: 'Product', required: true },
  createdAt: { type: Date, default: Date.now },
  isActive: { type: Boolean, default: true },
});

module.exports = mongoose.model('Alert', alertSchema);

이렇게 하면 상품과 알림에 대한 데이터 모델이 만들어졌어.

4. 라우트 핸들러 구현하기 🛣️

이제 각종 요청을 처리할 라우트 핸들러를 만들어볼게. routes 폴더를 만들고 그 안에 products.js와 alerts.js 파일을 만들자.

products.js:


const express = require('express');
const router = express.Router();
const Product = require('../models/Product');

// 상품 목록 조회
router.get('/', async (req, res) => {
  try {
    const products = await Product.find();
    res.json(products);
  } catch (error) {
    res.status(500).json({ message: error.message });
  }
});

// 상품 재고 업데이트
router.patch('/:id/stock', async (req, res) => {
  try {
    const product = await Product.findByIdAndUpdate(
      req.params.id,
      { stock: req.body.stock },
      { new: true }
    );
    res.json(product);
  } catch (error) {
    res.status(400).json({ message: error.message });
  }
});

module.exports = router;

alerts.js:


const express = require('express');
const router = express.Router();
const Alert = require('../models/Alert');

// 알림 신청
router.post('/', async (req, res) => {
  const alert = new Alert({
    user: req.body.user,
    product: req.body.product
  });

  try {
    const newAlert = await alert.save();
    res.status(201).json(newAlert);
  } catch (error) {
    res.status(400).json({ message: error.message });
  }
});

// 사용자의 알림 목록 조회
router.get('/user/:email', async (req, res) => {
  try {
    const alerts = await Alert.find({ user: req.params.email, isActive: true }).populate('product');
    res.json(alerts);
  } catch (error) {
    res.status(500).json({ message: error.message });
  }
});

// 알림 취소
router.delete('/:id', async (req, res) => {
  try {
    await Alert.findByIdAndUpdate(req.params.id, { isActive: false });
    res.json({ message: '알림이 취소되었습니다.' });
  } catch (error) {
    res.status(500).json({ message: error.message });
  }
});

module.exports = router;

이제 이 라우터들을 app.js에 연결해주자:


// app.js에 추가
const productsRouter = require('./routes/products');
const alertsRouter = require('./routes/alerts');

app.use('/products', productsRouter);
app.use('/alerts', alertsRouter);

5. 재고 체크 및 알림 발송 로직 구현하기 🔔

이제 가장 중요한 부분인 재고 체크와 알림 발송 로직을 구현해볼게. 이 로직은 주기적으로 실행되어야 해. utils 폴더를 만들고 그 안에 stockChecker.js 파일을 만들자.


const Product = require('../models/Product');
const Alert = require('../models/Alert');
const nodemailer = require('nodemailer');

// 이메일 전송을 위한 설정
const transporter = nodemailer.createTransport({
  service: 'gmail',
  auth: {
    user: 'your-email@gmail.com',
    pass  : 'your-password'
  }
});

async function checkStockAndNotify() {
  try {
    // 재고가 있는 모든 상품 조회
    const productsInStock = await Product.find({ stock: { $gt: 0 } });

    for (let product of productsInStock) {
      // 해당 상품에 대한 활성화된 알림 조회
      const alerts = await Alert.find({ product: product._id, isActive: true });

      for (let alert of alerts) {
        // 알림 이메일 발송
        await sendNotificationEmail(alert.user, product);
        
        // 알림 비활성화
        alert.isActive = false;
        await alert.save();
      }
    }
  } catch (error) {
    console.error('재고 체크 중 오류 발생:', error);
  }
}

async function sendNotificationEmail(userEmail, product) {
  const mailOptions = {
    from: 'your-email@gmail.com',
    to: userEmail,
    subject: `${product.name} 재입고 알림`,
    text: `안녕하세요! 요청하신 상품 "${product.name}"이(가) 재입고되었습니다. 지금 바로 확인해보세요!`
  };

  try {
    await transporter.sendMail(mailOptions);
    console.log(`알림 이메일 발송 완료: ${userEmail}`);
  } catch (error) {
    console.error('이메일 발송 중 오류 발생:', error);
  }
}

module.exports = { checkStockAndNotify };

이제 이 함수를 주기적으로 실행하도록 설정해야 해. app.js에 다음 코드를 추가해:


const { checkStockAndNotify } = require('./utils/stockChecker');

// 1시간마다 재고 체크 및 알림 발송
setInterval(checkStockAndNotify, 3600000);

💡 프로 팁: 실제 운영 환경에서는 더 복잡한 작업 스케줄링 도구(예: node-cron)를 사용하는 것이 좋아. 또한, 대규모 시스템에서는 이런 작업을 별도의 워커 프로세스로 분리하는 것이 좋아.

6. 에러 핸들링 및 로깅 추가하기 🛠️

마지막으로, 에러 핸들링과 로깅을 추가해서 시스템의 안정성과 디버깅 용이성을 높여볼게. app.js에 다음 코드를 추가해:


const winston = require('winston');

// 로거 설정
const logger = winston.createLogger({
  level: 'info',
  format: winston.format.json(),
  defaultMeta: { service: 'restock-alert-service' },
  transports: [
    new winston.transports.File({ filename: 'error.log', level: 'error' }),
    new winston.transports.File({ filename: 'combined.log' }),
  ],
});

// 에러 핸들링 미들웨어
app.use((err, req, res, next) => {
  logger.error(`${err.status || 500} - ${err.message} - ${req.originalUrl} - ${req.method} - ${req.ip}`);
  res.status(500).send('Something broke!');
});

// 존재하지 않는 라우트에 대한 처리
app.use((req, res, next) => {
  res.status(404).send("Sorry, that route doesn't exist.");
});

자, 이렇게 해서 우리의 재입고 알림 시스템의 백엔드 서버가 완성됐어! 🎉

이 서버는 상품 정보를 관리하고, 재고 상태를 모니터링하며, 필요할 때 사용자에게 알림을 보내는 역할을 해. 물론 실제 운영 환경에서는 더 많은 기능과 보안 조치가 필요하겠지만, 기본적인 구조는 이런 식이야.

백엔드 개발은 정말 재미있지만 동시에 복잡하고 도전적이기도 해. 만약 더 깊이 있는 지식이나 실제 프로젝트 경험이 필요하다면, 재능넷(https://www.jaenung.net)에서 백엔드 개발 전문가를 찾아볼 수 있어. 그들의 경험과 노하우를 배우는 것도 좋은 방법이야!

다음 섹션에서는 이 모든 것을 종합해서 전체 시스템을 어떻게 통합하고 테스트하는지 알아볼 거야. 기대해! 😊

4. 시스템 통합 및 테스트 🔄

안녕, 친구들! 드디어 우리의 재입고 알림 시스템의 모든 부분을 만들었어. 이제 이 모든 것을 하나로 통합하고 제대로 작동하는지 테스트해볼 차례야. 흥미진진하지 않니? 😃

🧪 통합과 테스트의 중요성: 각 부분이 잘 작동하는 것도 중요하지만, 모든 부분이 함께 잘 작동하는지 확인하는 것이 더 중요해. 이 과정을 통해 우리는 시스템의 안정성과 신뢰성을 보장할 수 있어.

자, 이제 단계별로 시스템을 통합하고 테스트하는 방법을 알아보자!

1. 프론트엔드와 백엔드 연결하기 🔗

먼저 프론트엔드와 백엔드를 연결해야 해. 프론트엔드에서 API 요청을 보낼 때 백엔드 서버의 주소를 사용하도록 설정하자.


// 프론트엔드의 config.js 파일
const API_BASE_URL = 'http://localhost:3000'; // 백엔드 서버 주소

// API 요청 예시
async function requestRestockAlert(productId, userEmail) {
  const response = await fetch(`${API_BASE_URL}/alerts`, {
    method: 'POST',
    headers: {
      'Content-Type': 'application/json',
    },
    body: JSON.stringify({ product: productId, user: userEmail }),
  });
  return response.json();
}

2. CORS 설정하기 🌐

프론트엔드와 백엔드가 다른 도메인에서 호스팅될 경우, CORS(Cross-Origin Resource Sharing) 설정이 필요해. 백엔드 서버에 cors 미들웨어를 추가하자.


// 백엔드의 app.js 파일
const cors = require('cors');
app.use(cors());

3. 환경 변수 설정하기 🔐

데이터베이스 URL, 이메일 서비스 인증 정보 등 민감한 정보는 환경 변수로 관리하는 것이 좋아. .env 파일을 만들고 dotenv 패키지를 사용해 관리하자.


// .env 파일
MONGODB_URI=mongodb://localhost/restock-alert
EMAIL_USER=your-email@gmail.com
EMAIL_PASS=your-password

// app.js 파일
require('dotenv').config();
mongoose.connect(process.env.MONGODB_URI);

4. 통합 테스트 실행하기 🧪

이제 전체 시스템이 제대로 작동하는지 테스트해볼 거야. 여러 시나리오를 만들어 테스트해보자.


// test/integration.test.js
const request = require('supertest');
const app = require('../app');
const mongoose = require('mongoose');

describe('재입고 알림 시스템 통합 테스트', () => {
  beforeAll(async () => {
    await mongoose.connect(process.env.MONGODB_URI);
  });

  afterAll(async () => {
    await mongoose.connection.close();
  });

  it('상품 등록 후 재고 없음 상태에서 알림 신청', async () => {
    // 1. 상품 등록
    const productResponse = await request(app)
      .post('/products')
      .send({ name: '테스트 상품', sku: 'TEST001', price: 10000, stock: 0 });
    expect(productResponse.status).toBe(201);
    const productId = productResponse.body._id;

    // 2. 알림 신청
    const alertResponse = await request(app)
      .post('/alerts')
      .send({ user: 'test@example.com', product: productId });
    expect(alertResponse.status).toBe(201);

    // 3. 재고 업데이트
    const updateResponse = await request(app)
      .patch(`/products/${productId}/stock`)
      .send({ stock: 10 });
    expect(updateResponse.status).toBe(200);

    // 4. 알림 발송 확인 (이 부분은 실제로 이메일을 확인하거나 모의 객체를 사용해야 함)
  });
});

5. 성능 테스트 실행하기 🚀

대량의 요청이 들어올 때 시스템이 어떻게 반응하는지 테스트해보자. Apache JMeter나 Artillery 같은 도구를 사용할 수 있어.


// artillery 사용 예시 (config.yml)
config:
  target: "http://localhost:3000"
  phases:
    - duration: 60
      arrivalRate: 5
      name: Warm up
    - duration: 120
      arrivalRate: 5
      rampTo: 50
      name: Ramp up load
    - duration: 600
      arrivalRate: 50
      name: Sustained load

scenarios:
  - name: "재입고 알림 신청"
    flow:
      - post:
          url: "/alerts"
          json:
            user: "{{ $randomEmail() }}"
            product: "{{ $randomUUID() }}"

6. 모니터링 및 로깅 설정하기 📊

시스템이 실제로 운영될 때 성능과 오류를 모니터링할 수 있도록 설정하자. ELK 스택(Elasticsearch, Logstash, Kibana)이나 Prometheus + Grafana 조합을 사용할 수 있어.


// Prometheus 메트릭 예시 (app.js에 추가)
const prometheus = require('prom-client');
const collectDefaultMetrics = prometheus.collectDefaultMetrics;
collectDefaultMetrics({ timeout: 5000 });

const httpRequestDurationMicroseconds = new prometheus.Histogram({
  name: 'http_request_duration_ms',
  help: 'Duration of HTTP requests in ms',
  labelNames: ['method', 'route', 'code'],
  buckets: [0.1, 5, 15, 50, 100, 200, 300, 400, 500]
});

app.use((req, res, next) => {
  const start = Date.now();
  res.on('finish', () => {
    const duration = Date.now() - start;
    httpRequestDurationMicroseconds
      .labels(req.method, req.route.path, res.statusCode)
      .observe(duration);
  });
  next();
});

app.get('/metrics', (req, res) => {
  res.set('Content-Type', prometheus.register.contentType);
  res.end(prometheus.register.metrics());
});

💡 프로 팁: 실제 운영 환경에서는 CI/CD 파이프라인을 구축하여 자동화된 테스트와 배포 프로세스를 만드는 것이 좋아. Jenkins, GitLab CI, GitHub Actions 등을 활용할 수 있어.

자, 이렇게 해서 우리의 재입고 알림 시스템이 완성됐어! 🎉 각 부분을 통합하고, 다양한 시나리오로 테스트하고, 성능을 확인하고, 모니터링 체계까지 갖췄지.

이제 이 시스템은 안정적으로 작동하면서 사용자들에게 정확한 재입고 알림을 제공할 수 있을 거야. 물론 실제 운영 중에 발견되는 문제들도 있겠지만, 그때그때 개선해 나가면 돼.

시스템 통합과 테스트는 정말 중요한 과정이야. 이 과정을 통해 우리는 시스템의 품질을 보장하고, 사용자들에게 더 나은 경험을 제공할 수 있지. 만약 이 부분에 대해 더 깊이 있는 지식이나 경험이 필요하다면, 재능넷(https://www.jaenung.net)에서 관련 전문가를 찾아볼 수 있어. 그들의 경험과 노하우는 정말 값진 자산이 될 거야!

자, 이제 우리의 재입고 알림 시스템 구현 여정이 끝났어. 정말 긴 여정이었지만, 많은 것을 배웠길 바라. 이 경험을 바탕으로 더 멋진 프로젝트들을 만들어 나가길 응원할게. 화이팅! 👍😊