NC7기 프로젝트 - Bleu Auction 을 마치며

# 주제선정이유

# 준비 과정

# 맡은 기능

# 프로젝트를 마치며

 

 

 

https://youtu.be/tTGAhGR9OX4?si=S8pAc-Zfbr78CJB8

https://github.com/NC7-BleuAuction

---

2주간의 짧은 맛보기 프로젝트가 끝나고 본격 최종 프로젝트에 들어갔다.

 

대망의 주제선정. 

 

1차 프로젝트 당시엔 정해진 주제가 있어서 고민할 필요없이 바로 작업에 들어갔는데 이번에는 필수로 사용해야하는 AI 서비스만 주어지고 주제는 자율이었다. 다양한 주제가 나왔다. 참고 소스가 많은 중고거래부터 1차 프로젝트를 이어갈 수 있는 미술품 국제화거래 등등

그 중 가장 많은 표를 받은 것은 조장 님의 수산물 오픈 마켓 서비스 어플리케이션! 약간 생소한 주제였지만 수산물이라는 특이한 주제를 곁들이면서 많은 기능을 구현할 수 있을 것 같아 최종 주제로 선정하여 회의를 이어갔다.

 

시작하자마자 난관에 부딪혔던 것은 서버였다.

1차 프로젝트 때는 로컬에서 작업 후 띄웠기 때문에 서버를 구축해야한다는 것을 아예 생각하지 못 하고 있었다. 

(팀원 모두가 비전공자였음)

 

다행히 현우 님이 책임지고 구축해온다고 얘기하고 밤을 새워 공부해서 완성해왔고 프론트와 백 서버를 나누어 젠킨스, 도커를 이용해 구매한 도메인에 서버를 띄웠다. (그저 빛,,,!) 

 

1차 프로젝트에는 프론트와 백을 한 서버안에서 돌리고 디렉토리 정리를 했었기에 나뉜다는 개념이 생소했다. 

심지어 두 개를 합쳐서 같이 띄운다 ,,!? 나의 기능에 집중하느라 서버 쪽에는 많은 관심을 두지 못했는데 프로젝트 리팩토링 작업할 때 조금 더 공부해야겠다고 생각했다.

 

6명의 조원 중 

1명 서버, 2명 프론트, 3명 백 으로 큰 역할을 나눴고 

 

11개의 테이블을 기준으로 백의 기능을 나누었다. 

 

 

나는 여기서 

공지사항, 품목, 주문, 주문메뉴, 메뉴를 맡아 시작을 했는데 중간에 테이블 수정에 들어가면서 

만들었던 품목 코드는 날라갔고, 첨부파일의 네이버 스토리지 연결까지 맡았다. 

 

**db 구성 시 삭제라는 개념은 존재하지 않는 다는 것을 배웠다!! 이전까지는 무조건 delete 되게 로직을 짰는데 db에 한 번 들어간 데이터는 절대 삭제하지 않는단다. 사용여부 컬럼을 두어 관리하는 것도 신기했다.

 

 

 

 

---

[프로젝트 관심도의 중요성]

1차 프로젝트 당시엔 ERD 구성에 거의 참여하지 않았는데 (내 기능 구현에도 바빴다)

이번에는 안 참여한 부분이 없이 모두 참여했다. 처음부터 같이 쌓아올라가니 프로젝트에 전반적인 이해도도 높아지고 다른 사람을 돕기에도 좋았다. 그리고 ERD 구성에 관심을 가진 사람과 안 가진 사람의 이해도와 가진 사람의 완성도가 확연히 달랐다. 

ERD 에 다 나와있는데도 들여다 보지 않고 되묻는 팀원에게는 의문을 가지기도 했다. 초반 설계의 중요성을 정말 뼈가 저릴 정도로 느꼈다. 

 

 

이번 프로젝트에서 우리는 백은 JPA, 프론트는 React를 사용하기로 결정하고 시작했다. 

