[Dev-Log] 6월 1일 화요일 / 류제천

### 오늘은 어떻게 프로젝트에 기여했나요?
* 네이버지도 API를 적용해서 내 위치와 무술별 체육관들의 위치를 지도에 표시하여 출력하는 기능 구현
*
### 오늘의 프로젝트에서 힘든 점은 무엇인가요?
* 네이버지도 API를 리액트로 적용하는 것을 처음해봐서 적용하는 것이 쉽지 않았다. 특히 네이버지도 API중 geocoding이라는 문자열 주소를 위도, 경도로 변환해주는 API를 적용하기 위해서는 서버에서 네이버 open API Url로 axios.get 요청을 보내지 않으면 CORS 에러가 나온다는 것을 깨닫고 적용하는 부분에서 시간 소요가 많이 되었다.
```js
// 아래 코드는 금일 추가로 작성한 서버의 controller 이며 서버에서 네이버지도 API로 요청을 보내고 있다.
export const coordinate = async (req: Request, res: Response) => {
try {
const { query } = req.body;
const geocodingUrl =
"https://naveropenapi.apigw.ntruss.com/map-geocode/v2/geocode";
const coord = await axios
.get(`${geocodingUrl}`, {
params: {
query,
},
headers: {
"X-NCP-APIGW-API-KEY-ID": `${process.env.REACT_APP_NCP_CLIENT_ID}`,
"X-NCP-APIGW-API-KEY": `${process.env.REACT_APP_NCP_CLIENT_SECRET}`,
},
})
.then((res) => {
// TODO: check if response is ok
console.log(`res: `, res);
return res.data;
})
.then((data) => {
if (data.addresses.length > 1) {
console.log(`${query}에는 여러 주소가 있어요.`);
} else if (data.addresses.length === 0) {
console.log(`${query}에 해당되는 좌표가 없어요.`);
return { lat: 37.4965695, lgt: 127.0247765 };
}
return { lat: data.addresses[0].y, lgt: data.addresses[0].x };
});

res.status(200).json({ data: coord, message: "ok" });
} catch (e) {
res.status(404).json({ message: "Not Found" });
}
};
```

### 내일은 프로젝트에 기여하기 위해 무엇을 해야 하나요?
- [ ] 모바일에서 볼 수 있는 반응형 웹앱을 구현할 예정