mocky를 사용하여 API처럼 활용해보기

단밤v 2023. 2. 2. 20:04
728x90
반응형

안녕하세요. 터미네입니다.

 

이번 포스팅은 mocky 서비스에 대해 소개합니다.

 

mocky는 데이터 응답값을

미리 정해서 사용할 수 있는 서버 서비스입니다.

 

보통 Front-End 개발자 분들이

실제 데이터가 DB에 저장되어

API서버가 구축되기전에

화면 개발한 것을 확인하기 위해

애용하는 서비스입니다.

 

이것저것 볼 것들이 있겠지만,

요즘 주로 사용하는 json 타입의 데이터를

미리 만들어

 

크롬 브라우저에서 url request를 해보도록 하겠습니다.

 

 

mocky 서비스는 아래 url로 들어가면 됩니다.

https://designer.mocky.io/

위 링크로 들어가서 우측 상단에 "NEW MOCK"이라는 버튼이 있습니다.

클릭해주세요.

Mocky 홈페이지에서 우측 상단 버튼

그러면 mock을 만들 수 있는 화면이 뜹니다.

아래 화면 내에서 모든 것을 정의하고 저장하면,

쌤플 API를 만들 수 있어요.

(API 서버를 개발하는 것은 아니니깐 헷갈리지 마시길!!)

 

mock api를 만드는 화면

HTTP Response Body에는

제가 미리 만든 json을 넣었습니다.

* 응답할 json 데이터 *

{
    "data" : [
        {"name": "홍길동", "age" : 36, "hobby" : "바둑"},
        {"name": "이누야", "age" : 30, "hobby" : "앉기"},
        {"name": "김가영", "age" : 28, "hobby" : "개훈련"},
        {"name": "임꺽정", "age" : 50, "hobby" : "검도"}
    ]
}

"GENERATE MY HTTP RESPONSE" 버튼을 누르면

mock api가 만들어 집니다.

 

그러면 아래 화면과 같이 뜨게 될거에요.

mock api 만들어진 화면

Mock URL을 복사해서

크롬 브라우저에 url에 붙여넣고 엔터를 누르면

제가 미리 만든 json 데이터가 뜨겠죠?

 

크롬 브라우저에서 mock api 결과

mocky 서비스 사용하는 거 대단히 쉽죠?

 

여기까지 mock api를 사용하는 방법에 대해

소개해 드렸습니다.

 

긴글 읽어주셔서 대단히 감사합니다.

 

728x90
반응형

'IT나라 이모저모' 카테고리의 다른 글

공유기 포트포워딩 설정방법  (0) 2023.07.28
윈도우 비트확인 하는법  (0) 2023.07.02
Homebrew 설치 (feat.macos)  (0) 2023.01.02
정형데이터 마이닝  (2) 2022.12.22
ITSM 개념과 단계별 업무 절차  (0) 2022.12.22