[TIL] 20240610 - bookstore(7)

MSW(Mock Service Worker)

---

MSW는 Service Worker가 네트워크 호출을 가로채는 API 모킹 라이브러리
URL : https://mswjs.io/

🧊 Install

npm install msw@latest --save-dev

🧊 worker 인스턴스 생성

import { setupWorker } from "msw/browser";
import { addReview, reviewsById } from "./review";

const handlers = [reviewsById, addReview];

export const worker = setupWorker(...handlers); 

🧊 worker 실행

import React from 'react';
import ReactDOM from 'react-dom/client';
import App from '@/App';

if (process.env.NODE_ENV === "development") {
  const { worker } = require("./mock/browser");
  worker.start();
}

const root = ReactDOM.createRoot(
  document.getElementById('root') as HTMLElement
);

root.render(
  <React.StrictMode>
    <App />
  </React.StrictMode>
);

Faker

---

faker는 가짜 데이터를 생성해주는 라이브러리
URL : https://fakerjs.dev/

🧊 Install

npm install @faker-js/faker --save-dev

🧊 Import

import { faker } from "@faker-js/faker";

한국어로 가짜 데이터 생성

import { fakerKO as faker } from "@faker-js/faker";

🧊 Use

function createData(): User {
  return {
    email: faker.internet.email(),
    userName: faker.person.firstName(),
    birthday: faker.date.birthdate(),
    score: faker.helpers.rangeToNumber({min: 1, max: 5})
  };
};