SeSAC 영등포 6기 2차 프로젝트(240821~240912)
🔗 배포 서버 : http://43.201.85.98:8080/
덕질의 즐거움을 함께 나누는 공간, 리블링스는 독일어로 '최애'를 의미합니다. 덕질의 열정은 시간이 흘러도 변하지 않습니다. 하지만 최애가 바뀌기도 하고, 새로운 애정을 찾기도 합니다. 저희 웹 사이트는 K-pop, 스포츠, 애니메이션, 영화/드라마, 게임, 스포츠 등 '다양한 덕질 분야의 물품을 중고 거래할 수 있는 공간'입니다.
| 강예나 | 김어진 | 김지민 | 양태완 | 윤예슬 | 이다인 | |
|---|---|---|---|---|---|---|
| Profile | ||||||
| Role | [팀원] FE | [팀장] BE, DevOps | [팀원] BE, DevOps | [팀원] FE, BE, DevOps | [팀원] FE | [팀원] FE |
| GitHub | yenaf | qldirr | cmkoi1 | behindy3359 | errorose | DAIN302 |
back
Main branch
└── dev
├── frontDev
| ├── feat/login
| ├── feat/register
| └── feat/post
| └── feat/multer
| └── hotfix/user
front
Main branch
└── dev ── fork
├── Main branch
├── dev
| ├── MainPage
| ├── RegisterPage
| ├── SellersPage
| ├── MyPage
| ├── ···Page
·
·
·
SESAC-2ND-FRONT
├── public - 공통리소스 저장공간
├── src - 리액트 앱이 저장될 장소
│ ├── api - axios 통신 함수 모음
│ ├── components - (하위)컴포넌트모음
│ │
│ ├── data - 카테고리 데이터, 테스트용 더미 데이터 객체 모음
│ ├── hooks - 커스텀 훅 모음
│ ├── layout - 공통 레이아웃 모음
│ │ └── routes - 공통라우트 모음
│ │
│ ├── pages - 페이지(상위)컴포넌트 작성
│ ├── store - 전역 상태 관리용
│ ├── styles - 사이트에 적용될 스타일모음
│ │ │
│ │ ├── common - 공통 스타일 모음
│ │ ├── layout - 레이아웃 관련 스타일 모음
│ │ └── pages - 페이지 스타일 모음
│ └── utils - 공통 함수를 추출해 분류
└── App.js - React 애플리케이션의 루트 컴포넌트
SESAC-2ND-BACK
├── config - sequelize 등의 설정 파일 모음
├── controller - API 요청에 대해 실제로 어떤 동작을 하게될 지 정의
│ │
│ └── index.js
│
├── middlewares - 미들웨어
│ multer - 파일 전송용
│ session - 세션 설정용
│ winston - 로그 기록용
│
├── models - sequelize의 모델을 정의, db 연결 객체를 생성
├── routes - 리액트에서 요청받은 요청들을 분류하는 라우트
├── utils - 여러 함수에서 사용하는 공통유틸을 추출
├── logs - winston 미들웨어를 통해 로그를 기록하는 디렉토리
└── app.js - 애플리케이션의 주 진입점 파일
- 이다인
- 커스텀 훅 및 리덕스를 활용한 유저 권한 관리
- 결제 관련(장바구니, 결제, 결제완료, 배송지) 상태관리 및 기능
- 카테고리 별 상품 목록 페이지 레이아웃, 렌더링, 페이지네이션 기능
- 검색 기능 및 검색 결과 페이지 레이아웃, 렌더링, 페이지네이션 기능
- 관리자 페이지 레이아웃, 렌더링 및 기능
- 공통 UI 레이아웃(header, footer, main)
- 리액트 라우터 초기세팅
- 양태완
- 프론트엔드와 백엔드의 API 연동과 데이터바인딩 작업중 발생하는 오류 해결
- 일관성 없는 응답구조의 개선
- S3와 통신하는 미들웨어 구현
- 마이페이지 초기 페이지
- cors 해결, AWS를 통한 배포
- 김어진
- 시스템 또는 애플리케이션의 전반적인 구조 설계 책임
- 프론트엔드와 백엔드 간의 통신 및 데이터 처리 과정에서 발생하는 문제 해결
- AWS 인프라 설정 및 유지보수 작업
- DB 초기 설정 및 운영 관리
- 서버 측 코드 베이스 및 환경 설정 작업
- 윤예슬
- 로그인 모달 레이아웃 및 기능, 상태관리
- 회원가입 페이지 레이아웃 및 기능
- 마이페이지 레이아웃 및 기능 (구매내역, 판매내역, 판매글목록, 찜목록)
- 구매내역의 구매확정 / 판매내역의 송장번호 등록 기능
- 판매자 등록 페이지 레이아웃 및 기능
- 개인정보 수정 / 판매자 정보 수정 페이지 레이아웃 및 기능
- 공통 UI 레이아웃(header, footer, main)
- 리액트 라우터 초기세팅
- 강예나
- 메인페이지 레이아웃 및 스와이퍼, 렌더링 기능
- 소개페이지 레이아웃 및 기능
- 판매글 등록 페이지 레이아웃 및 기능
- 판매글 상세페이지(상품정보, 찜, 신고, 댓글, 대댓글) 레이아웃 및 기능
- 알림 시스템 개선
- 테스트 환경 구축
- ESLint, Prettier 설정 및 적용
- 공통 UI 레이아웃(header, footer, main)
- 리액트 라우터 초기세팅
-.Clipchamp.6.1.mp4
- 일반 회원이 판매글을 등록하고 싶다면 판매자 등록부터 진행
- 판매글에 대해 주문이 생성되면 송장번호를 입력 -> 배송 상태가 '배송 중'으로 변경
- 판매글이 '판매 예약' 상태면 판매글 수정 및 삭제 불가
default.mp4
- 구매자는 판매글에 대해 찜 등록 및 삭제, 장바구니 담기, 판매글 신고 가능
- 구매자가 결제를 진행하면 결제 대금이 관리자에게 전달
- 주문 건에 대해 구매확정을 하면 결제 대금이 판매자에게 전달
1.mp4
- 관리자는 일반 회원이 할 수 있는 판매 물품 찜 및 구매가 불가
- 관리자가 특정 판매자를 블랙리스트에 추가할 경우, 해당 판매자의 '판매 완료'되지 않은 주문 건에 대해 구매자에게 환불 처리
- 구매자가 결제를 진행하여 주문이 생성되면 결제 대금이 관리자에게 전달, 구매자가 구매한 물품을 '구매 확정'을 하면 결제 대금이 판매자에게 전달(관리자가 대금을 중개하는 역할)
3.mp4
1.mp4
default.mp4
강예나 : 이번 프로젝트에서 사용자가 편리하게 정보를 입력하고 접근할 수 있는 방법을 고민하였고, 이를 통해 사용자 중심의 디자인과 개발 능력을 향상 시킬 수 있었던 좋은 경험이었습니다. 팀원들 다들 고생했고 고마워요!
김어진 : 구현해야 할 기능이 많아서 모든 개발에 우선순위를 두고 개발을 했다는 점이 어려웠지만 프론트와 이야기를 하여 에러 사항을 공유하면서 진행하여 배울점이 많았습니다.
김지민 : 끝까지 참여하지 못해 아쉽지만, 체계적인 설계 및 개발 과정을 통해 많은 것을 배울 수 있어 좋았습니다.
양태완 : 뒤늦게 합류한 프로젝트에서 어떠한 역할을 수행해야 하는지 고민해볼 수 있는 기회였습니다.
윤예슬 : 이번 프로젝트를 통해 리액트를 사용함으로써 컴포넌트 기반 설계와 상태 관리 등의 개념을 익힘으로써 개발 역량이 한층 성장한 것을 느낄 수 있었고, 프로젝트 완성까지 열정적으로 함께 달려온 팀원들 모두 고생하셨습니다!
이다인 : 이번 프로젝트를 통해서 머리속에 애매하게 알고 있던 지식을 구체화 시키면서 성장하는 느낌이 들어 좋았습니다. 특히 리덕스를 활용해서 상태관리를 쉽게 할 수있는 방법을 배울 수 있어 만족스럽습니다. 모두 고생하셨습니다.