그래서 프로젝트 시작 전 추석 연휴가 있었는데 그 동안 JPA 강의를 사서 달달달 보고 실습하고 프로젝트에 들어갈 준비를 했다. 과연 이걸로 진행이 가능할까?!하는 의문으로 시작했는데 되긴,, 되더라!!

 

 

 

 

이게 완성된 백의 디렉토리들이다. 

1차 프로젝트 당시 단순하게 dto끼리, service 끼리 모았더니 한 눈에 알아보기가 쉽지 않았다. 그래서 이번엔 디렉토리 구성을 상의하고 시작했다. 이렇게 기능이 많은데 나누지 않았다면 정말 힘들었을 것 같다. 

 

 

 

중요도 순서대로 기능을 쳐내고 싶었지만 일단,, 내 기준 다른 테이블과 연관관계가 적고 손풀기로 할 수 있다고 판단한 공지사항부터 entity를 구성하게 되었다. 첫 시작이라 dto도 따로 구성되어있지 않고 그냥 날것의 파일 느낌인데 처음 시작은 일단 기능이 구현된다는 것으로 만족하며 시작했다. 

 

 

 

---

[postman]

백 로직을 짰으니 잘 작동하는지 확인을 할 차례였다. 내가 할 수 있는 확인 방법은,,, 타임리프로 html 파일을 짜서 화면에서 확인 하는 것,,

하나하나 만들기 시작했다. 

 

 

어차피 삭제해야할 파일인건 알지만 당시에 내가 확인할 수 있는 방법은 이것 뿐이었다. 왼쪽 디렉토리를 보면,, item, menu도 존재하는 것을 확인할 수 있다... 그래도 이걸로라도 작동하는 것을 보고 기뻐했었다.

 

그런데 프론트에서 백 컨트롤러를 불러오려면 RestController 애노테이션을 붙여야한다는 소식과 테스트는 postman으로 해야한다는 소식을 접했다. 처음에는 약간 청천벽력이었다. 나 타임리프로 잘 확인하고 있는데 굳이 포스트맨 써야해? 뭔지도 잘 모르는데 ? 하는 맘에 거부했지만,,, 해야만 하는 것이기에 피할 수 없었다. 

 

하지만 포스트맨을 만나고 신세계를 만났다 ,,! 

 

 

모든 것을 쉽게 확인할 수 있었고 에러 확인도 쉬웠다. 현업에서는 어떻게 사용하고 있을지 모르지만 나중에 취직해서도 잘 활용할 수 있을 정도로 사용법을 완벽히 익힌 것 같다. 

 

간단하게 공지사항을 구현하고 품목, 메뉴, 주문메뉴, 주문 구성에 들어갔다. 

품목과 메뉴는 다른 테이블과 연관관계가 1개~2개 정도라 간단하게 구현할 수 있었는데 주문에 들어가면서 난관에 부딪혔다. 

 

 

 

---

[주문 지옥]

주문과 주문한 메뉴를 나누어 테이블을 짰다. 참고했던 사이트들의 구성도 이와 비슷했기 때문에.

하지만 이해하기 힘들었던 것이 주문메뉴를 고르고 주문에 들어가야하는데 어떻게 주문메뉴안에 주문번호가 들어갈 수 있느냐였다. 

일반적인 생각으로는 순서가 맞지 않아 어떻게 로직을 짜야할지 정말 고민이 많았다. 

그래서 내가 할 수 있는 방법으로,,, 

일단 모달창을 띄워 주문 정보와 주문메뉴 정보를 한꺼번에 입력 받은 후 주문을 먼저 넣고 생성된 주문 번호를 주문메뉴에 넣는 것이었다. 

프론트에서도 내가 원하는대로 구성을 해주었다. 좀 더 간단한 방법이 있었겠지만 내가 생각할 수 있는 방법은 이것이었다. 

방식을 정하고 나니 구현하는 것은 그렇게 어렵지 않았다. 

 

 

 

---

[복잡한 매핑]

