[220201-220207] Solution Challenge 3주차 / GDSC KR 해커톤

✨ 이번 주 한 일

GDSC KR 해커톤(220204-220205)을 위한 준비를 하였으며, 프론트엔드 / 백엔드 팀별로 필요한 지식을 학습하였다.

 

• 프론트엔드(리액트): CKeditor5, Firebase 배포
• 백엔드(스프링부트): 지도 정보 웹 크롤링, GCP 배포
• 공통: JWT 보안 로그인

✨ 지도 정보 웹 크롤링

백엔드에서 여성새로일하기센터 등 재취업/교육 기관 정보를 크롤링하여 전달했고, 프론트엔드에서는 Google Map API를 활용하여 크롤링한 정보를 표시하였다.

✨ JWT 보안 로그인

우리 팀은 해커톤에서 JWT를 이용한 보안 로그인을 계획하였다. JWT(Json Web Token)란,
JSON 포맷을 이용해 정보를 가볍고 안전하게 전송하기 위한 Claim 기반의 Web Token이다.

동작 과정은 다음과 같다.

1. 로그인을 하면 클라이언트에서는 POST로 스프링 서버에 요청을 보낸다.
2. 서버는 아이디, 비밀번호가 맞는지 확인한 후 Secret Key로 토큰을 생성하여 전달한다.
3. 클라이언트는 토큰을 Local Storage에 저장한다.
4. 클라이언트는 서버에 요청을 할 때 항상 헤더에 토큰을 포함시킨다.
5. 서버는 요청을 받을 때마다 Secret Key를 사용하여 토큰이 유효한지 검증하고 응답한다.
6. 로그아웃을 하면 Local Storage에 저장되었던 토큰을 삭제한다.

참고한 자료는 다음과 같다. https://github.com/dsunni/spring-boot-react-jwt

해커톤 준비 과정에서 JWT 로그인 테스트를 진행하여 성공하였다. 하지만 해커톤 기간 내내 로그인이 한번에 되지 않는 등 크고 작은 문제가 발생하여 다소 어려움을 겪었다.

✨ Firebase / GCP 배포

프론트엔드(React)는 firebase를 통해 배포하였다. 배포하는 과정은 크게 어렵지 않았다. (참고한 자료)

또한 백엔드(Spring Boot)는 GCP를 통해 배포하였다.

하지만 배포한 사이트에서는 https와 http 간의 로드밸런싱(SSL) 문제로 인하여 기능이 제대로 작동하지 못했고, 해커톤 기간 안에 이를 해결하지 못하여 아쉽게도 로컬 서버로 시연했다.

✨ 해커톤 심사위원 평가 및 회고

해커톤 github 저장소: https://github.com/gdsckoreahackathon2022/08_freesia

 

• 심사위원 평가
  
  
  • 굳이 로그인 기능이 없어도 괜찮은 것 같다.
  • 정부가 만든 서비스만 있는데, 사용자들이 만드는 서비스가 나온다면 좋을 것 같다.
  • 디자인 측면에서 "여성을 위한 서비스"라는 인상이 부족하였다.
  • 커뮤니티를 사용할 때 웹보다는 앱을 많이 사용한다. -> 추후 앱으로 개발할 예정
  • 구글 기술을 사용한다면 Flutter를 사용하는 것이 어떨지?
• 팀 회고
  
  
  • JWT 로그인이 어려웠다. 구글 소셜 로그인으로도 보안을 유지하는 방법이 있으면 찾아볼 것이다.
  • 슬랙처럼 이모지를 입력하는 기능을 솔루션 챌린지 때 구현하고 싶다.
  • 리액트를 firebase로 배포했는데 왜 로컬에서는 안 나던 오류가 났는지 의문이다.
  • Cors 문제, HTTPS와 HTTP 사이의 로그밸런싱 (SSL) 문제를 해결하는 방법을 고민해야 할 것 같다.
  • ckeditor에서 이미지를 처리하는 것이 쉽지 않았다.

---

✨ 4주차 할 일

본격적인 솔루션 챌린지 개발에 앞서, 각 팀별로 필요한 지식을 학습할 예정이다.
또한 Spring Boot와 React native를 활용한 사례가 다소 부족하여 최대한 다양한 자료를 찾아볼 계획이다.