미니프로젝트 1

주제: 전기차 충전소 리뷰 사이트

설명: 환경에 대해 조금 더 친숙하게 생각하고, 흔히 찾기도 어려운 전기차 충전소의 장소를 간단한 동, 구의 입력만으로도 어디에 있는지 검색하고, 그곳의 리뷰들은 어떠한지 직접적으로 알아갈 수 있게 디자인 해 보았습니다. 본 충전소는 크롤링의 방식을 이용하여 정보제공과 느낀점을 토대로 공유해 볼 수 있게끔 만들었습니다.

영상: https://youtu.be/dmZZtIEX5YM

github: https://github.com/salmon2/EcoEnerge

이번주 느낀 점

미니프로젝트를 금요일에 제출을 하고 끝이 났는데, 뭔가 속이 후련하면서도 아쉽긴 했다. 조원분들도 너무 좋았고, 시간이 더 있었다면 사이트의 디자인 부분을 더 잘 꾸미고 싶었는데 아쉬웠다.

그래도 일주일 동안 아침에 일찍 일어나고, 저녁에 늦게까지 하면서 조원들과 협업을 해본 결과 그 상황에서는 너무 힘들고 허리도 너무 아프지만, 끝나고 잠들 때 매우 뿌듯했다.

코드에 에러가 생겼을 때, 3-4시간 붙들면서 구글링하고 이해하려고 하고 결국 해결이 되고 코드가 돌아갈 때의 행복한 감정을 계속 기억하면서 앞으로 남은 13주의 항해를 잘 이어나가고 싶다!

배운 것

로그인

Reference: https://tansfil.tistory.com/58?category=255594

1. JWT

• JWT는 JSON WEB TOKEN의 줄임말이다.
• Stateless (별도의 저장소를 사용하지 않는 것)

• 우선 토큰을 만들기 위해서는 Header, Payload, Verify Signature가 필요하다.
• Header와 Payload는 따로 암호화되지 않지만, Verify Signature는 SECRET KEY를 알지 못하면 복호화 할 수 없다.
• Header와 Payload는 디코딩이 누구나 가능하다. 디코딩을 하면 Header와 Payload안에 있는 데이터를 누구나 볼 수 있기 때문에 중요한 데이터를 넣으면 안된다. 반면에, Verify Signature는 SECRET KEY가 있기 때문에, 이것을 알지 않는 한 토큰을 조작할 수 없다.

• JWT가 어떻게 인증에 사용되는지 위 사진을 보면 알 수 있다.

• Session/Cookie 방식에 비해 JWT는 별도의 저장소가 필요 없기 때문에 간편하다. 왜냐하면, JWT는 발급한 후 검증만 하면 되기 때문이다.

• Stateless 이기 때문에 서버를 확장, 유지, 보수하는데 유리하다.

2. API

• 이번 프로젝트에서 개발할 기능들을 적어 놓은 것이다.
• 미리 변수들의 이름과 어디로 request할지, response는 무엇을 받을지를 다 정해 놓고 해야 통일이 되고 코딩하기 전 정리가 잘 되는 것 같다.
• API는 Application Programming Interface의 줄임말이다.
• APIs connect different parts of a software platform to ensure that information ends up in the right place.
• API는 서버가 요청을 받기 위해 만들어진 도구이다. 서버와 클라이언트가 소통하게 하기 위한 도구이다.
• 요청에는 POST와 GET 요청 등의 여러가지 타입이 있다.

보완해야 할 점

이렇게 배운 개념들을 막상 적어보려고 하니, 생각보다 쉽지 않은 것 같다. 앞으로 이해를 잘 하고 구글링도 더 해봐야 겠다. 모르는 것은 그냥 넘기지 말아야지!

앞으로 공부할 것

Node.js를 주특기로 선택을 했는데, 추석 연휴 기간동안 Javascript 문법 강의를 미리 들어야 겠다. 그 전에 웹개발 플러스에서 놓쳤던 부분을 다시 보고 개념들을 잘 정리해야겠다.