!!!Team Stones 뽜이야!!!
최근 한달간 팀프로젝트를 경험하면서 스스로 개발하는 환경에 대해서 다시 한번 생각해 보았다. 특히 기존 CRUD의 틀에서 벗어나 필요한 부분에 있어서는 어느정도의 창의력이 필요하다는 것을 몸소 느끼게 되었고 미리 기록을 해둔다면 필요할때 찾을 수 있기도 할 뿐더러 시간을 줄일수도 있을것 같다.
우선 팀프로젝트에 관하여 간단하게 설명하자면..
프로젝트명 : 메가박스(Clone)
팀원: 이승현, 최승명, 박상우
내가 맡은 개발 직무 : 메인 홈페이지, 빠른 예매 페이지, 관리자페이지(中 시간표관리 CRUD)
가장 신선하면서도 많은 고초를 겪은 부분은 아무래도 빠른 예매 페이지 인것 같다. 예매라는 시스템 자체에 대한 알고리즘에 대해서 생각해 볼 수 있는 좋은 시간이면서도 코드를 짜면서 이게 맞을까.. 싶은 의구심이 들었지만 기능을 구현했을때의 그 뿌듯함은.. 아직도 기억에 생생하다. 정말 값진 경험이였기에 이렇게 기록으로 남기게 되었다.
1. DB ERD 계획 및 구성하기
- 프로젝트의 시작 및 팀프로젝트 첫 회의겸 DB ERD 계획을 세웠다. 의외로 생각할 것이 정말 많았다. 프로젝트를 시작했다는 가정 하에 어떤식으로 페이지들 마다 연결이 될까? 라는 생각을 하며 페이지에 필요한 부분들에 대해서 우선적으로 전부 다 만들었다. 그 후 중복되거나 굳이 필요하지 않다고 생각하는 부분들에 대해서는 지우고 추가로 필요한 부분에 있어서는 전부 수정을 거쳐가며 수정본을 계속해서 완성해 나갔다. 프로젝트 생각만 했을때는 감이 잡히지 않았지만 ERD 구성을 하며 점점 틀이 잡혀 나간다는 것을 느낄 수 있었다.(DB를 짜시는 분들은 정말 대단하신것 같다.) 아래 사진은 마지막 프로젝트를 끝냈을때를 기점으로 캡쳐한 DB Diagram이다.
- 위 Diagram을 보면서도 알 수 있지만 Booking 테이블이 많은 테이블에 영향을 준다. 실제로도 DB를 구성할때 예약부분은 클라이언트(사용자), 영화시간표, 영화 등 많은 테이블에 조건부를 통해서 예약이 가능했기 때문에 상당히 어려웠다.
2. DB를 바탕으로 페이지 구성 및 Html, Css, Js 작업
- 사실 말이 작업이지 이때부터는 각자 맡은 직무에 의한 페이지 만들기를 시작하였다. Front부분에 있어서는 크게 어려운 부분이 없었다. Clone으로 하는 프로젝트라서 기존 틀이 있었기 때문에 만들면서 이부분에 이런식으로 해도 되는구나 정도의 감을 익힐 수 있었다. 사실상 홈페이지는 다른 세부 페이지를 다 완성하고 마지막에 작업하는게 수월했다. 세부 페이지에서 모든 작업을 처리해놓고 그 처리에 맞는 값을 땡겨오기만 하면 되기 때문이다.
3. 내가 맡은 빠른 예매 페이지 만들기
- 이 부분에서 많은 고민이 있었다. 우선 순수 movie(영화정보)관련 테이블에서의 정보와 movieInfo(영화 시간표 및 기타)테이블의 정보를 통해 booking(클라이언트의 예매)테이블에 값을 대입하여야 하기 때문이다. 가장 기초이자 중요한 사용자의 회원가입 및 로그인 여부에 대한 처리를 통해 제한을 두었다. 빠른예매 페이지에 들어갈 시 로그인이 되어있지 않을 경우 로그인 페이지로 돌려 보내고 로그인이 되었을 경우에만 빠른예매 페이지에 접속할 수 있도록 설정하였다. 그 후 movie, movieInfo 테이블에서의 정보를 어떻게 넘길까 고민을 하다가 xhr을 통한 모든 값을 홈페이지가 로딩될때 넘기고 그 후 넘겨진 값을 조건에 맞게 고르는 방식으로 설계하였다.(이 부분에 있어서는 프로젝트에 자세한 설명을 기록할때 다시 한번 다룰것이다.)
- 빠른예매 페이지를 만들면서 Js를 정말 많이 사용했다. 이렇게 사용해도 되나 싶을 정도로 많이 작성하였다. 메가박스 예매의 경우 날짜, 영화, 지점 이 3가지를 클릭했을때 경우의 수로 옆에 영화 상세 시간표가 나오기 때문에 각각의 정보를 클릭했을때 createElement를 통해 영화 상세 시간표가 만들어지게 설계하였다.
- 날짜 알고리즘을 통한 날짜 표시 칸을 만드는 것 부터 고초를 겪었다. 특히 이번달과 다음달이 교차되고 이 프로젝트 당시 년도가 바뀌는(22년 -> 23년) 상황이였기 때문에 오히려 감사했다(덕분에 년,월,일에 관한 달력 만들기를 마스터 할 수 있었다.) 팀프로젝트를 시작하기 전에는 내가 생각한 것을 결과물로 만들 수 있을까라고 생각했었는데 이 날짜만들기를 하고 나서 자신감이 조금 상승했다.
- 지역, 지점, 관에 관한 구조를 설계할 때는 크게 어려운 부분이 없었다. 아! 이 당시에 지점을 3개를 초과하여 클릭할 시 alert가 뜨게 했었는데 이 때 만든 코드도 추후에 정말 많은 도움이 되었다.
- 정말 어려웠던 부분은 screenInfo 부분이였다. screenInfo칸에 내가 클릭한 정보에 따라 맞는 결과값이 떠야하는데 값을 땡겨오는것 부터 쉽지 않았다. 처음에는 Thymeleaf를 사용해서 DB에 있는 모든 값을 뜨게 하였는데 매우 비효율적이라고 생각해서 클릭한 값에 따른 데이터를 screenInfo에서 받아서 만들어 지도록 설계하였다. 아래 사진과 같이 클릭했을때마다 발생되는 이벤트로 처리하였다.(실제 메가박스 사이트에서는 날짜와 극장을 클릭했을때는 정보가 나오지만 날짜와 영화만 클릭했을때는 시간 칸에 영화시간표가 뜨지 않는다.)
- 이후 시간표가 떴을 경우 시간표를 클릭했을 때 클릭한 시간표의 정보를 그대로 가지고 다음 결제 칸으로 넘어가야하는데 두가지(?)의 경우가 발생하였다. 첫번째 경우는 클릭했을때 href를 통해 페이지를 새로 만들어서 새 페이지에 값을 넘겨주는 경우와 다른 경우는 xhr을 통해 비동기적 페이징처리로 페이지가 새로고침 되지 않고 한페이지에서 모든 것을 처리하는 방식이였다. 한페이지에서 처리하는 것이 기존에 모든 값들을 보내는 방식과 효율이 좋다고 판단하여 설계하였다.
- 앞부분을 설계하다보니 생각보다 시간이 오래걸려서 승명이형이 좌석부분을 매우매우 많이 도와주었다.(팀프로젝트의 묘미를 느낄 수 있었던 부분이였다.). 내가 부족한 부분이 있으면 상대방이 같이 도와주었기 때문에 프로젝트가 대채적으로 순항으로 이어질 수 있었던 것 같다. 시트 알고리즘이 생각보다 많이 어려워서 승명이형이 짠 코드를 같이 보며 이런저런 회의를 통해 좋은 결과를 낼 수 있었던 것 같다.(이 부분도 추후에 자세히 다룰 예정이다.)
4. 팀프로젝트를 끝으로
- 약 한달 하고도 10일정도를 팀프로젝트 하는것에 몰두 하였는데 확실한건 팀프로젝트를 해봤다는 경험 자체가 이미 큰 경험이 된것 같다. 매일 까페에 모여서 각자의 직무파트를 설계하다가 모르거나 해결이 어려운 경우는 다같이 달라붙어 해결할때까지 하루가 걸리든 이틀이 걸리든 해결해냈다는 것 자체가 매우매우 좋은 경험이였다. 특히 예매파트를 맡으면서 책임감이 중요하다는 것을 알게 되었다. 내가 모른다고 손을 놔버리면 예매와 관련한 형들의 직무파트와 연결된 부분이 이어지지 않았기 때문에 시간안에 적절하게 프로젝트가 실행되어야 한다는 것도 알게 되었다. 물론 개인 프로젝트였다면 나혼자 고민을 하며 만들어도 상관없지만 요즘 트렌드인 개발의 대부분은 팀단위로 이루어져 있기 때문에 많은 경험이 된 것같다. 취업할때 까지 지금까지 만들었던 메가박스 프로젝트에 대한 세세한 코드리뷰를 통해 온전히 내것으로 만들어 볼 예정이다.
'MegaBoxProject' 카테고리의 다른 글
| TeamProject Code Review 2 (0) | 2023.03.02 |
|---|---|
| TeamProject Code Review 1 (0) | 2023.02.25 |
