[DevLog] 이현걸 / 2022-03-30

### 오늘은 어떻게 프로젝트에 기여했나요?

- 카카오 로그인 기능 구현
-

### 오늘의 프로젝트에서 힘든 점은 무엇인가요?

- Oauth 개념을 다시 공부해야했고, 클라이언트에 직접 페이지를 만들어서 axios 요청을 보내는 과정이 낯설어서 힘들었음
- 카카오 api 공식문서를 참고하여 정해진 양식에 맞게 요청을 보내는 과정이 힘들었음

```js
//클라이언트
const nowUrl = window.location.href;
let params = new URL(document.location).searchParams;
let code = params.get("code")
//백엔드로 code를 전송해주기
const kakao = async() => {
try{
await axios.post(
`https://localhost:4000/users/signin/kakao`,{
authorization : code
},
{
"Content-Type" : "application/json",
}
)
.then(() => {
history.push('/')
})
}catch(error){
console.log(error)
}
}
//서버
const oauthData = {
grant_type: "authorization_code",
client_id: process.env.KAKAO_REST_API_KEY,
redirect_uri: process.env.KAKAO_REDIRECT_URI,
code: req.query.code,
};
const url = `https://kauth.kakao.com/oauth/token?code=${oauthData.code}&client_id=${oauthData.client_id}&redirect_uri=${oauthData.redirect_uri}&grant_type=${oauthData.grant_type}`;

const response = await axios.post(
url,
{},
{
"Content-Type": "application/x-www-form-urlencoded;charset=utf-8",
}
);

const { access_token } = response.data;
const getKakaoUserInfo = await axios.get(
`https://kapi.kakao.com/v2/user/me`,
{
headers: {
Authorization: `Bearer ${access_token}`,
"Content-type": "application/x-www-form-urlencoded",
},
}
);
```

### 내일은 프로젝트에 기여하기 위해 무엇을 해야 하나요?

- [ ] 카카오 지도 API 공부하고 기능 구현