원티드 프리온보딩 백엔드 코스 - 1주차

원티드 프리온보딩 백엔드 코스 1주차

주제 : open api를 활용한 공공 데이터 분석 💡

1) server to server 통신은 axios 📌

import axios from "axios";


try {
  const response = await axios({
    url:
      `http://openAPI.seoul.go.kr:8088/${req.key}/${req.type}/${req.service}/${req.start}/${req.end}/` +
      encodeURI(req.region),
    method: 'GET',
  });

  const result = response.data;
  return result;
} catch (e) {
  throw e;
}

• 공공 데이터 정보를 받아오기 위해 axios 를 사용해서 네트워크 요청을 처리하고 서버 간 통신을 했다.
  기본적으로 url, method가 필요하고 try ~ catch 문을 통해 통신에 문제가 생겼을 때의 error 처리가 필요하다.
• axios와 fetch의 가장 두드러지는 차이점은 axios는 기본적으로 json 형태로 데이터를 반환하고 fetch의 경우는 그렇지 않다는 것이다. fecth api를 사용하면 JSON.stringfy() 등을 활용하여 객체를 문자열로 감싸는 처리를 해주어야 한다. 대신 속도는 fetch가 약간 더 빠른 것으로 알고 있으나 그 차이가 미미하기에 데이터 처리가 좀 더 편한 axios api를 사용하였다.

2) 시간 계산은 moment.js 📌

import moment from 'moment';


const now_time = api 호출 당시의 시간
const received_time = 받은 data에 저장되어 있는 시간
const diff_time (시간 차이)
= moment.duration(now_time.diff(received_time)).asMinutes()

if (diff_time < 60 ) {
	...
}

• moment.js를 사용하면 현재 시간 값을 불러올 수 있고, 날짜 비교를 쉽게 할 수 있다. moment().format() 을 사용하면 날짜의 형식도 지정할 수 있다.
• 시간 차이를 계산할 때는 duration + diff 조합을 사용하고 asDays, asHours, asMinutes 등으로 일/시간/분 단위의 차이를 계산할 수 있다.

feedback
👉 기존에 작성했던 코드를 간단히 리팩토링했다. const 변수1, 변수2, 변수3 등 변수가 어떤 data를 담고 있는지 더 명확하게 표현하는 쪽이 좋겠다는 피드백을 반영했다.

3) 인터페이스 (interface) vs 타입 (type) 📌

    interface IReq {
      key: string;
      service: string;
      type: string;
      start: number;
      end: number;
      region: string;
    }


    const req: IReq = {
      key: process.env.RAINFALL_API_ACCESS_KEY,
      service: 'ListRainfallService',
      type: 'json',
      start: 1,
      end: 282,
      region: regionName,
    };

공통된 부분은 interface로 만들어 코드 중복을 최소화한다.
또 interface를 사용한 이유는 확장성이 좋기 때문이다.

type vs interface

참고 자료
👉 typescript interface vs type

더 자세한 코드 참조
👉 public data analysis