[algo-with-me] 네이버 부스트캠프 그룹프로젝트 시작 (1)

저는 네이버 부스트캠프 8기에 참가한 캠퍼입니다. 그룹프로젝트는 부스트캠프의 마지막 커리큘럼으로 팀을 구성해 6주간 주제선정부터 기획, 디자인, 서버 환경 구축, 개발까지 모두 완료하는 것이 목표입니다. 그 과정에서 의식적으로 성장해 나가기 위해 그룹 프로젝트의 주제보다는 의사소통, 선택의 이유, 더 깊은 학습, 문서작업등의 역량을 높이는데 집중해보려고 합니다.

글쓰기가 서툴러 충분히 기록하고, 전달할 수 있을지 모르겠지만 최선을 다해보겠습니다. 이 시리즈는 algo-with-me 프로젝트를 진행하는 모든 과정을 기록할 예정입니다.

레포지토리 구경오세요~ https://github.com/boostcampwm2023/web12-algo-with-me/tree/main

 

이번 포스트에서는 그룹 프로젝트 정식 시작전까지 했던 일들을 주로 담았습니다. (흐름상 진행중 했던 내용도 일부 들어있습니다.)

 

팀매칭

네이버 부스트캠프 8기 기준 팀 매칭은 기본적으로 백2명, 프론트/ios/android 중 1택 3명입니다. 직접 팀을 꾸릴 수 있고, 랜덤으로 남은 사람들끼리 매칭해줄 수 있다고 했는데, 저를 포함해서 다들 열정 1000%인지라 제가 알기로 거의다 직접 팀을 꾸렸습니다.

저희조는 결과적으로 백2/프론트3명으로 팀 매칭이 완료되었습니다. 모각코에서 만난 프론트 캠퍼 한분, 직접 연락해서 백엔드 캠퍼 한분은 직접 구했고, 다른 백엔드 캠퍼분이 한 프론트 캠퍼분에게 연락했고, 그 프론트 캠퍼분은 또 다른 프론트 캠퍼분과 같이 진행할 예정이였어서 그 분까지 같이 하기로 결정했습니다. 약간의 우여곡절이 있었지만 이렇게 총 5명의 팀원이 정해지게 되었습니다. 모두 초고수

앞으로 캐릭터 이름으로 부르겠습니다 ㅋㅋ

프론트 - 무지, 콘, 네오

백 - 저(제이지), 프로도

주제선정

팀 매칭 이전부터 프론트 두분이 코딩테스트 관련한 주제를 하려고 하셨고, 다른 모든 팀원 분들이 그것에 대해 동의하고 재밋을것 같다고 생각해 핵심 주제는 빠르게 정해졌습니다.

한줄로 설명해 보자면,

누구나 참여하고 개최할 수 있는 알고리즘 대회서비스 입니다.

창의적이고 참신한 주제는 아니지만, 부스트캠프에서 강조하는 기술적 도전을 해볼수 있는 부분이 많고, 재미있는 주제라고 생각해서 이런 방향으로 가닥을 잡았습니다.

주제 선정 과정에서, 과연 이 프로젝트로 프론트, 백엔드 모두가 충분히 도전해 볼만하다고 생각할 정도로 난이도가 높냐에 대해 많은 의견이 오갔고 초반만 해도 너무 난이도가 낮고 깊이있게 해볼게 적지 않나? 라는 의견이 많아 라이브 쉐어, 페어프로그래밍, 에디터 직접 구현 등 주제를 바꾸거나 난이도를 높이는 방법에 대해 많은 의논을 했습니다. 또, 다른 팀들 중에 알고리즘과 관련된 서비스를 기획한 팀이 많아서 주제 변경에 대한 의논이 깊어졌는데, 결국 그대로 가기로 결정했습니다. 이런 결정을 한 데에는 다음과 같은 이유가 있었습니다.

 

1. 기획 등을 하면서 느끼게 되었는데, 충분히 6주안에 하기 빡빡할 정도로 난이도가 적당히 높다.

2. 6주 이후에도 확장할 요소가 많다. ex) 의논 된 얘기중 1대1매칭 대결 서비스, 에디터 직접 개발, 사용 언어 개수 확대 등

3. 비슷한 주제를 갖는 팀이 있지만, 완전히 같은 팀은 없고, 또 같더라도 우리 목표는 창업, 수익화가 아닌 "학습"에 있다.

4. 이미 이 주제에 대한 이야기로 많은 시간을 사용했고, 윤곽이 많이 잡힌 상태다. (이건 이유가 약하긴 합니다.)

5. 재미있어보인다.

 

그룹 프로젝트 정식 시작일이 2023년11월6일 이었는데, 그 전부터 주제선정에 대한 회의를 꾸준히 했습니다. 이렇게 주제선정 과정에서 정말 많은 이야기를 나눴고 위와같은 이유로 모두의 동의로 확정하게 되었습니다.

