[우테코 6기] 우테코 프리코스 프론트 진행 후기

 

다음은 내가 6기 우아한 테크코스 프론트 프리코스를 진행하면서 배우고 얻은 점을 작성해 보았다. 

사실 변명 아닌 변명이라면,,, 17학점 +  동아리 +  캡스톤을 진행하면서 병행하기엔 꽤나 벅찬 일정이었다... 그래서 회고 중간중간 후회나 작성자를 이해 못 하는 코드나 과정이 섞여 있을 수 있다... 

 

 

1주 차 미션 - 숫자 야구 

 

첫 프리코스 미션이었다. 가장 먼저 제시된 readme를 꼼꼼히 읽었던 거 같다. 프리코스 미션은 기능 요구 사항, 프로그래밍 요구 사항, 과제 진행 요구 사항 세 가지로 구성되어 있었다. 모든 요구사항을 모두 이뤄내기 위해서 리드미 숙지는 필수였다.  

사실 숫자 야구 알고리즘 자체는 파이썬부터 C, Java 까지 모든 언어로 처음 프로그래밍 연습할 때 꼭 짜보는 알고리즘이라 알고리즘 구현에는 큰 어려움이 없었다. 하지만 가장 어려웠던 건 아무래도 를 javascript로 진행해야 한다는 점이 가장 큰 변수였던 거 같다. 

 

프론트엔드를 꿈꾸면서 자바스크립트가 아닌 언어로 코딩 테스트를 계속 봐왔던 건 조금 챙피한 일이지만,,, 어쩔 수 없다,, 누구에게나 처음은 있는 거 아닐까,,? 

 

그래서 나는 진행을 위해 JS로 클래스 선언 및 사용하는 법을 익히기 위해 이전 프리코스 참여자분들의 코드를 읽어보았던거 같다. 어떤 주제였고 이러한 알고리즘을 짤 때 이렇게 사용하셨나 등등을 코드 리뷰를 통해 파악한 후 시작했다.

 

 

 

 

처음에는 크게 클래스를 나누는 거 없이 기능 요구 사항에 적힌 것들을 위주로 해결하려고 노력했던 거 같다.

1차 미션 이후 받은 공동 피드백이나 받은 메일을 통해 1주차 미션의 목표는 git 컨벤션을 잘 지키는 것이 중요했던 포인트였던거 같다! 

 

자세한 미션 내용과 코드는  1주차 미션 수행 깃허브에서!

GitHub - healim01/javascript-baseball-6: 우테코 프리코스 1주차 ⚾️

 

 

---

 

 

2주 차 미션 - 자동차 경주

2주 차 미션에서는 1주 차에서 학습한 것에 더해 함수를 분리하고, 각 함수별로 테스트를 작성하는 것에 익숙해지는 것을 목표로 하고 있었다. 

이 주차는 변명처럼 들리겠지만 사실 변명이다,, 메일에 적힌 함수별 테스트 작성 파트를 까먹어서 2주차 코드는 좀 별로다,, 변명을 시작한 김에 계속하자면,, 이때 캡스톤 산학 기업과의 미팅 준비와 피드백 수용 등으로 정신이 없던 나머지 놓치는 실수를 한 거 같다,,, 너무 창피하니 안 보이게 적겠다,, 아무도 읽지 말아라 

 

함수를 분리하기 위해서 자동차 경주가 진행되는 방식을 단계로 분리하여 진행했다. 사용자에게 인풋을 입력 받는 함수, 게임 진행을 위해 차를 전진 혹은 정지시키는 함수, 지금까지 진행된 상황을 알려주는 함수, 최종 우승자를 알려주는 함수 단계로 진행했고, 입력받은 인풋값이 유효한지 체크하는 함수를 따로 작성해 주었다. 

 

그리고 이때 프리코스 커뮤티니에서 받은 코드 리뷰로 배우게된 Object.freeze() 메서드나 airbnb javascript 코드 컨벤션 등을 활용하여 보았다. 

코드리뷰는 정말 진행하면 할수록 도움이 되는 것 같다. 만약 누군가의 지적이 두려워서 혹은 나의 코드를 남들에게 보여주기 부끄러워서 진행하지 못한다면 하루빨리 함께 공유하는 것이 더 많은 걸 얻고 배울 수 있는 경로인 거 같다. 

 

 

