프로젝트 회고 : 파이널 프로젝트

프로젝트/finalproject

프로젝트 회고 : 파이널 프로젝트

berryberries 2023. 5. 26. 00:48

23.04.17 ~ 23. 06.20까지 진행한 팀 프로젝트가 마무리 되었다.

세미프로젝트 없이 파이널 프로젝트를 바로 시작하다보니 설계단계부터 막막했던 프로젝트 였는데 정신없이 개발하다보니 어느새 끝난 첫 프로젝트였다.

개발이 다 끝나고 다시 봤을 때 빈틈이 많던 프로젝트였지만 개발하면서 많이 배웠고 내 부족한 부분을 알게 되었던 프로젝트였다. 중간중간 기록을 하면서 개발을 했어야 했는데 막상 시작하고 보니 따로 기록한건 없어 더 늦으면 기억에 잊혀질거 같아 다시 차근차근 기록해 보려고 한다.

📌프로젝트 소개

JaManChu
'위스키를 좋아하는 사람들이 자연스럽게 만나서 서로 즐기고 취할 수 있는모임'

1. 프로젝트 명 : JaManChu
2. 기획 의도 : 위스키를 좋아하는 사람들을 위한 모임 커뮤니티 서비스
3. 프로젝트 인원 : 6명
4. 프로젝트 기간 : 23.04.17 ~ 23.06.20
5. 기술스택
▪️ Back-end : Java, Spring Framework, Oracle, Mybatis, websocket
▪️ Front - end : Javascript, JQuery, HTML, CSS, Bootstrap
6. 링크 : 깃허브 링크

📗 ERD

🛠️ 내 역할

기본 레이아웃 : 기본 레이아웃, 마이페이지 레이아
로그인 / 회원가입 : 소셜로그인, 아이디찾기 / 비밀번호 재설정
친구 기능 : 유저 검색, 친구 추가, 친구 삭제, 친구 리스트 조회
마이페이지 : 유저 정보 수정 및 탈퇴 , 내가 쓴 게시물 조회, 프로필 업로드 및 수정

📌 프로젝트 과정

1. 기획 단계

우리팀이 기획한 프로젝트는 위스키를 즐기는 사람들을 위한 커뮤니티였다. 원래 위스키라고 하면 나이대 있는 사람들이 즐긴다는 인식이였다. 하지만 최근들어 위스키를 즐기는 연령대가 많이 낮아졌다는 조사 결과가 있을정도로 연령대가 낮아지기도 하고 그만큼 유입도 많아지면서 이 사람들을 위한 커뮤니티를 개발해보자는 취지로 기획을 시작했다.

2. 설계 단계

팀장님이 기획을 하면서 레퍼런스 사이트를 조사해왔었고 해당 사이트를 바탕으로 설계를 시작했다. 우리 팀에서 디자인을 잘하는 사람도 없었고 백엔드나 프론트엔드를 따로 나누어서 구현한 것도 아니었어서 디자인에 시간을 많이 투자하지 말고 기능에 좀 더 투자하자는 쪽으로 의견이 모였다. 기능 설계는 화면 설계가 되어야 세세하게 설계를 할 수 있을 것 같아서 카카오 오븐을 통해 빠르게 구현했고 오븐에 기능들에 대해 자세하게 설계를 했다.

오븐에 적은 기능들을 정의서에 요약해서 적고 강사님께 피드백을 받으러 갔다. 구현을 할 때는 요구사항 정의서를 보면서 구현하게 되는데 너무 요약이 빈약하게 되어있어서 이걸 보고 구현은 힘들다는 피드백을 받았다. 이후 면접을 보러가서 해당 회사에서 보통 설계를 할 때 이런식으로 한다며 자료를 보여주셨는데 이 때 했던 강사님의 말을 그 때 이해하게 됐다. 버튼 하나하나에 어떤기능이 어떤 동작을 하는지 세세하게 적혀있었는데 그래서 정의서를 보고 구현을 하게 된다는 말이 이해됐다.

DB는 ERD클라우드를 사용해서 설계를 했다. ERD클라우드로 협업도 가능해서 각자 설계한 테이블들을 ERD클라우드로 옮기면서 쉽게 만들 수 있었다. 요구사항 정의서를 보면서 테이블을 설계했는데 생각보다 테이블 수가 많이 나왔다. 테이블을 설계 할 때 강사님이 쪼갤 수 있는 건 쪼개면 좋다는 말을 얼핏 듣고 테이블을 짰는데 테이블을 설계하면서도 이게 맞나 싶은 것들도 많았고 이해가 어려운 테이블도 있어서 팀원분의 도움을 받기도 했다. DB테이블은 테이블 합치기도 하고 나누기도하면서 진짜 많이 수정했다. 개발하면서도 수정했으니까

후에, DB에 대해 다시 공부했고 프로젝트 정리하면서 내가 설계한 테이블을 다시 보게 됐는데 부족한 부분이 많이 보였다.

3. 개발 단계

프로젝트 기간 중 실질적인 개발 기간은 1달 조금 넘었던 것 같다. 설계기간을 3주?정도 했던거 같으니까. 본격적으로 개발을 시작하면서 많은 오류들과 그 오류들을 해결하면서 기본 지식에 대해서 많이 생각했던 것 같다. 기초가 부족해서 발생한 오류들도 많았고 그로 인해 효율적으로 코드를 쓰지 못했으니까. 그러다보니 처음 바로 취직해야지 했던 목표가 어느정도 공부하고 취업하자로 바뀌게 되었다.

▪️ 소셜로그인 API