시작전 회의들

 

기획

콘님이 경험이 있으셔서 기획하는데 다양한 관점으로 생각해볼수 있었습니다. 처음 하늘에 떠있는 구름처럼 모호했던 그저 코딩테스트화면 만들기에 불과하던 주제를 아이디어 회의를 통해 알고리즘 대회로 구체화해 나갔습니다. 그 과정에서 이야기 했던 다른 주제로는 대회가 아닌 프로그래머스 처럼 그냥 코딩테스트 형식으로 만들지, 혹은 진짜 기업 코테처럼 만들지 등에 대한 이야기를 했습니다.

주제를 선정한 이후 시나리오를 아래와 같이 작성해 보았습니다. 초기 시나리오 구성입니다.

 

로그인을 한다.

첫 화면에 접속하면 게시판이 보인다.

유저는 대회를 생성하거나, 참여할 수 있다.

• 대회를 생성하는 버튼이 있고, 클릭하면 대회 생성 페이지로 넘어간다.
• 대회 이름, 시작 시간, 접수 마감 시간, 기간, 대회 설명등 메타 데이터를 저장할 수 있다.
• 문제는 서버에 미리 저장된 문제들이 있고 그 중 선택해서 문제집을 구성할 수 있다.
• 확인 버튼을 눌러 대회를 생성하면 게시판에 대회가 추가된다.

대회 게시판에 생성된 대회를 클릭하면 대회 설명 페이지로 이동한다.

• 대회 내부의 참여 버튼을 클릭해 참여 상태로 만든다.
• 내 페이지에서 참여중인 대회를 확인할 수 있다.
• 대회 참여를 취소할 수 있다.
• 마감 시간을 넘겼다면 대회 참여 신청을 할 수 없다.

대회 시간이 되면 대회에 참여한다.

• 문제를 풀고 제출하면 채점 결과를 확인할 수 있다.
• 같은 코드를 제출하면 캐시된 결과를 확인한다.
• 테스트 코드를 입력하고 클라이언트에서 확인할 수 있다.
• 코드를 제출하면 대시보드에서 전체 채점 현황을 확인할 수 있다.
• 대회를 껐다 다시 들어오면 마지막으로 제출한 코드를 불러온다.

 

또한 누가 사용할 것인가? 즉 페르소나를 지정해 보았습니다. (페르소나에 관한 설명은 맨 하단 참고 부분을 참고해주세요!) 저희 주 목표가 학습이지만 서비스적인 측면을 완전히 버리는 것은 아니었기 때문에 짧게 이야기를 나눴습니다.

1. 부스트캠프 캠퍼 분들

2. 알고리즘 스터디 동아리 등에서

3. 코테와 비슷한 환경에서 연습하고 싶은 사람

4. 그냥 개발자

 

우리는 이런 사람들에게 대회를 만들고 풀어볼 수 있는 서비스를 제공하는것을 목표로 했습니다.

 

부스트캠프에서 클로버 사용을 권장하였지만, 적용할 곳을 찾지 못했고, 추가할 경우 6주안에 구현이 힘들다고 판단해 우선순위를 미루었습니다.

 

개발에 관해서

어느정도 시나리오를 작성하고 기획이 된 이후 뭘 어떻게 개발할지 큰 그림에 대한 이야기를 나누었습니다. 우선 핵심 기능을 정했습니다.

우리의 핵심기능은

사용자가 코드를 제출하면 채점하고 그 채점 결과를 사용자에게 보여주는 것

입니다.

이에 관해 그럼 채점은 어디서 하는가? 에 대한 이야기를 했습니다. 프로그래머스를 보면, 사용자가 확인하고 추가할 수 있는 2~3개의 테스트 케이스가 있습니다. 그리고 사용자가 확인 할 수없는 테스트 케이스가 수십개 주어지고 각각의 채점 결과를 반환해 줍니다. 우리는 사용자가 확인하고 추가할 수 있는 테스트 케이스는 프론트에서, 확인 할수 없는 테스트 케이스는 백엔드에서 채점하기로 결정했습니다. 그 이유는 다음과 같습니다.

 

1. 프론트의 기술적 도전중 하나.

2. 빈약한 서버의 부담을 조금이라도 줄여보려고.

 

가장큰 이유는 1번이었습니다. 이렇게 분리된 채점을 구성하게 되면 채점 환경이 바뀌어 결과가 달라질 가능성이 있는데 이를 최소화 하는게 중요하다고 생각됩니다.

 

be에서 채점 과정을 어떤식으로 구현해야 할지 논의를 해보았습니다.