주문만 끝내면 간단하게 해결될 줄 알았는데 그것이 아니었다. 

판매자와 구매자가 마이페이지에서 주문 목록을 확인할 수 있는 컨트롤러를 짜야했다. 

그런데 우리 테이블에는 잘 보면 ,,, 

 

일단 주문테이블에는 회원과 가게, 메뉴의 정보가 하나도 없고

주문 메뉴에는 주문한 회원번호와 메뉴 정보는 있지만 가게가 없고

메뉴에는 가게 정보 뿐,,!!! 

 

토큰으로 주어지는 회원번호로 무언가 조회하려고 하면 정말 어지러운 sql 쿼리가 필요했다. 

(order를 검색하기 위해서 멤버 - 가게- 메뉴 - 주문메뉴- 오더 순으로 쭈욱 따져야했음)

 

 

이렇게 정리하고 보니 어려울게 뭐야 싶기도 한데 짜는 순간에는 정말 헷갈리고 힘들었다!!! 

이미 테이블이 굉장히 많고 단순하게 연결된 테이블안에 fk가 포함있으니 굳이 추가하지 않아도 되겠다 생각하고 최대한 간결하게 테이블을 구성하려고 했던 것이 오산이었다. 하지만 이미 테이블 수정이 많이 들어갔고 더 이상 수정하면 기존의 다른 기능들도 수정에 들어가야 할 수 있어 최대한 테이블을 고치지 않고 로직을 완성했다. 초보자들이 모여서 하게된 실수인 것 같고 다음 프로젝트를 진행한다면 이 점을 염두해두고 ERD 구성에 들어가야할 것 같다! 

 

얼추 백 로직을 마치고 나니 프론트에 문제가 많았다. 

백엔드 파트 역시 JPA라는 새로운 기술을 사용하여 애먹었지만 기존에 Java를 배웠기 때문에 최대한 이해하려고 노력할 수 있었다. 하지만 리액트는 학원에서 전혀 배우지 않았고 정말 맨땅에 헤딩으로 시작했기 때문이다.

 

프로젝트가 시작되고 1주일이 지났음에도 불구하고 로그인 기능조차도 제대로 구현되지 않았었다.

 

사실 많이 불안했다. 프론트 담당 팀원들도 리액트를 전혀 접해보지 않은 사람들이었고 타임리프 수준을 생각하면서 프론트를 지원한 것 같았다. 일단 내 백 기능을 끝내고 나도 모르지만 일단,,, 붙어봐야겠다 싶었고 공지사항 CRUD구현을 시작했다. 

 

프론트 페이지 꾸미기는 프론트 담당이 해줬다.

 

 

기존에 프론트 담당들이 만들어놓은 컴포넌트와 코드들을 활용하고 열심히 검색하며 CRUD 페이지를 모두 연결 성공했다. 

내가 만든 백 로직이어서 이해를 완벽하게 하고 있어 화면이 빨리 나왔던 것 같다. 내 기억이 맞다면 기존 인원들이 연결 성공해놓은 페이지보다 내가 만든 공지사항 CRUD 페이지가 더 많았다. 이렇게 기능이 나왔을 때 도대체 왜 못 하고 있던 걸까 야속한 마음이 컸었다. 

