main-project Final(최종) (22.10.05 ~ 12. 발표준비 및 데모데이)

✅ 오늘 한 일

배포링크 : https://d1chxyssw587bm.cloudfront.net/

발표 자료준비

• 스택 이미지 및 각종 기획 링크 깃헙 업로드

레저용품 판매점

• API가 늦게와서 목데이터를 생성해서 화면에 출력할 수 있게함.
• 발표 전 주말에 API가 와서 목데이터 -> API로 수정

좋아요(관심목록) 기능 API 연결

Route53 비용 발생

• 가비아에서 구매한 도메인을 사용하기 위해서 사용했다.
• 하지만, Route53은 프리티어가 적용되지 않는 범위였다. 
• 몇만회 이상 get요청이 오지 않는다면 1달러씩만 내면된다고 한다.
• 차후 방안으로는 CloudFlare를 사용하는 방법이 있을 것이다.

채팅 기능 구현 (Stomp 사용)

• 채팅 기능을 백엔드 측에서 API를 생성하여 크롬 플러그인을 사용해 소켓 테스트까지 맞췄다. 하지만, 채팅기능을 맡았던 팀원이 열심히 했지만 실시간을 데이터가 잘 받아와지지 않은 상황이 있었기에 발표시점이 얼마 남지않아 최대한 구현할 수 있도록 같이 진행했다.
• 여러방면으로 검색을 통해 다양한 코드들로 구성했다가 지웠다가를 반복하며 실시간으로 사용자간 채팅을 주고 받을 수 있도록 구현했다.
• 채팅목록도 로그인한 사용자가 볼 수 있도록했다.
• 위의 기능기 구현 된 후 디자인을 변경했다.

배포사이트 새로고침 시 하얀배경

• num run build 후 라이브 서버로 테스트하기위해 작업한 index.html 파일에 있는 경로들을 상대경로로 만들었던 것이 문제였다. 절대경로로 바꾸니 해결됨

📝 데모데이 질문 및 답변 목록 / 피드백

프론트엔드

• 질문: form data 형식을 사용했을 때 어려움은 없었나요 ?
  • 딱히 어려움은 없었으며 오히려 백엔드와 타입을 맞출 수 있어서 좋았다.
  • 파일크기 및 문자 길이 제한 있었지만 해결했습니다.
• 질문: 웹 소캣은 어떤 것을 사용하셨나요?
  • STOMP 라이브러리를 사용해서 실시간 채팅 기능을 구현했습니다.
• 질문: 반응형은 어떻게 구현하셨나요?
  • 스타일드 컴포넌트와 반응형 웹 라이브러리를 사용해서 구현했습니다.
• 피드백: FE분들 리액트 프레임워크, 최신 라이브러리, 최신 기술을 익히는 것도 중요하지만 SPA 방식에 부합하는 것과 렌더링에 대한 깊이를 조금 더 깊이 공부해보면 좋을 것 같다.

백엔드

• 질문: 소켓 트래픽 테스트를 해보았나요?
  • 트래픽 테스트는 못했습니다.
    • 피드백: 유저가 많아질 경우를 대비해서 트래픽 테스트틀 해보는 것도 좋다.
• 질문: 소켓으로 통신한다고 하셨는데 채팅 메시지를 보낼때 마다 DB에 쌓이는지?
  채팅이 완료된 후에 DB에 쌓이는지?
  • 실시간으로 채팅을 보낼 때 마다 DB에 쌓이게 됩니다.
• 질문: 채팅은 실시간으로 진행되나요?
  • 네! 실시간으로 채팅이 가능합니다. 하지만 현재 이전 대화 목록을 가져오는 API가 없어서 실시간으로만 채팅이 가능합니다.

공통 피드백

1. 자신만의 코드를 장문으로 작성할 수 있어야한다.
2. 프로젝트를 진행할 때 일정 조율을 잘 해야한다.
3. 실패, 성공의 여부를 잘 파악해야한다.

🥲 어려웠던 일

• 실시간 채팅 기능 구현

📌 해야할 일

• 리팩토링
• 자잘한 버그 수정