지난 7월 25일 길고 길었던 2월 14일부터 시작된 110일 간의 여정이 끝났다.
수료하자마자 8월은 코드의 “코”도 보기가 싫어서 신나게 쉬었다.
는 내 바램이고, 사실 2주 정도 여행도 가고 쉴 생각이었는데, 여행 대비해서 백신 맞은지 2일만에 코로나에 걸려버렸다. 후유증이 꽤 심해서 8월 나머지 기간은 운동도 못하고 방에서 약만 먹은 것 같다.
그래서 8월이 하루 남은 오늘 드디어 미루고 미뤘던 “파이널 프로젝트” 회고를 한다. (이 글이 누군가에게 도움이 되길 바라며)
세미가 끝난 당일 같이 수업을 듣는 분으로부터 함께하자는 제의가 왔다. 파이널까지 한 달 정도 남아서, 팀 만들 생각도 없었는데 다른 분들은 미리 사람들을 모았다. 다행히 그 덕분에 같이 할 사람 구하는 수고는 줄였다.
함께 프로젝트를 하는 분들은 반에서 실력으로 날아다니시는 분들이었다. 물론 나도 날아다니긴 했지만, 세미 때 아쉬움을 충분히 극복할 수 있겠다 싶어 뒤도 안 돌아보고 덥썩 물어버렸다.
다행히 팀원분들은 모두 좋은 분들이었다. 일단 서로 실력이 뒷받침되기 때문에 홀로 고독하게 문제를 해결하지 않고 공유하면서 프로젝트를 진행해나갔다.
프로젝트 설계는 팀이 만들어지고 4일 뒤부터 바로 시작한 것 같다. 일단 협업툴로 디스코드, 노션, 미로(Miro), Exerd를 사용했다.
디스코드는 비대면 상황이 많으니 회의 용도로 사용했고, 회의 과정에서 만들어지는 서류들은 노션으로 공유하여 작성하였다.
거의 일주일 가량 6시간씩 회의를 해서 최종 채택된 아이디어는 공유 경제를 기반한 “재능 공유 플랫폼”이었다.
사실 클래스101, 숨고를 조합한 사이트가 솔직한 표현이다. 이번 프로젝트에서 나는 회원가입-소셜 로그인 기능, 고객센터 페이지를 담당했다.
다른 분들은 모르겠지만, 장고로 웹 서비스를 만들어봤던 나는 기존에 JSP를 가지고 주먹구구식으로 사이트를 만드는 것에 불만이 많았다. 그래서 파이널에선 좀 더 “유지 보수”가 편리한 코드를 짜보고 싶었다.
이러한 연유로 전체 사이트의 Header, Footer를 <jsp:include page="<%=variable%>" flush="true"/>
를 사용해서 모듈화하였다. 이걸 모듈화라고 표현하는 것도 우습긴 하지만 세미 때 경험으로 비춰볼 때는 장족의 발전이었다.
로그인, 회원가입 페이지를 따로 만들지 않고, Ajax를 이용하여 부트스트랩 모달창에서 기능이 동작되도록 구현하였다.
내 파트의 핵심은 카카오 API, 네이버 로그인 API였다. 사실 프로그래밍을 시작하면서부터 API는 나를 괴롭히던 개념이었고, 한번쯤은 직접 몸소 경험하고 싶었다. 그래서 파이널에는 내가 API를 적용시켜보겠다고 했다.
이 과정에서 API의 개념은 좀 더 공부할 수 있었다. 그동안 나를 괴롭히던 건 Http API가 아니였단 사실과 함께 막상 만들어진 문서를 읽으면서 API를 쓴다는게 꽤 재밌는 일이라는 것과 API 문서의 중요성을 알게 되었다. 특히 정말 쉽게 써주신 카카오에게 감사의 말씀을 전하고 싶다.
무튼 카카오 로그인 API는 프론트 단에서 SDK를 통해서 쉽게 동작할 수 있도록 만들었다. 그래서 네이버도 쉬울 줄 알았는데, 막상 네이버는 자바스크립트로 프론트 단에서 API를 사용하기 어려워서 포기했다.
그래서 돌고 돌아 결국 구글 API로 갔는데, 여기는 또 문제가 세미 때까지 지원되던 기능이 파이널 기간에는 전부 변경되었다는 것이다! 두둥....결국 눈물을 흘렸지만, 기존에 구현하신 분들에게 여쭤봐서, JWT를 통해서 구현했다. (웬만하면 서버 쪽에서 만지기 싫었는데, 구글은 그래야 하더라..)
그래도! JWT를 공부하는 좋은 기회가 되었다. 물론 실제 배포 시에 구글은 테스트용만 지원해줘서 난항을 겪었지만 프로젝트 용도로 쓰지마여...골치 아파
사실 고객센터는 단순한 게시판 CRUD 구현이었다. 대댓글 기능은 넣지도 않았고, 간단한 프론트 페이지랑 그 외에 1대1 문의, 공지사항 작성 정도로 구현했다. 앞에서 시간을 많이 소요했다보니 이 파트에는 그다지 큰 시간을 투자하지 못한게 아쉽다.
하지만 한 가지 배운 점은 글 작성 시, input을 <div contenteditable="true">
로 만들어 정보를 submit
이벤트 시, <input type="hiden">
으로 옮겨 DB에 넣는 방식으로 구현했는데 이때, XSS(Cross-Site Scripting) 공격에 대한 취약점이 발견됐다.
말 그대로 입력창에 스크립트를 넣으면 그게 그대로 적용되는 것이었다. 이는 프로젝트 후반부에 테스트 케이스를 만들면서 발견된 부분인데, 이 부분을 보완하기 위해서 JSTL의 <c:out>
을 이용하여 프론트에 출력되도록 하였다.
이 과정에서 내가 만든 기능이 가지는 '보안 취약성'을 직접 눈으로 확인하게 되었고, 애초에 설계 과정에서 기능 구현이 우선순위가 아닌, 사용자와 서비스 제공자 모두에게 '안전한 서비스'를 만들기 위해 보안을 공부해야되겠다고 다짐했다.
프로젝트를 마무리하면서 발표 3일 전부터는 테스트를 거쳤다. 각 조별로 버그나 아쉬운 점을 피드백하는 ‘크로스 체킹’ 시간을 강사님이 마련해줬는데, 우리 조만 참여하고 다른 조들은 참여하지 않는다고 해서 팀원들끼리 테스트 케이스를 만들어 점검했다.
이왕 만든 거 시연을 영상으로 만드는 게 좋을 것 같아 직접 만들었다.
사실 이 글의 본제는 “아쉬운 점”이다. 프로젝트 자체보다는 국비 학원 과정 자체에 대한 아쉬운 점이었다.
세미 후, 파이널까지는 길면 4주 정도의 시간을 준다. 워킹데이로는 겨우 20일 정도.
근데 이 기간에 스프링 + Mybatis + 단위테스트 이렇게 세 가지를 학습한다. 그래서 Mybatis 2일, 단위테스트 1일, 스프링 프레임워크 10일 정도? 나머지는 나라에서 부여한 시험을 보는 날이 제외된다.
그 과정도 JSP로 만들었던 게시판 CRUD를 스프링으로 만드는 것이다. 설치만 하루를 쓴다.
물론 기존에 만든 게시판을 스프링으로 만드는 것이 좋은 학습 방법이겠지만 이 과정에서 쓰는 어노테이션도 끽해야 7개 정도, 사실 스프링 프레임워크 자체를 이해하는 시간은 주어지지 않는다.
강사님도 아무것도 모르는 우리가 실무자를 따라가기 위해 스프링의 힘을 빌리는 과정이라고 설명하신다. 그래서 DI, IOC, AOP(하지도 않음), Soild 같은 스프링의 근본을 배울 순 없다.
이건 전부 다 수강생 본인의 역량이다. 혼자 유튜브에서 강의를 찾아 들어야 한다. 그래서 나는 DI, IOC를 위해 김영한님과 뉴렉처 유튜브를 계속 봤다.
스프링 기반 프로젝트인데, 그 원리를 이해하고 있지 않으니 파이널 프로젝트에서 스프링의 역할은 그냥 조립해주는 기계에 불과하다. (뭐 그렇긴 하지만 나는 좀 더 깊게 쓰고 싶었다.)
스프링 시큐리티 같은 건 구경도 못했다. 물론 스프링 MVC를 이해하는 좋은 기회이긴 했지만, 스프링을 이해하고 쓰기보단 알려준 거 그대로 기능 구현만 목적으로 코드를 짜는 프로젝트였다.
그 결과, 유지 보수는 어려워졌다. 각 객체 간의 의존성은 꼬일대로 꼬였고, 디자인 패턴은 거의 개무시했다. 그냥 있는 거 그대로 쓰는 정도... 그런 점에서 개발자로서 설계 단계에서 오류가 있었고, 이를 극복하지 못했다는게 아쉽다.
또 나의 경우 로그인 기능을 구현했는데, 막상 보니 암호화 된 비밀번호를 DB랑 대조해서 맞으면 그게 “로그인?” 기능이라 하는 것도 웃겼다. 그래서 찾아보니 이 기능에도 “인증과 인가”라는 개념이 존재했다.
돌아보니 세션으로 구현한 “인가”는 엔터프라이즈 급에서는 서버 부하와 로드 밸런싱의 한계가 있었다. 만약 시간이 좀 더 주어졌다면, 이런 부분까지 고려해서 JWT로 한번 구현해보는 것도 좋았을 텐데 라는 아쉬움이 남는다.
백엔드가 탄탄하지 않으니, 결국 투자하는 건, 스프링이 아니라 프론트다. 우리 팀도 프론트 페이지를 구현하느라 총 4주 동안 3주 이상을 허비하였다.
나도 하면서 백엔드 만지는 시간보다 프론트가 더 오래 걸리더라. 물론 포토폴리오로 쓰기 위해서 이쁘고 세련되게 꾸미는 것도 좋지만, 막상 SQL쿼리부터 백엔드 로직이 엉망이었단 걸 생각하면 이걸 백엔드 포폴로 쓸 수 있을까 라는 고민이 든다.
무튼 5.5개월의 국비 과정이 끝났다. 비대면이라 많이 친해지지 않았지만, 그래도 좋은 사람들과 함께 공부했고, 좋은 강사님을 만난 건 다행이라고 생각한다.
또 국비 과정을 통해서 웹 개발이라는 가장 큰 구조를 배웠다고 생각한다. 이제 취업 준비를 위한 준비가 끝났으니, 취업을 위해 달려보자.