가장 - 가볍게 장보자!

김시현 Si Hyeon, Kim·2022년 7월 17일
0

Portfolio

목록 보기
1/8
post-thumbnail
post-custom-banner

가장 ; 가볍게 장보자

- 1인 가구를 위한 식료품 공동구매 플랫폼

- 가장을 만든 사람들

- 담당 업무

  • 아이디어 기획
  • DB 설계
  • API 제작

- 가장에 사용된 Backend 기술 스택

  • node.js
  • Express
  • git
  • Docker
  • Mysql

- 가장 유스케이스 설계

  • 유스케이스만 보아도 한계점이 명확함 : 사용자가 사용하기에 일일히 기록해야할 정보들이 너무 많음.
  • 휴대폰 인증 시스템은 SNS 로그인으로 대체되었음

- 가장 Flow Chart

- Backend 설계

  • DB 설계는 다음과 같이 하였음. 회원정보 저장과 관련된 보안은 구현하지 않았음. 프론트에서 SNS 로그인으로 대체할 예정되어 있었음.
  • 결제모듈 같은 것은 사용하지 않고, 공구를 진행하는 사람의 계좌 정보를 보여주는 형태로 구현
  • 이미지는 서버의 Static 위치에 저장해놓고, 불러오는 형태
  • 사용자가 한번의 Request를 보낼 때, 여러 DB Table에 접근하는 상황이 발생함
    -> 트랜잭션을 생성하여, 전부 성공시 Commit 중간에 에러가 발생하면 Rollback 함.

- Swagger 사용 API 문서화

  • Swagger 코드를 js 상단에 삽입하여, 주고받는 데이터의 내용과 타입에 대하여 명시하였음.
  • Front를 구현하는 사람들도 프로젝트가 처음이어서, Postman에서 테스트 하는 것보다 Swagger에서 임시적으로 테스트 해보는 것을 더 편하게 사용하였음.
  • js 파일 내에 기록하다보니 코드길이가 너무 길어짐.

- Docker을 이용하여 배포

  • 개인 NAS(nginx 기반)에 Docker 패키지를 설치하여, 프로젝트 파일을 도커 이미지로 빌드하여 배포하였음.
  • 공인 IP(2개) -> 스위칭 허브 -> 공유기 -> NAS 로 연결되어 있을 때, 공유기에서 DMZ 설정으로 모든 포트에 대한 접근을 NAS로 설정해놓았음(원래는 80, 443포트만 개방해야 보안에 안전함)
  • 도메인 (.shop)을 구매하여 공유기 IP주소를 연결해놓았음. IP 주소를 입력해야하는 불편함을 줄임
  • 도커를 처음 사용하여 소스코드가 수정되면, 새로 이미지를 빌드하고 컨테이너를 생성함.

- 최적화

  • 초기에는 index.js(가장 초기에 실행되는 파일)에 미들웨어를 직접 불러와서 일일히 url을 매핑하였음
    -> router.js를 생성하여 router를 이용하여 url에 따라 미들웨어가 매핑되도록 설정하였음.

- 어려웠던 점 & 해결 과정

어려웠던 점해결과정
이미지 업로드FormData에서 받은 이미지를 가져온다는 것이 머릿속에서 잘 그려지지 않아서 힘들었음. AJAX로 통신하면서 Post로 Data를 보낼 때 MultipartFile을 이용하여 받을 수 있다는 것을 공부하여 해결함
Swagger 사용처음에 문법이 완전 새로운 형태여서 공부하느라 많이 힘들었던 것 같음. Swagger 공식 Docs에 설명이 잘 되어있어서 끝내 해결할 수 있었던 것 같음. 이런 API를 문서화할 수 있는 라이브러리가 있다는 것을 같이 프로젝트하는 친구덕분에 알게 되었는데, 이렇게 협업을 진행한다는 것을 알 수 있었음.
Docker이 당시에는 마운트라는 개념도 몰랐고, SSH도 잘 다룰줄 몰라서 소스코드가 수정될 때마다 컨테이너와 이미지를 완전히 Delete하면서 작업을 진행하였음.
Front와 협업같이 프로젝트하는 친구들이 API를 사용하는 방법을 전혀 모르는 형태에서 진행하여 힘들었던 것 같음. 나도 내가 만든 API를 누군가가 쉽게 사용할 수 있도록 설명을 잘 못했던 것 같음. RESTFul API를 제작하기 위해서는 용어나 url선정에 있어서 누구나 이해할 수 있어야 하는데, 아직 능력이 많이 부족한 것 같음. 코딩을 할 때에도 변수나, 메소드명을 지을 때도 신경을 써보도록 노력해야 할 것 같음.

- 발표 영상 및 기획 설명

  • 중간 발표 영상
    집단지성팀 - GaJang

  • 최종 발표 및 Social Innovation Fair 참가 발표 영상
    집단지성팀 - GaJang

Git 보러가기

소스코드 보러가기

profile
최악의 환경에서 최선을 다하자!!
post-custom-banner

0개의 댓글