[우아한테크코스 FE 5기] 레벨1 자동차 경주 게임 미션 회고

Chex·2023년 2월 27일
0

우아한테크코스

목록 보기
6/19
post-thumbnail

🚘 자동차 경주 게임

📍 학습 목표

  • Github 기반으로 온라인 코드 리뷰
  • 코딩 컨벤션을 준수하며 개발
  • 단위 테스트를 작성하며 개발
  • 함수(또는 메서드)를 분리하는 리팩터링

🚀 기능 요구 사항

초간단 자동차 경주 게임을 구현한다.

  • 주어진 횟수 동안 n 대의 자동차는 전진 또는 멈출 수 있다.
  • 자동차에 이름을 부여할 수 있다. 전진하는 자동차를 출력할 때 자동차 이름을 같이 출력한다.
  • 자동차 이름은 쉼표(,)를 기준으로 구분하며 이름은 5자 이하만 가능하다.
  • 사용자는 몇 번의 이동을 할 것인지를 입력할 수 있어야 한다.
  • 전진하는 조건은 0에서 9 사이에서 무작위 값을 구한 후 무작위 값이 4 이상일 경우이다.
  • 자동차 경주 게임을 완료한 후 누가 우승했는지를 알려준다. 우승자는 한 명 이상일 수 있다.
  • 우승자가 여러 명일 경우 쉼표(,)를 이용하여 구분한다.
  • 사용자가 잘못된 입력 값을 작성한 경우 에러 메시지를 보여주고, 다시 입력할 수 있게 한다.

✅ 프로그래밍 요구사항

  • 코드 스타일 가이드에 따라 컨벤션을 준수하며 개발한다.
  • 변수 선언시 var를 사용하지 않는다. let, const를 사용한다.
  • 전역 변수를 만들지 않는다.
  • 축약하지 않는다.
  • 하드 코딩된 값 대신에 의미 있는 상수를 활용한다.
  • 동등 연산자는 === 로만 사용한다.
  • 함수(또는 메서드)의 길이가 10라인을 넘어가지 않도록 구현한다.
  • 함수(또는 메서드)가 한 가지 일만 하도록 만든다.
  • 함수(또는 메서드)의 들여쓰기 depth는 2단계까지만 허용한다.
  • 예를 들어 while문 안에 if문이 있으면 depth는 2단계 이다.
  • 힌트) 함수(또는 메서드) 분리는 들여쓰기 depth를 줄이는 좋은 방법이다.
  • else 예약어를 쓰지 않는다.
  • 도메인 로직과 UI 로직을 분리한다.
  • 모든 도메인 로직에 단위 테스트를 구현한다. (UI 로직은 제외)

🔗 관련 링크


🐾 기능목록

  • 자동차 이름을 입력받는 기능 - 뷰
    • 자동차 이름들 입력값 파싱 - 유틸함수
    • 자동차 데이터 저장하기 - 모델
    • (예외) 이름은 1 ~ 5글자 이하
    • (예외) 자동차 이름이 중복되는 경우
    • (예외) 자동차 이름이 한글(음절단위), 영어, 숫자가 아닌 경우
    • (예외) 잘못된 입력 시 재입력 받기
  • 시도 할 횟수 입력받기 - 뷰
    • (예외) 입력값이 숫자가 아닌 경우
    • (예외) 입력값이 0 이하인 경우
  • 0 ~ 9 랜덤 값 구하는 기능 - 유틸함수
  • 자동차 이동 여부 판단 기능 - 모델
  • 이동 결과 상태 저장 기능 - 모델
  • 이동 결과 출력 기능 - 뷰
  • 우승자 선별 기능 - 모델
  • 우승자 출력 기능 - 뷰
  • 게임 종료 기능 - 컨트롤러

📖 배운점

1. 테스트에 관하여

  • 테스트를 하는 이유?
    • 요구사항대로 잘 구현되었는지 확인하기 위해
    • 계속 변하는 요구사항에 대응하면서 동시에 안정적인 품질을 유지하기 위해
  • Production code vs Test code
    • Production code? ‘실제코드’ 즉, 테스트 대상이 되는 코드
    • Test code? 실제 코드와 별도 파일에 두고 프로덕션 코드를 테스트하는 코드
  • 무엇을 테스트하는가?
    • 정상 케이스
    • 예외 케이스
  • with Jest

2. 코드리뷰 요청에 관하여

나의 초라한 첫PR 메시지

https://user-images.githubusercontent.com/24777828/221586595-f08e4513-64d4-4339-83a3-84a177fa9ff5.png