우선, 들어온 요청 순으로 처리하기 위해 queue가 필요하다고 생각했습니다. 또한 동일한 채점 환경을 구성하고 제출한 코드에 문제가 있을 경우를 대비해서 사용자가 제출한 코드가 실행되는 환경을 위해 도커나 seccomp를 사용하기로 결정했습니다. 더 자세하게 쓰고 싶지만 구체적인 아키텍처는 다음 포스팅에서 다룰 예정입니다! 궁금하면 다음 포스팅을 기대해 주세요!

 

팀명과 프로젝트명 지정

우리의 목표와 서비스의 목표를 보여주기 위해 가장 중요하다고 생각되는 부분이었습니다. 일단 다 던져보고 괜찮은 것들을 추려 투표로 결정했습니다.

아래는 팀명 후보였습니다. 굉장히 많죠 프로도님께서 이유까지 달아서 굉장히 많이 던져주셨습니다. (근데 하나도 선택이 안된 슬픈 스토리)

 

• challengers
• temp
• null
• code temp
• undefined
• Error
• Promise
• localhost
• return
• console.log
• Uncaught ReferenceError: teamName is not defined
• anonymous
• Event Loop
• 크롱과 호눅스의 하수인들
• 엄마 나는 자라서 호눅스가 될래 (아부를 떨어서 조금이라도 긍정적인 평가를 받도록 함)
• KYJLL (키즐, 각자 이름의 성씨 앞글자를 따서 만듦)
• 프로그래머스 (프로그래머스 사이트)
• IEEE (지금은 I 성향이지만 E가 되고 싶다는 염원을 담음)
• 비비고 소고기장터국 (아무 의미 없음)
• 타코와사비 (아무 의미 없음)
• IlII1lliIliI11IIl (바코드)
• 어 이게 왜 되지 (아무튼 실행이 잘 됨)
• Javascript === Java (킹받게 하려고 이름 지음)
• GDP (Greedy Dynamic Programming) (알고리즘 서비스라서 이렇게 이름을 지음. 뭔가 GDP로 약자가 만들어지면 좋을 것 같아서 greedy와 DP를 합쳐버림)
• O(n^n) (어떻게 해야 이렇게 짤 수 있지 하는 경외감을 불러일으킴)
• O(1) (hash table을 보는 것 같은 명료하고 깔끔한 느낌)
• while (true) (if (kakao)에서 영감을 얻음. 우리의 성장은 계속 이어진다는 의미를 암시)
• FB (Frontend와 backend가 조화를 이루며 우리는 언제라도 facebook(FB)에 들어갈 수 있다는 자신감을 내포)
• 코틀린 장인들 (안드로이드 캠퍼들을 자극하기 위한 목적)
• 그대들은 어떻게 코딩할 것인가 (인기 얻어타기)
• sudo (내 인생의 주체는 나라는 사실을 일깨우는 한 마디)
• merge conflict (앞으로 화나는 일들이 있을 것임을 다시한번 상기시킴)
• git merge (프론트엔드와 백엔드가 서로 융화되어 성공적으로 프로젝트를 마치는 모습을 연상시킴)
• MDN (Michin Developer No.1)
• jest (Javascript Elegant Specialist Team)
• S1B4L (팀원들이 부산(B)에 1명, 서울쪽(S)에 4명 있다는 사실을 알려주면서, 욕을 하고 싶은 마음을 투영(sibal))
• 성북구 불주먹 (성북구는 내 나와바리임을 확실히 함)
• I들 (idle)

 

치열한 토론 끝에 challengers가 선정되었으나 나중에 팀원중 한명이 (누가 말했더라..?) 코드 사피엔스를 말하고 바로 교체되어 결국 팀명은 코드 사피엔스가 되었습니다.

 

프로젝트 명은 3개가 후보군에 있었습니다.

 

천하제일코딩대회 (천코) # 드래곤볼 패러디

스트리트 코드파이터 # 스트리트 파이터즈 패러디

algo with me (알고있니?)

 

천코와 algo with me가 치열한 접전 끝에  algo with me 로 결정되었습니다.

주제를 드러내는 데에는 천코가 더 좋지만, algo with me가 더 부드럽고 이쁘게 만들수 있다고 생각되어 3대2로 승리했습니다. (제 아이디어 였습니다 하하)

팀원분(콘님)이 이쁜 로고를 생성해 가져오셨습니다. 너무 귀엽네요.

 

소감

그룹 프로젝트 본격 시작 전까지 했던 내용들을 적어보았습니다. 상당히 뒤죽박죽인데 잘 쓴건지 모르겠네요 하하.

콘님이 프로젝트 경험이 있으셨어서 해야할 일들을 정리해주시고 주제를 던져주신 덕분에 많은 이야기를 할 수 있었고 그 속에서 누구하나 빠짐없이 정말 적극적으로 참여해 주셨습니다. 재밌어서 그런지 회의하면서 시간이 굉장히 빨리간다고 느꼈습니다. 앞으로 6주가 더욱 기대되네요.

 

---

참고

페르소나

https://yozm.wishket.com/magazine/detail/87/