37~40일차_1차 팀 프로젝트 진행 (상품 주문 관리 프로젝트)

안녕하세요  .ᐟ

데브코스 37일차(36일차 오후 부터 시작)~40일차 까지 1차 프로젝트를 진행했습니다.

 

팀플로 일주일 간 상품 주문관리 시스템을 만들었는데요  .ᐟ

그동안 개발한 내용과 느낀점을 공유하고자 합니다.

 

 

---

프로젝트 개요

• 일정 : 약 일주일 간 (4/22(화)~4/28(월))
• 주제 : 상품 주문 관리 프로젝트 (공통 주제)
• 기획 : 어느정도 틀이잡혀져있는 공통 기획이 주어짐
• 기술 스택
  • Spring Security 보일러 플레이트
  • JSP
  • MyBatis
  • MySQL
• 팀 구성 : 2달간 이론 학습하던 팀 그대로 진행
• 협업
  • 프로젝트 관리 : Trello
  • 소통 : zep
  • ERD : ERD Cloud

---

36 일차 오후 (4/22, 화)

팀끼리 모여서 기획을 세분화하고, 기능을 정의하고, API 명세를 작성하고 역할을 기능별로 배분했습니다.

 

역할

이번 프로젝트는 5가지 기능으로 나눴는데요~

• 회원가입, 로그인, 메인
• 주문 처리
• 장바구니 
• 관리자 페이지
• 마이 페이지

처음 하는 프로젝트다보니 어느것이 쉬운지, 어려운지, 얼마나걸릴지 모르는 상태여서 팀원들이 고르고 남는걸 하겠다고 했는데

주문이 남아버렸습니다 하하하하 받아보니 할일이 엄청 많았습니다 😭

 

 

프로젝트 구조

이번 1차 프로젝트에서는 그동안 이론으로 배웠던 MVC 패턴을 적용해봤습니다.

처음엔 MVC 패턴이 3가지로 나뉘었다만 알고, 그역할들이 감이안왔는데 만들면서 감이왔습니다....하하 

• Form Request / Response
  : 화면(form)에서 오는 요청과 응답 데이터를 담당하고, 사용자 입력값을 받아 전달하거나 결과 데이터를 화면으로 넘김
• Controller
  : HTTP 요청을 받아서 어떤 서비스를 실행할지 결정함 (말 그대로 ‘분기점’)
• Service
  : 핵심 비즈니스 로직 처리 담당 (예: 주문서 생성, 장바구니 추가 등)
• Repository
  : DB와 직접 통신하는 레이어로, 데이터를 조회하거나 저장하는 역할
• View (JSP): 
  사용자가 실제로 보는 화면으로, 폼 요청이랑 응답이 이 안에서 오고 감
• Mapper
  : DB랑 자바 객체를 연결해주는 역할 (MyBatis 등에서 SQL 매핑 처리)

 

---

 

37 일차 (4/23, 수)

오늘부터는 수업이 없고 모든시간을 프로젝트에만 씁니다 .ᐟ 

일단 팀끼리 모여서 아래와 같은 작업을 진행했습니다.

 

팀 작업

• gitHub 팀 레포 생성
  • main, 개인 branch, merge 용 branch 생성
  • 각자의 브랜치에서 작업 후 팀장이 머지하는 방식으로 설정 
• ERD 설계 (바뀌겠지만 일단 초안은 잡고 진행했습니다.)
  • 각자 맡은 기능에서 필요한 엔티티 추출
  • 컬럼명, null 허용여부, 자료타입, pk 설정 등

 

개별 작업

이제 개인작업에 돌입할 시간이 왔는데, 뭐부터해야할지 모르겠어서 화면부터 구현하고 로직을 짜기로 했습니다.

• 요구사항 파악 (주문 화면)
  • 상품정보(카테고리, 이름, 사진) 및 수량 표시
  • 수량 조절 시, 수량과 총금액 실시간 표시
  • 배송 정보 입력 폼 구성
  • '결제하기', '장바구니' 버튼 구현
• 구현 시작
  • 샘플 html -> jsp 로 변환 (jsp 기본 지시자 삽입)
• 변환 후 코드 리팩토링
  • 인라인 스타일 태그 -> 외부 css 파일로 빼내기
  • 상품 만큼 반복되는 코드를 forEach 문으로 정리
• 동적인 요소 추가
  • 상품 수량 +, - 버튼 추가 
  • 버튼 조절 시 우측에 상품명 + 갯수 + 총금액이 실시간으로 변경되게 작업

 

---

 

38 일차 (4/24, 목)

팀 작업

• 팀 레포 커밋 컨벤션 정의
• 전체 서비스 로직 리마인드
• 테이블 별 더미데이터 작성

 