자세한 미션 내용과 코드는  미션 수행 깃허브에서!

GitHub - healim01/javascript-racingcar-6: 우테코 프리코스 2주차 🏎️

 

 

---

 

 

 

3주차 미션 - 로또 

3주차 미션 목표는 클래스(객체)를 분리하는 연습과 도메인 로직 단위에 대한 단위 테스트를 작성하는 것이었다. 

이번 미션에서는 "JavaScript에서 객체를 만드는 다양한 방법을 이해하고 사용한다"라는 피드백을 떠올리며 클래스와 더불어 객체를 사용해 보는 방향으로 진행해 보았다.

이를 이해하기 위해 클래스와 객체가 정확히 뭔지 이해하고 차이점을 이해하려고 공부했다. 

 

그렇게 이해한 대로 로또 게임과 같이 진행되는 동안 동일한 진행 방식을 여러 번 생성해야 하는 것은 Class로, 그 한 번만 사용하게 되는 것들을 분리하여 진행해 보았다. 

 

특히 이번 주차에는 테스트 코드를 본격적으로 작성해보았다. 먼저 시작은 이미 멋진 개발자분들이 짜놓은 코드를 읽어보고 이해하는 것이 우선이었다. 테스트 코드를 처음 짜보는 것이라서 어떻게 작동하는지, 어디에 어떤 것을 넣어야 내가 원하는 테스트를 할 수 있는지 확인하면서 짜보았던 같다. 

 

 

자세한 미션 내용과 코드는 3주차 미션 수행 깃허브에서!

GitHub - healim01/javascript-lotto-6: 우테코 프리코스 3주차 💸

 

 

 

---

 

 

 

4주 차 미션 - 크리스마스 프로모션 

4주차 미션은 역시 마지막이라서 그런지 지금까지 나온 미션들을 모두 업그레이드해서 진행되는 것과 같았다. 일반적으로 상세히 주었던 기능 요구 사항이 아니라 이메일 형식으로 클라이언트가 정말 직접 요구사항을 말하는 것처럼 요구 사항이 주어졌고, 우리는 이 요구사항 메일에서 어떤 것들이 필수적으로 들어가야 하는지 판단하여 작업을 해야 했다. 

 

 

 

 

 

 

이러한 꽤나 긴 요구사항을 모두 충족하면서 특히 이번 주간에는 MVC 패턴으로 잘짜인 코드를 만들어보기 위해 노력했던 거 같다. 

 

 

이를 위해 가장 먼저 기능 구현 목록부터 작성하였는데 이번엔 MVC 패턴을 생각하면서 도메인과 뷰를 나누어서 작성해 보았다. 

 

이렇게 처음부터 나누어서 짜고 작성해보니 조금 더 각 역할에 대한 구분 이해가 되는 느낌을 받은 거 같다. 

 

 

패턴 구현을 위해 가장 먼저 view, model, controller로 나누어 각 기능에 맞는 것들만을 넣고 각각의 영역을 해치지 않으려고 노력했던 거 같다. 

 

또한 한번만 사용되거나 고유한 값을 가질 객체들은 클래스 선언을 하지 않고 짜보았다. 

 

 

 

또한 이번 프로모션의 키포인트인 중복 할인 처리를 번거롭게 하지 않게 하기 위해 객체 형태로 리턴하여 사용할 수 있게 해 보았다. 

 

 

또한 이번 미션에서도 지금까지 받은 코드리뷰 피드백을 수용하여 최대한 만들려고 노력해보았다. JS 문법에 익숙하지 않아 몰랐던 reduce 기능이나 이전에 배운 Object.freeze 같은 것들을 활용하였고, 고함수를 사용해 보려고 노력했던 마지막 미션이었던 거 같다. 

 

자세한 미션 내용과 코드는 4주차 미션 수행 깃허브에서!

GitHub - healim01/javascript-christmas-6-healim01: 우테코 프리코스 4주차 🎄

 

 

 

---

 

 

 

 

한 달 동안 우테코와 더불어 학교 생활, 랩실 생활에 졸업 준비까지 꽤나 바빴던 일정이었지만 안 했다면 후회했을 거 같을 정도로 많이 배우고 성장할 수 있었던 한 달이었던 거 같다. 정말 즐거웠다!