Mockoon에 대해

Mockoon이란

프런트를 개발하다보면, Mocking을 모르면 서버에서 아직 개발이 되지않은 api를 마냥 기다려야하나? 그 전까지 목 데이터를 하드 코딩으로 관리를 해야하나? 기본 고민을 해왔을 것이다. 

 

이러한 고민을 해결해 주는 몇몇 가지가 있다. 

앞서 MSW에 이어 이번엔 Mockoon에 대해 알아보고자 한다. 

 

Mockoon을 간단하게 사용해보면,, 너무 편하고 좋다. 라는 생각을 많이 가지게 된다. 일단 MSW와 다르게 내부 라이브러리를 사용하지않고, 별다른 코드 작업을 하지않아도 된다. 또한, GUI가 제공되면, CLI를 통해도 사용이 가능하다. 

Mockoon은 OS에 application으로써 설치하여 사용할 수 있다. 각 OS별로 install package를 제공한다.
( install : https://mockoon.com/download/ )

 

이렇게 설치 형태로 사용되기 때문에 별다른 라이브러리 설치 및 코드 작업이 필요없게 되는 것이다. 

위의 링크를 통해 설치를 하면 바로 사용할 수 있다. 원리는 단순하다. 로컬에 mockoon 서버를 띄어서 대신 응답을 받도록 하는 것이다. 

 

사용법

사용법에 대해 하나씩 살펴보자.

설치를 하면 기본적으로 위와 같이 템플릿을 제공해준다.

마치 포스트맨과 같다. 

 

1. Routes탭

mock api를 생성하는 탭이다. GET, POST, PU, DELTE를 모두 제공하며, 상태, response delay time, response, header 등 다양하게 설정을 할 수 있다. 

이렇게 GUI를 통해 손쉽게 mock api를 생성할 수 있는 것이 가장 큰 장점이라고 생각된다.

MSW같은 경우 코드로 작성하고, api가 많아지게 되면, 그만큼 작업량도 많이지게 된다. 

 

2. Data탭

mock data 생성하는 탭. 하드 코딩도 필요없고, 노가다도 필요없다. 아래의 코드는 Users라는 mock 데이터이다. 아래와 같은 형태로 생성만해두면, 50개의 데이터가 생성 된다. 

 

테스트로 브라우저에 요청을 해봤을 때 아래와 같다. pretty print을 활성화하면 깔끔하게 정리되어 보여진다. 

 

3. Headers 탭

headers탭은 헤더를 설정하는 곳이다. Mockoon은 cors 설정까지 편안하게 제공해준다.  

 

add CORS를 추가해주면 아래와 같이 추가되며, 필요에 따라 수정하면 될것이다.

 

4. Callback 탭

eb콜백 탭은 route탭에서 생성해 놓은 api들을 호출 후 콜백으로써 또 추가 요청을 보내도록 하는 탭이다. 

다른 api를 호출하거나 micro-service, webhook 등에 유용하다.

 

5. Logs탭

요청에 대한 로그들이 남는 탭이다.

 

6. Proxy 탭

Target URL 즉, 지금 사용하고 있는 서비스의 실제 API기입하고 프록시 모드를 활성화를 하게되면, routes탭에 정의되지 않은 api들은 Target URL로 포워딩해준다. 즉 우리는 mockoon에 요청을 하지만, mockoon에 routes에 등록이 되지 않은 URL들은 실제 서버로 요청해주며, 말그대로 프록시 역할을 해준다. 

이는 실제 API와 Mock API를 함께 사용할 수 있어 더욱 편리하게 사용할 수 있다. 

 

7. Setting탭

setting 탭은 mockoon port, endpoint 등 변경하며 tls등 설정 또한 가능하다.

추가로 import/export 카테고리를 통해 swagger에서 뽑아낸 json파일을 통해 routes를 빠르게 생성할 수 있따.