개별 작업

• 주문처리에 필요한 Controller, Service, Request/Response 클래스 설계
  • Request
    • front 단에서 form 으로 받아올 데이터 지정 (userId, userEmail, userAddress)
    • 주문완료 처리 시 사용할 필드도 추가 지정 (productIds, prodcutIdToQuantity)
  • Controller
    • 결제하기/장바구니 분기처리 컨트롤러 개발
  •  Service
    • createOrder 메서드 생성
  • Reporistory
    • createOrder 메서드 호출
•  주문화면
  • '총 수량 n개' 표시를 위해 추가 개발
  • 폼 데이터 변경 (기존 : 이메일 -> 이름)
• 주문, 주문 완료 화면에 팀 공통 header 및 footer 적용 중
  • 기존 부트스트랩과 CSS 충돌나서 부트스트랩 제거
  • html 레이아웃 재배치 & order.css에 추가

 

수업이 종료된 이후에는 zep에 접속해서 각자 개발했습니다.

 

 

---

 

39 일차 (4/25, 금)

전체 merge 진행

• 주문.jsp
  • 상품 정보 하드코딩 제거 -> forEach 문으로 처리
• 주문완료.jsp 레이아웃 구성
  • 주문일자, 주문상태, 예상배송일, 주문내역, 총결제금액, 메인으로 돌아가기 버튼 추가
  • 주문 정보 출력을 위해 @ModelAttribute 사용, JSTL forEach 로 동적 데이터 바인딩 확인 
  • 컨트롤러에서 리다이렉트 확인
• 주문, 주문완료 화면에 팀 공통 header 및 footer 적용 완료

 

---

40일차 (4/28, 월)

• DTO <-> Mapper.xml 간 필드명 일치화 작업
  • MyBatis 바인딩 에러(#{} 파라미터 매칭 오류 해결)
• 주문 흐름 최종 테스트
• 전체 merge 진행
• 발표자료 제출 및 프로젝트 종료

 

---

41일차 (4/29, 화)

어제(40일차) 프로젝트 발표 자료 제출할 때 팀 레포 main 에 merge 하니 컨플릭트가 많이 발생했었는데,

팀원 중 한분이 하루동안 각자 고쳐보고 시연 때 활용하자고 제안주셨다.

 

나는 새벽 1시까지 보다가 내 브랜치에 올려놓고 잤고,

 

다음날(41일차)에 다들 저녁먹고 9시부터 zep 에 모여서 30분정도만 발표준비하고 해산할 예정이었으나,.,...

테스트 하면 컨플릭트나고 고치고,, 고치고...를 반복해서

내화면을 공유하고 팀원들 다 모여서 이거 고쳐보자 저게 문제인것 같다.. 하다보니 새벽 1시가 되어서야 결국 모든 기능이 작동됐다.

 

다음날(42일차) 모든 기능을 시연했다.

1, 2등은 다른 팀에게 돌아갔지만 그래도 우리팀이 제일 잘했다며 서로를 응원했다. 😁

 

---

1차 프로젝트 느낀 점

• 이미 제출한 자료에 대해서 모든 팀원이 모여서 새벽까지 5시간동안 열정적으로 고치고 모든 기능이 작동될 때 말할 수 없는 동료애가 생기고 끈끈해졌다. 모두가 책임감있다고 느껴졌다.
• 이론으로 배울땐 와닿지않던 MVC 패턴을 손으로 익히게 되었다. 이게 개발이구나  .ᐟ
• 초반에 한 기획에서 점점 불어난다.
  • 만들고싶은 기능도 추가되지만, 내가 몰랐던 기획도 있어서 추가됨
  • 실제 서비스 처럼 만드려면 엄청난 공수가 들어간다는 것도 알게되었다..
• Mapper의 역할을 알게되었다. Result Map도 중요하다...
• JS 어렵다 ... 이벤트 리스너가 많이 쓰인다.
• 꺼진 플젝도 다시보자  .ᐟ 지인 개발자가 보더니 오류를 한무더기 체크해주고 갔다.. (나중에 보완해볼 예정)
• 다른 팀은 예외처리, 벨리데이팅에도 신경 쓴 팀도 있던데 정말 대단하다고 느낀다.

 

1차 프로젝트에서 얻은 점

• 프로젝트 기획 경험
• MVC 패턴 경험
• 깃 브랜치 전략 경험(main, branch)
• 깃 명렁어 사용(fetch, merge, pull)
• 협업 경험

 

 

개발하면서 여기저기에 기록하다보니 모으기가 쉽지않네요

2차 프로젝트부터는 한곳에 그날그날 뭐했는지 기록을 해봐야겠습니다.

 

 

일주일동안 고생 많으셨습니다 :)