- 지난 이야기
좌석 선택도 끝나서 마지막 4개의 페이지만 남았다. 하지만 또 큰 난관에 부딪히게 되는데..
결제 페이지로 이동
결제 페이지도 3개의 레이아웃으로 구분하여 정보, 수단, 결제로 나누었다. 예매 정보는 redux에 저장된 현재 예매중인 정보를 가져와서 보여주고 좌석의 경우 check라는 타입을 줌으로 지정한 좌석만 붉게 나올 수 있도록 해줬다. 포인트나 결제의 경우 api를 연동하지 않았기 때문에 돈을 내는 과정 없이 바로 예매가 된다.
물론 티켓을 문자로 받는 기능도 구현되지 않아서 버튼만 존재하는 상태이다. 이 상태로 홈으로 돌아가기를 누르면 메인 페이지로 이동이된다. 이렇게 영화 선택, 예매, 결제까지 큰 flow 하나는 마무리가 되었다.
잠깐 마음을 놓으려던 그때, 팀원이 말하길 '제 페이지에서 사용할 정보를 승일님 서버에서 줬으면 해요. api에서 받아오는게 불안정하네요.' 동공지진
왜 그럴까 나한테, 난 백엔드 개발자가 아닌데, 자꾸 아니다 이런 생각하면 안된다. 내가 맡은 파트니까 책임지고 해야한다. 일단 필요한게 무엇인지, 왜 필요한지 물어봤다. 롯데시네마에서 제공하는 데이터를 open API에서 제공해주지 않는 다는 게 문제였다. 어느 데이터는 openAPI 어드 데이터는 내 DB에서 가져오려니 이분도 많이 헷깔리겠다.. 팀원에게 필요한 정보를 준비해서 보내달라고 하고 받은 정보를 DB에 추가해줬다.
이렇게 메인으로 백엔드를 하는게 아니지만, 백엔드의 역할을 하면서 백엔드 개발자들의 심정을 조금 이해할 수 있게 된것 같다. 그래도 난 이 프로젝트에서 둘 다하지만 근본이 프론트 엔드니까 프론트 엔드가 바라는 백엔드 개발자의 마인드를 가지기로 다짐했다. 프론트를 배려하는 마음으로 꼼꼼하게 API사용법을 기술하였다.
영화 시간표 페이지
이제 마지막 2개의 페이지가 남았다. 바로 영화 시간표이다.영화 시간표 페이지는 영화관별 시간표와 영화별 시간표로 구성 되었다.
앞의 페이지는 기존의 컴포넌트를 재활용하여 만들 수 있었으나. 뒤의 페이지가 문제였다. 기존의 예매 정보를 보여주는 페이지의 데이터 구조는 영화:예매 정보였으나, 영화별 상영 시간표에서는 영화관:예매정보 식의 구조로 보여줘야했다. 고민하면서 구글링을 하던 도중 객체를 교집합이 되는 키로 묶어 주는 라이브러리가 없을 까 찾아봤더니, 역시 존재했다. deepMarge라는 라이브러리였다.
이 라이브버리의 도움으로 [{영화제목: [예매정보]}] 의 구조의 데이터를 [{영화관:[예매정보]}] 구조로 바꿔줌으로 마지막 페이지를 완성 할 수 있었다.
마무리
1달이라는 시간, 기획을 빼면 3주라는 시간이 길어보였지만, 많은 작업을 하면서 정말 짧은 시간이었다고 느꼈다. 각자 파트에 매진하게 되어서 코드 리뷰도 진행하지 못했고, 조금 더 부드러운 애니메이션이나 화면 전환안내 등의 UX적인 부분에서 너무 아쉬운 프로젝트였다. 무엇보다 체이지의 성능측정을 제대로 하지 못함에 있어서 로딩이 느리다는 점이 가장 큰 문제였다.
heroku의 서비스의 특징인 서버가 꺼지고 최초 접근시 서버가 켜지는 시간이 느리다는 점도 있었지만. 우리의 생각이 거기까지 미치지 못했다는 건 사실이다. 코드를 짬에 있어서도 구현에 급해서 더 좋은 코드를 짜지 못했고, 되는 대로 짠 것 같았다. 내가 팀장으로서 시간 관리나 진행 관리를 제대로 못했기 때문에 일어난 일이라 반성한다.
하지만 각자의 자리에서 자신의 역할을 성실히 임해준 팀원들에게 너무 고맙다. 나도 프로젝트 진행에 코드를 짜는 많은 고민들, 구글링한 시간들이 영양분이 풍부한 밑 거름이 된 느낌이었다. 꼭 레벨이 올르는 게 다가 아니라 조금이라도 경험치가 오른 기분이랄까.
프로젝트 마지막날 학원 사람들앞에서 발표를 진행하고 우리 페이지를 직접 시연하였다. 뿌듯했다. 학원에 처음 들어왔을 때, 아무것도 모르던 내가 이젠 기획, 디자인(조금), 웹 제작, 서버, DB, 배포를 통해 처음으로 만든 페이지.. 많은 애정이 간다.
이렇게 우리가 0에서 부터 배포까지 진행했던 프로젝트는 끝이 났다. 이 이상의 배포는 없을 것 이다. 하지만 각자 개인 깃 허브 레포에서 어때 시네마를 자신의 입맛대로 리팩토링 해 나갈 것이다. 현 시점에서 나의 어때 시네마는 홈 페이지 로딩시 gif를 보여주며 로딩중이라 알려주고, 모달창의 외부를 클릭하면 꺼지는 등의 기능을 추가하고 있다.
프로젝트를 통해 프론트 엔드 개발자로 취업 할 때 까지 나도 할 수 있다 라는 자신감을 얻을 수 있었고, 더 열심히 해서 오늘보다 더 나은 개발자가 되는 걸 목표로 공부하고 달려야겠다.
