[Mock Server] postman 대신 JSON Server 사용해보기

2023. 2. 3. 18:32·🍞 FrontEnd

요청을 많이 한 것 같진 않은데 벌써 1000회를 넘어 아래 오류 코드를 보면 유료 계정으로 전환해야 되는 상황이다. 유료 계정으로 전환하는 건 무리라는 생각이 들어 postman 대신, 다른 가짜 서버 만드는 방식을 찾아봤다.

Your team plan allows 1000 mock server calls per month. Contact your team Admin to up your limit.

그 결과, JSON Server라는 것을 알게 됐고, 가짜 서버를 만들어보자! 

 

📌 JSON Server

 json 파일을 사용해서 가짜 REST API 서버를 생성할 수 있는 도구이다. 이것은 실제 서버가 아닌 개발용 서버로 사용하는 것이 좋으며, 만약 실제 프로젝트를 개발하기 위해서는 실제 백엔드 서버를 구축해야 한다. 

 

1️⃣ 설치

npm 또는 yarn을 사용해서 전역으로 설치해준다. 

npm i -g json-server
 
yarn global add json-server


2️⃣ Dummy Data 만들기 

가짜 서버를 만들기 위해서는 json 형식의 데이터가 필요하다. 
먼저 category.json 이란 파일을 만들어보자! 

data/category.json

{
	"categories" : [
		{
			"category_id" : 1,
			"category_name" : "공지사항",
			"category_boards" : 123456
		},
		{
			"category_id" : 2,
			"category_name" : "질문 게시판",
			"category_boards" : 123
		},
        {
			"category_id" : 3,
			"category_name" : "자유 게시판",
			"category_boards" : 123
		},
        {
			"category_id" : 4,
			"category_name" : "버그가 있어요!",
			"category_boards" : 123
		},
        {
			"category_id" : 5,
			"category_name" : "체인지 로그",
			"category_boards" : 123
		}
	]
}

 

3️⃣  json-server 로 가짜 서버 실행하기

dummy.json을 작성했으면 이젠 json-server로 실행해 보자! 

(포트 번호는 맘대로 해도 상관은 없다. 되도록 사용하지 않는 포트 번호로 사용하기)

 json-server --watch data/dummy.json --port 8001

--watch 옵션은 생략 가능하다. 
--port 다음에는 port 번호를 적어준다.

 

4️⃣결과 확인하기 

 json-server를 실행하면 아래와 같은 결과가 뜬다. 

 

5️⃣ 가짜 API 서버 (port: 8001) 열기

http://localhost:8001/categories 

들어가서 확인해보기

저작자표시 (새창열림)

'🍞 FrontEnd' 카테고리의 다른 글

Webpack을 쓰는 이유에 대해서  (1) 2025.05.30
[OAuth] OAuth 소셜로그인 로직 정리  (0) 2024.08.06
'🍞 FrontEnd' 카테고리의 다른 글
  • Webpack을 쓰는 이유에 대해서
  • [OAuth] OAuth 소셜로그인 로직 정리
박빵이
박빵이
2025년에도 갓생살기
  • 박빵이
    기억보다 기록
    박빵이
  • 전체
    오늘
    어제
    • 분류 전체보기 (337)
      • 🍞 FrontEnd (97)
        • HTML+CSS (4)
        • JavaScript (17)
        • TypeScript (4)
        • React (52)
        • Next.js (2)
        • Android (15)
      • 🍞 BackEnd (24)
        • Java (15)
        • Node.js (6)
        • Spring (1)
      • 🍞 Cloud & Infra (0)
        • AWS SAA (0)
        • Microsoft Azure (0)
      • 🍞 Algorithm (147)
        • C++ (4)
        • Baekjoon (41)
        • Programmers (97)
      • 🍞 Computer Science (18)
        • 운영체제 (1)
        • 데이터 통신 (6)
        • 네트워크 (6)
        • 데이터베이스 (1)
      • 🍞 대외활동 & 부트캠프 (42)
        • 삼성 청년 SW 아카데미 (1)
        • LG유플러스 유레카 (0)
        • 한국대학생IT경영학회 (1)
        • IT연합동아리 UMC (17)
        • 길벗 블로깅 멘토 (18)
        • IT연합동아리 피로그래밍 (3)
        • 개발 컨퍼런스 (2)
  • 블로그 메뉴

    • Admin
  • 링크

    • GitHub
  • 인기 글

  • 태그

    map
    level1
    level2
    코딩자율학습
    위상정렬
    C++
    react
    유니온파인드
    코틀린
    프로그래머스
    알고리즘
    JavaScript
    안드로이드
    Front
    길벗 블로깅 멘토링
    Java
    umc
    Android
    백준
    길벗 블로깅 멘토
  • 최근 댓글

  • 최근 글

  • hELLO· Designed By정상우.v4.10.3
박빵이
[Mock Server] postman 대신 JSON Server 사용해보기
상단으로

티스토리툴바