어떤 작업을 했고 어떤 고민을 했는지 등의 내용이 없는.. 의미없는 PR메시지를 작성했고😂 첫 리뷰어인 티케에게 이에 대한 피드백을 받았다.

리뷰어(티케)에게 받은 피드백

https://user-images.githubusercontent.com/24777828/221587579-716e7add-0253-4c50-b720-17b37391aaf3.png

피드백을 받고 난 후 2단계 PR메시지

[2단계 - 자동차 경주 리팩터링] 첵스(최혜령) 미션 제출합니다. by HyeryongChoi · Pull Request #209 · woowacourse/javascript-racingcar

자동차 경주 피드백 강의에서 들었던 것처럼 이제 리뷰 요청을 할 때에는, 일방적인 채점 요청이 아니라 의미있는 소통의 장으로서 활용할 수 있도록 개발 의도를 드러내는 PR메시지를 작성하고 그것에 대한 셀프체크를 해봐야겠다!

셀프 체크

  • 내가 고민한 구체적인 맥락과 과정이 드러나 있는가?
  • 특정 방식, 기술을 선택하는 것에 대해 말할 때 왜 이렇게 생각하고 결정했는지 이유가 드러나 있는가?
  • 내 의견, 내가 이해한 내용에 대한 설명 없이 리뷰어의 답만을 요구하고 있지는 않은가?

3. 네이밍 관련 꿀팁

grep.app ? 네이밍이 어려울 때 사용해보면 좋다.
https://user-images.githubusercontent.com/24777828/221591318-9758ee0e-1758-4428-90ed-fc92a9cf28d6.png

✏️ 느낀점

티케가 피드백해준 내용 중에서 가장 기억에 남았던 부분은 함수 네이밍에서의 단수, 복수이다. 코드를 작성하면서 무심코 지나쳤던 부분인데 다음 미션에서는 좀더 꼼꼼히 봐야겠다고 생각했다. 단순, 복수라는 간단한 컨벤션으로 코드의 가독성이 확 좋아지기도, 나빠지기도 하기 때문이다!

그리고 class와 객체리터럴, 비동기 입력을 처리할 때 사용하는 callback, promise, async/await 등 어떤 것을 사용할지 그 이유는 뭔지에 대한 생각 없이 페어가 사용하니까 promise를 사용했는데 티케가 왜 사용하는지 그 이유가 무엇인지 물어봐준 덕분에 앞으로는 어떤 기술을 사용할 때 그 이유를 알고 써야겠다고 생각했다. 사실 자바스크립트 기본서도 읽고 유튜브도 봤지만 아직도 비동기 입력에 대해서는 완전히 이해를 못했다. 어려움은 낯섦에서 오는 것! 계속 보다보면 익숙해질 것이라 믿는다.

https://user-images.githubusercontent.com/24777828/221595829-53018d7e-0556-46d2-9355-566b8dd3f34f.JPG

사실 온보딩 미션에서 가장 고생했던 부분은 ‘페어와 헤어지기’ 단계부터였다.

woowacourse으로 통합(merge)된 이후 rebase하는 과정에서 뭔가 꼬여서 계속 에러가 났는데 알고보니 rebase하는 과정에서 충돌나는 부분들을 제대로 보지 못하고 git rebase —continue를 해버려서 문제가 생긴 것이었다. 다시 되돌리는 방법을 찾느라 애를 좀 썼다😂.. 그리고 git과 아직 어색한 사이라 잘못 건드렸다가 작업한 게 다 날아갈까봐 무서웠다.. 하지만 어찌저찌 git refloggit reset을 사용하여 해결했다. 지금은 충돌이 나지 않도록 하는 방법을 알았다. 아무 작업도 안한 깨끗한 main브랜치에서 내 이름으로 된 브랜치를 생성한 후 머지된 것을 rebase하면 충돌이 안나고, 그 후에 거기서 step2브랜치를 생성해주면 된다. 인간은 학습의 동물이라고.. 이제 똑같은 문제는 되풀이하지 않겠지?(인간은 망각의 동물이기도 해서 이 절차는 따로 적어두었다.)

우테코.. 1주차 정말 쉽지 않다. 그만큼 배우고 얻어가는 것도 많다.(특히 코드리뷰!)

근데 정말 쉽지않아-! 하지만 난 즐겁다. 즐겁다. 하나도 힘들지 않다고 나 자신을 세뇌시키는 중이다.(Fake it till you make it!) 근데 실제로도 재밌다. 체력적으로 힘든 것이지 과정 자체는 뿌듯하고 크루들과 함께해서 많이 웃는다. 회사 다닐 때보단 훨~씬 재밌다!

Be the best version of you!

profile
Fake It till you make It!

0개의 댓글

관련 채용 정보