[TIL] 6주차 미니 프로젝트ㅣ프론트 서버 배포, 발표

 

미니 프로젝트 [감자마켓] 진행 상황

 

프론트 서버 배포

프론트 조원분들은 막바지 작업에 한창이셨고,
백 쪽은 어느 정도 작업이 마무리돼서 발표 자료를 준비하고 있었다.

당일 오후 7시까지 과제 제출인데,
5시까지도 작업이 끝나지 않은 상황이었다.

이대로 손 놓고 구경만 할 수는 없었다.

프론트 조원분께 서버 배포 관련 자료를 넘겨받아
내가 직접 프론트 서버를 배포하기로 결정했다.
이전에 다중 이미지 업로드를 구현하면서 다뤄봤던 AWS S3라서
큰 무리는 없겠다 생각했다.

AWS S3를 이용한 정적 웹사이트 호스팅

• 이미지 업로드 때와 마찬가지로 AWS S3 버킷 생성
  - 객체 소유권 비활성화 / 퍼블릭 액세스 차단 해제
• 정적 웹사이트 호스팅 활성화
• 버킷 정책 생성
• IAM 사용자 생성
• AWS CLI 설치 (여기서 설치)
• CLI에 버킷 정보 입력

aws configure

       - Key ID : IAM 사용자 추가할 때 저장한 Access Key ID 값
       - Access Key : IAM 사용자 추가할 때 저장한 Secrete access key 값
       - region name : ap-northeast-2
       - format : json

aws s3 ls

       - 등록된 S3 버킷 정보가 나오면 성공!

• 배포 스크립트 추가
  - vscode에서 프로젝트 열기
  - package.json 파일을 열고, script 부분에 배포 스크립트를 추가

"deploy": "yarn run build && aws s3 sync build/ s3://버킷 이름"

       - 프로젝트에 필요한 프로그램들 설치
       - 프로젝트 경로 터미널에서 배포 스크립트 명령어 실행

yarn run deploy

 

이렇게 프론트 서버를 배포한 후,
마감 시간을 2분 남겨놓고 무사히 제출할 수 있었다!

 

 

 

미니 프로젝트 [감자마켓] 프로젝트 발표

1. 프로젝트 소개

🥔 감사히 자알 쓰겠습니다-! [감자마켓]

누구나 쉽게 거래할 수 있는 중고거래 플랫폼이 있다?!

이제는 사용하지 않는, 집에 묻혀있는 중고 제품들을 감자 캐듯이 캐보세요.
흙을 털어내서 숨어있는 가치를 거래하는 감자마켓!

 

2. 주요 기능

• 로그인/회원가입
  • JWT 토큰 부여 및 로그인 여부 확인
• 게시글 작성/조회/수정/삭제
• 댓글 작성/조회/수정/삭제
• Spring Security로 강화된 보안
• S3를 이용한 다중 이미지 업로드

 

3. 서비스 아키텍처

 

4. 기술 스택

Frontend	Backend
React	Springboot
Redux	Spring Security
Redux Toolkit	JWT
Axios	AWS S3, RDS

 

👉 이후 내용은 노션 발표자료 참고

5조 중고거래 [감자마켓]

👉 감자마켓 Github Repository

potato-marketplace

 

 

 

 

기술 매니저님의 피드백

• API 명세서 꾸준히 업데이트하여 공유
• 이 기능이 우리 프로젝트에 정말 필요한지에 대한 고민 필요
• 협업은 코드도 동일한 형태로 가야 함 되도록 초반에 컨벤션을 잡기
• 깃헙 리드미 빠짐없이 작성하기(기술 스택 선정 이유 등)
• 커밋 컨벤션
• 메서드 내에 바로 하드코딩은 좋지 않음
• if/else → ealry return
• 토큰만 가지고 로그인이 되도록? 새로고침
• swagger 적용해 보기
• 이번주 아쉬웠던 점 잘 정리해서 이후에는 안 해본 기능 해보기
• 프로젝트가 점점 커지기 때문에 구조적 측면 고민 필요
• if/else와 try/catch는 다름 구분을 해주기
• 조회에 조건 거는 것 → 검색, 페이징 도전해 보기

 

 

 

오늘의 나는

프론트 서버 배포부터 과제 제출, 프로젝트 발표까지
정신이 하나도 없었지만 혼자가 아닌 함께였기에 해낼 수 있었다.

우여곡절이 많았음에도 불구하고 끝까지 포기하지 않았던,
10기 B반 5조 감자마켓팀 고생하셨습니다!