로그인파트에서 가장 중점으로 생각했던 것은 'API 사용해보기' 였다. 수업과정에서 로그인 로직에 대해서 배웠지만 요즘엔 소셜로그인을 통해서 로그인 / 회원가입을 많이 하는 추세이기 때문에 소셜로그인이 어떻게 작동하는지 궁금했었다.

소셜로그인을 구현하기 전에 개발자 디벨로퍼에 들어가서 API문서들을 읽어보면서 이게 무슨 동작하는지 봐도 기초가 부족하니 이해하기 정말 힘들었다. 이 때 제대로 공부하지 않았던게 구현하면서 문제가 생기기도 했고..

기존 로그인은 세션으로만 해서 다른 방식의 로그인은 어떤것이 있는지 알고싶었고 api를 사용하면서 로그인 로직에는 토큰을 이용한 방식도 있다는 것을 알게되었다. 이후 스터디 하면서 로그인 로직에 대해 다시 배울 수 있었는데 공부하고 다시 api문서를 봤을 때 해당 문서가 자세하게 적혀 있다는걸 그제서야 느꼈다.

역시 기초지식은 중요하다

▪️ Ajax

ajax 이건 수업을 들을 때도 이해갈듯 말듯 애매했던 기술이였다. 비동기 통신이여서 새로고침이나 페이지 이동을 안해도 ajax는 데이터 전송을 할 수 있다 정도만 알고 구현을 시작했는데 ajax 정말 많이 쓰인다.

많이 쓰이는 기술이지만 어떻게 이걸 jsp에서 controller로 받아오지? 이부분이 정말 이해가 안됐다. 분명 ajax로 해당 url과 데이터 전송 방식을 설정했는데 안받아와지니까 어디가 문제인지 여기서 많이 헤맸다. 간단하게 html로 보내는건 알겠는데 json으로 보내려니까 왜 안되는거지 하면서 고민을 엄청 했다.

json으로 데이터를 전달하려면 컨트롤러에서 @responsbody 어노테이션을 통해 전달해야 하는데 그 걸 몰라서 html로 보냈었다.

▪️ 파일 업로드

오류 해결하는데 가장 많은 시간이 걸렸었다. 문제가 하나만 터지게 아니고 세션문제와 데이터를 저장하는 부분까지 합쳐져서 진짜 주변에서 그냥 지우고 다시 짜는게 더 빠를꺼 같다고 소리들을 정도로 꼬였던 오류였다.

결론을 보면 비효율적으로 구성된 코드들로부터 발생한 오류였고 이로 인해 줄줄이 엮여서 아주 큰 스노우볼이 되었다..

이 오류를 해결하면서 필요없는 코드 정리와 클린코드에 대해서 생각해 보게 됐다.

📌프로젝트 성과

① 팀원과 협업

팀원 각각의 능력치가 달라서 프로젝트 기획을 할 때부터 팀원들이 내는 의견을 듣는 것 만으로도 공부가 됐다. 수업시간에 배운 내용이어도 내가 써보지 않았던 지식들은 잊혀졌었는데 그 내용을 팀원분들이 알고 있는 경우도 있어서 내가 부족했던 부분을 팀원들 덕분에 알아갈 수 있었다.
프로젝트 진행하면서 어려운점이 생겼을 떄 서로 고민하기도 하고 어떻게 구현하는 것이 더 좋을지에 대해서도 자잘하게 회의를 하면서 프로젝트 완성도를 높일 수 있었다.

② 문제해결 능력

처음 오류가 났을 땐 뭐가 문제인지도 모르고 이거 뭐가 문제지? 이러면서 내 코드를 그대로 gpt에 물어보거나 구글에 검색해서 알아낸 코드를 가져오기만 했었다. gpt로도 에러들이 해결되지 않았는데 팀원분이 오류 수정하는 걸 보고 내가 하고 있던 방식은 잘못됐다는 걸 알았다. 가장 먼저 오류가 어디서 생긴것인지 logger를 찍어보면서 분석하기 시작했다. 그 전엔 무작정 구글이나 gpt에 물어봤는데 이젠 해당 코드에 데이터가 저장됐는지부터 확인하게 되었다.

📌 아쉬운 점

① 낮은 스프링 이해도

프로젝트 직전 스프링을 배우게 됐는데 스프링을 배우는 기간이 너무 짧았다. 그래서 프로젝트 들어갔을 때 스프링의 이해도가 정말 낮았다. 지금은 기본적으로 빈 등록하고 사용하는건 프로젝트 하면서 익숙해 졌지만 스프링을 잘 몰라서 발생하는 오류들을 보니 스프링을 다시 공부해야겠다는 생각이 계속 들었다.

② 세션에 정보가 많이 저장됨.

세션에 userno를 제외하고는 최대한 저장하지 말아야 한다고 배웠다. 로그인 인증을 세션으로 구현하고 로그인 성공후, 받아와야 하는 정보들을 세션에 저장하다보니 생각보다 세션에 저장되는 값들이 많아졌다.
이후엔 토큰을 사용하면 세션에 정보를 많이 저장하지 않아도 되서 보안을 높일 수 있다는 것을 알게 되었다. 나중에 JWT를 사용해서 로그인을 구현해봐야겠다.

③ 중복된 코드사용

프로필 사진을 화면에 보여줄 때 중복된 코드를 계속 적어야 했었다. 레이아웃 구성을 잘못해서 일어난 일인데 계속 중복 코드를 쓰다보니 너무 불필요한 자원을 계속 쓰는거 같았다.
이걸 어떻게 수정해야 좀더 깔끔하게 할 수 있을까?