logo
Published on

테오의 프론트엔드 구글스프린트 3기 체험기 - (feat.개발자를 위한 타자게임)

Authors
  • avatar
    Name
    Bora Choi
    Twitter

최근 velog 트랜드에서 시니어 프론트엔드 개발자 테오가 운영하는 스프린트 1기,2기 참여자들의 후기를 보고 "나도 참여해보고싶다"라는 생각을 했는데, 기회가 생겨서 구글 스프린트 3기에 참여하게되었다.

기획부터 개발까지 5일 + 회고시간 1일 총 6일간 구글 스프린트를 진행했다.

1일차. Team Canvas
2일차. Map
3일차. Sketch & Decide
4일차. Develop
5일차. Develop
6일차. Test & Retrospect

짧고 굵었던 일정 ㅎㅎ

먼저 5일동안 어떤 결과물을 만들었을까 ?!

결과물 공개

TYPO SAURUS CODE

개발자의, 개발자에 의한, 개발자를 위한 타자연습 게임
공룡을 피해 완주하세요!

게임하러가기🎮 (모바일은 지원하지않아요 🥲)

og

이번 스프린트에서 만든 서비스는 타이포사우루스코드!!
개발하다 지쳤을때 개발자스럽게 쉬는 방법은 없을까 ? 를 고민하면서 만든 타자게임이다. 결과물이 완성되기까지 수많은 과정들이 있었는데 전체적인 스프린트의 내용은 1기,2기와 비슷하여 타이포사우루스코드를 만들면서 느낀점에 대해서 이야기해보려한다.🙌

의사결정 및 소통

궁극적 목표 설정

짧은 기간동안 이루어졌던 만큼 단시간에 많은 의사결정을 했야했다. 스프린트 둘째날에 설정한 우리 아이디어의 궁극적인 목표를 기준으로 의사결정을 했다. 많은 인원이었음에도 불구하고 모두가 납득할 수있는 방향으로 구체적인 아이디어가 정해질 수 있었고 컨텍스트 공유, 공통 가치(목표)의 중요성을 깨달았다!

궁극적목표

(우리들의 궁극적 목표였던 "재미" 와 "개발자스러움")

게임방식

(가장 중요한 부분이었던 게임 방식에 대해서 논의 중 ...)

칸반보드

개발을 진행하면서 서로 작업시간이 불규칙하기때문에 칸반보드를 활용했다.👀 또한 일의 중요도를 정해서 우선순위를 함께 표시했다. 칸반보드를 활용하니 작업진행률뿐만아니라 작업의 우선 순위를 파악하기 쉬워 인원 배치라던지 기능 구현 순서 결정에도 도움이 됐다!

칸반

(우리의 모든 todo가 끝났다~ 짝짝짝👏👏👏)

짝프로그래밍

처음으로하는 짝프로그래밍이라 걱정되기도 했는데 결과적으로 너무 너~~무 좋은 경험이었다!

문제해결에 있어 짝꿍과 함께 고민면서 더 나은 코드를 작성할 수 있었다.
화면에 보이는 내용은 같더라도 로직방식이나 코드 스타일은 서로 다를 수 있는데 페어프로그래밍을 하면서 보다 나은 로직을 함께 생각하거나 서로의 스타일을 배울수 있었다. 그리고 짝에게 새로운 것을 배우거나, 짝이 모르는 기술적인 부분을 설명하면서 스스로도 공부가 되었다.

페어프로그래밍

(저의 페어였던 민민 그리고 사진찍기위해 자리를 잠깐 비켜준 곤이, 해달, 테오 ㅋㅋㅋ)

기술적인 부분

css 애니메이션

이번 스프린트 경험에서 기술적으로 새롭게 알게된건 css 애니메이션이 아닐까싶다. 사실 css 공포증이 있었는데 스프린트를 통해 css 애니메이션애 대한 공포는 사라졌다.

하지만 마스터는 하지 못했다. 스프라이트를 통해 애니메이션을 구현했는데 공룡은 2프레임 개발자는 4프레임으로 프레임이 달라서 깜박임 수가 다른 문제가 발생했다. (아직도 존재 ....😐) keyframe의 퍼센테이지를 쪼개서background-position를 바꿔보려했는데 수학계산을 못하는건지 개발자가 흘러가는것 처럼 보여서 결국 이 이슈는 해결하지 못한채로 스프린트를 종료하게 되었다... 나중에라도 이부분은 꼭 수정해서 완벽한 피버타임을 구현하는것이 또다른 쟈근 목표...✨

피버타임

(초기 🦕공룡과 🧑‍💻개발자 개발자 깜박임과 공룡 깜박임 타이밍이 너무 아쉽다 ... 눈이 아프다는 의견이 있어 결국은 라이트모드로 구현 🥲)

vite를 처음 사용해봤다.

확실히 빌드 속도가 빨라서 놀랐다. 😮 처음에 config 세팅이 헤맸었는데 앞으로 사이드 프로젝트 할때 많이 사용할 것 같다! ㅋㅋㅋㅋ vite에 대해 흥미가 생겨서 더 알아보고싶다는 생각이 들었다!

setTimeOut은 완벽하게 시간 보장이 되지 않는다!

타이머함수의 두번째 매개변수는 태스크큐에 콜백함수를 등록할 최소시간만 보장할뿐 타이머가 만료되었을 때 즉시 호출되는 것은 아니어서 정확한 시간 기록을 위해서는 Date() 객체를 활용하는 편이 좋다는 것이었다.

마무으리~

이론으로만 배웠던 스프린트를 실제로 적용해볼 수 있었던 것만으로도 너무 귀중한 경험이었다! 좋은 인연을 만나고 배우는 것도 많았던 시간이었어서 스프린트참여에 망설이는 분들이라면 강력하게 참여하는 것을 추천한다 ㅎㅎㅎ

기회가 된다면 또 참여해보고싶다!

회고타임

(마지막 회고타임👏👏👏)

마지막으로 6일간 함께해준 혜심쓰, 곤이, 민민, 빈츠, 웹린이, , 해달 그리고 스프린트를 이끌어준 테오에게 너무너무 고맙습니다~~

크레딧

다른회고글 보러가기
테오의 스프린트 3기 by 테오
5일간 야생에서 더 살아남기(feat.테오의 스프린트 3기) by 빈츠