[개발 툴] quicktype.io

송현준·2024년 2월 11일

😄 개요

LG인도 인턴을 진행하며 만난 멘토분이 여러 웹 사이트들을 많이 추천 해주셨습니다.
그 중 하나가 quicktype.io 인데, 프로젝트를 진행하며 모델 클래스 코드를 통일 시키는데 많은 도움을 받았습니다. 많은 기능들을 사용해보지는 않았지만, 이런 사이트도 있다는 걸 공유해보고자 해요.

🚩 웹사이트 소개

quicktype.io 는 모델 클래스를 만들어주는 사이트입니다.
JSON형식으로 된 인스턴스 예시만 하나 던져주면 알아서 해당 인스턴스를 만들 클래스 코드를 작성해줍니다.
한마디로 인스턴스 → 클래스 변환 툴이라고 말할 수 있습니다.

🎈 튜토리얼

시작

사이트 들어가자마자 우측 상단에

버튼을 누르면 시작할 수 있습니다.

다음과 같은 페이지에 접속됩니다.

언어 설정

우측의 탭을 보면 클래스를 생성할 때의 여러 설정들을 확인할 수 있습니다. 그중 가장 먼저 어떤 언어로 생성할지 설정해 줍니다. 저는 Flutter 프로젝트에 사용했어서 dart로 설정해줄게요.

클래스 인스턴스 작성

클래스 코드를 만들기 위해 JSON 형식으로 된 클래스의 인스턴스를 입력받습니다. JSON으로 입력받으므로 서버측에서 주는 response를 이용하면 좋겠죠?
저는 다음과 같이 햄버거와 관련된 인스턴스를 예시로 작성해봤습니다.

{
  "hamburger" : "cheese burger",
  "combo" : true,
  "price" : 6500,
  "discount" : 0.1
}

클래스 코드 생성

이제 작성한 인스턴스를 좌측에 붙여넣기만 하면 우측에 클래스 코드가 바뀌는것을 확인할 수 있습니다.
클래스 명은 좌측 상단에 Name을 수정하면 지정해줄 수 있습니다. 저는 Order로 해봤습니다.

🍔 기능

생성자 및 파싱관련 함수

코드를 확인해보면 파싱과 관련된 함수들이 자동으로 생성돼있는 것을 확인할 수 있습니다.

제가 생성한 코드에는
JSON 문자열을 입력받아 Order 객체를 리턴해주는 orderFromJson 함수와 fromJson 함수,
Order 객체를 입력받아 JSON 문자열을 리턴해주는 orderToJson 함수와 toJson 함수가 있습니다.

타입 추론

입력으로 넣었던 데이터의 타입이 자동으로 추론돼있는 것을 확인할 수 있습니다.

문자열, 정수, 실수, 불리언 모두 넣어 테스트 해본 결과, 맞게 추론돼있습니다.

리스트 처리

그렇다면 입력을 리스트로 주면 어떻게 될까요?

Order 인스턴스를 여러개 만들어 리스트로 전달해보겠습니다.

[
  {
    "hamburger" : "cheese burger",
    "combo" : true,
    "price" : 6500,
    "discount" : 0.2
  },
  {
    "hamburger" : "chicken sandwich",
    "combo" : false,
    "price" : 7800,
    "discount" : 0.1
  },
  {
    "hamburger" : "burger",
    "combo" : true,
    "price" : 5500,
    "discount" : 0
  }
]

결과는 리스트가 필드로 들어가지 않고, 파싱 관련 메서드만 리스트로 리턴하게 바뀝니다.

객체 처리

입력을 복잡한 객체의 형태로 주었을때는 그에 맞게 여러 클래스의 코드를 작성해주는 것을 볼 수 있습니다.

입력으로 주문리스트의 객체를 전달해 보겠습니다.

{
  "count": 3,
  "orders": [
    {
      "hamburger" : "cheese burger",
      "combo" : true,
      "price" : 6500,
      "discount" : 0.2
    },
    {
      "hamburger" : "chicken sandwich",
      "combo" : false,
      "price" : 7800,
      "discount" : 0.1
    },
    {
      "hamburger" : "burger",
      "combo" : true,
      "price" : 5500,
      "discount" : 0
    }
  ]
}

orders로 주어진 객체의 리스트를 독단적인 class로 잘 생성했고, 심지어 필드명이 복수형(orders) 임에도 불구하고 자동으로 단수형(order)으로 클래스 명을 설정한 것을 볼 수 있습니다.

우측 패널

그 외에도 우측 패널을 보면 여러 옵션들이 있는 것을 확인할 수 있습니다. 언어별로 세세하게 옵션이 다른것을 확인할 수 있습니다.
다트 같은 경우에서도 Flutter의 copyWith 생성자를 만들어주는 옵션도 있고, 프로퍼티들을 옵셔널로 지정하거나 final로 지정하는 등의 옵션도 있습니다.