완벽한 이해 없이 완성한 페이지였지만 3주도 채 안 되는 짧은 기간동안 우리는 발표물을 만들어 내야하는 상황이었고  더 속도를 내주면 좋겠다고 생각해서 계속 부탁을 했었다. 프론트 팀에게 현 상황을 정리해달라고. 정리 후 도움을 요청하면 도와주겠다고. 그런데 프론트 팀에서는 당장 맡은 기능하느라 정신이 없어서 파악하기 힘들다고 끝까지 무시했고, 나와 서버 담당자가 계속 프론트 페이지를 점검했다. 한 팀이기에 누가하면 어떻냐 라고 할 수도 있지만 맡은 담당이 있는데 그냥 방치해버리고 마음 급한 사람이 처리하는 모양새같아 중간에 화가 많이 났었다. 하지만 일단 마무리 했어야했기에 계속 점검하며 부족한 곳을 찾았고, 팀의 능력자 조원에게도 부탁하고 내가 할 수 있는 기능들은 최대한 내 손으로 해결하려고 노력하며 프로젝트를 마무리 했다. 아까 짰던 그 어려운 쿼리로 뽑아내는 구매자와 판매자의 주문확인 기능 페이지도 내가 만들었다. 그 당시에는 정말 많이 야속했지만 지금 다 끝나고 돌이켜보면 프론트와 백 둘 다 경험할 수 있는 좋은 기회였던 것 같아 잘 된 것 같다. 물론 리액트는 정말 겉핥기지만 안 한 것보단 백 배 낫지 않나!?하는 생각으로 말이다. 

 

 

영상을 만들어오기로 했던 팀원이 잠 들어버리는 바람에 발표 당일에 급하게 영상을 편집하고 대본을 짜면서(나 혼자 했다) 긴장할 틈도 없이 정신없이 준비하고 발표를 끝냈다. 하고 나니 후련했고 매직애꼴 담당자분들도 잘했다고 해주셔서 매우 뿌듯했다. 

6개월의 대장정을 마친 느낌 ,,!!! 

 

팀원들과 스터디룸을 빌려 밤도 새고, 서로 의논하며 정신없이 지낸 프로젝트가 완전 끝났다. 

부족한 부분의 보수를 원하는 팀원과 함께 리팩토링을 하기로 했기 때문에 완전한 끝은 아니지만 ! 

보수 후 블로그도 남기러 다시 오겠다. 

 

 

---

 

[정말 후기]

이번 프로젝트를 하면서 가장 기억에 남는 건 팀원과 함께 오류를 해결하던 순간이다. 

이 과정을 시작할 당시엔 난 잘 모르니까,, 라는 생각이 가득 차있었고 남의 코드를 보기도, 내 코드를 보여주기도 무서웠다. 하지만 이번 프로젝트를 진행하면서 서로 안 되는 코드를 보여주고 의논하고, 심지어 내가 팀원에게 도움을 줬을 때는 정말 짜릿했다. (오히려 오류가 한 번 더 났으면 하는,,?! 내가 또 봐주고 싶은 ,,!!!) 슈퍼백마스터 슈퍼빵이라는 별명도 얻었다. 아직 많이 부족하기에 공부가 많이 필요하지만 이런 자신감이 생겼다는 것이 내게 아주 큰 의미이다. 

 

그리고 프론트 페이지가 빨리 나오지 않아 정말 초조했고 결국 내가 나서서 들어가서 프론트엔드를 진행시키고 있을 때 사실 불만이 많았다. 물론 얼른 마무리하는 쪽이 붙어서 도와주자고 했지만 도와달라고 말하지도 않고 그냥 알아서 해주길 바란다는 말을 들었을 땐 의욕이 바닥까지 꺼졌다. 진행하면서 몇 번을 참았는지 모르겠다. 하지만 ,,, 프론트 파일을 보니 그 입장이 약간은 이해됐다. 정말 복잡한,, 한 눈에 들어오지 않는 구성과 컴포넌트들, 완벽을 추구하며 로직을 짜는 팀원을 생각하면 그렇게 할 수 밖에 없었구나 싶었다. 다음에도 성향이 다른 다양한 사람들과 진행을 할텐데 서로 존중하는 태도를 가져야겠다고 여러번 다짐했다. 

 

3주 내내 잠을 제대로 잔 적이 없었다. 하지만 하루도 즐겁지 않은 날이 없었고 잠이 쏟아지기도 했지만 피곤한 날도 없었다. 

같이 끝까지 함께 해준 5명의 팀원들에게 무한한 감사를 전하며 ,,, 나의 개발자 도전기에 함께 해준 모든 동료들에게 정말 감사하다! (글썽)

물론 이제 시작이지만 !!!!