COKOTHON 2022 참가 후기 (🏆 2위)

나의 두번째 해커톤이 끝났다.
이번 대회에서는 개인적으로 목표했던 것들을 내 힘으로 이뤄낸 것 같아서 좋았고,
무엇보다 수상이라는 가시적인 성과가 있어 기뻤다 🤑
준비 과정과 시행착오들을 복기하며 대회 후기를 기록해본다.

대회 소개

🔗 Notion 대회 공고

국민대학교 소프트웨어융합대학 학회 Koss와 숙명여자대학교 IT공학전공 학회 Code-it에서 개최한 해커톤이다.
2022년 12월 28일부터 국민대학교 미래관 자율주행스튜디오에서 무박 2일간 진행된다.
신청 대상은 아래 학과 소속 재학생으로 제한된다.

• 국민대학교 소프트웨어융합학부
• 숙명여자대학교 IT공학전공 & 소프트웨어학부

늘 그렇듯 나는 백엔드로 참여했다.

참가한 이유

1. 지난 Uni-DTHON에서 느꼈던 아쉬움들을 보완하고 싶어서.
2. 해커톤에서만 느낄 수 있는 빠르고 간결한 개발 템포가 좋아서.

무박으로 진행되기 때문에 힘들긴 해도 제한된 시간동안 어마어마한 집중력을 뽑아낼 수 있어 좋은 것 같다.
그리고 누구랑 팀이 될 지 모르는 것도 재밌다.

(물론 운전경력 20년짜리 기사가 모는 버스에 타게 될 수도 있지만,
직접 운전대를 잡게 될 수도 있다 😇...)

🏝 사전 준비

즉석에서 개발하는 것이 해커톤의 정수이긴 하지만,
그래도 너무 아무런 준비 없이 갔다가는 프로젝트 세팅 도중에 해가 지는 걸 경험하게 될 지도 모른다.
프로젝트 의존성이나 DB 세팅은 미리 해가고, 프론트와의 연동을 위한 준비도 해가는 게 좋다.
여유가 된다면 간단한 CRUD를 담은 ERD와 엔티티 코드도 설계해가는 걸 추천한다.

필자는 지난 대회에서의 경험을 토대로 전날에 모두 준비해두고 갔다.
덕분에 다른 팀에서 ERD 설계로 고민할 때 바로 개발을 시작할 수 있어서 시간을 많이 절약할 수 있었다.

Project

• Build Tool - Gradle
• Spring Data JPA
• Lombok
• Spring Security
• H2 Database
• MySQL connector (Driver)

RDBMS인 MySQL과 스프링의 JPA를 매핑하려면 MySQL Connector이라는 드라이버가 필요하다.
미리 설치하고 설정파일에 데이터베이스 커넥션에 관한 정보를 기록해두면 좋다.

Server

• local : 4041 포트
• production : AWS EC2 + RDS

API 서버를 EC2에 배포해서 클라이언트와 연동할 계획이었다.
따라서 EC2 인스턴스와 RDS 데이터베이스를 미리 열어놓고 갔다.

위에서도 언급했듯 많이 쓰는 기능들에 대해서는 간단하게 ERD도 그려서 갔다.
ERD 작성은 🔗ERD Cloud 라는 사이트를 이용했고,
사이트 메인에 있는 OKKY라는 커뮤니티의 ERD를 참고했다.
이 과정에서 PK 매핑과 다대다 관계 다대일로 풀기 등 JPA에 대한 공부도 많이 했다.

🏝 진행 과정

팀 빌딩

팀빌딩은 랜덤인 것 같았고, 5인 1팀이었다.
하지만 세 명이 웹 개발 경험이 없었고,
그중 한명은 몸이 안 좋아서 중도포기 하고 집에 가셨다 (...)
다행히 나머지 한 분의 포지션이 프론트였고 나도 혼자서 커버가 가능해서 둘이서 개발에 집중하기로 했다.

주제 선정

주제는 청춘 이었다.
한 주간의 문화생활 정보를 보여주고 추천해주는 웹 사이트가 있으면 좋을 것 같다는 의견이 나왔다.
좋은 아이디어라고 생각해서 바로 개발을 시작했다.

공연 정보나 썸네일은 인터파크 같은 예매 사이트의 데이터를 크롤링해와서 보여주기로 했고,
의견을 나눌 수 있는 간단한 커뮤니티 기능을 추가하기로 했다.

개발 환경

간단한 기능이긴 했지만 이것저것 뭐가 많이 들어갔다.
나는 API 서버 배포가 처음이었고, 프론트 친구는 테일윈드를 처음 써본다고 했다.

본격적인 개발 과정

1. API 개발

Postman으로 테스트와 문서화를 동시에 했다.
테스트 선택지에 포스트맨 말고도 Swagger가 있긴 했는데 써본 게 포스트맨 뿐이라 익숙한 걸로 했다.

기본적인 API 응답은 ApiResponse 클래스에 응답 객체를 달아주는 것으로 했다.
요청과 응답 모두 dto를 만드는 게 좋다고 들었는데,
API마다 응답 객체를 만들 시간이 없어서 일부는 엔티티 객체를 응답으로 보냈다.
나중에 리팩토링하면서 수정해봐야지.

🚨 개발 중 겪은 에러 (1)
nullable=true로 설정한 컬럼에서 null값이 리턴되는 경우 (e.g. 다른 엔티티와 조인한 컬럼) 응답이 전송되지 않는 문제가 있었다.
조인한 컬럼에 @JsonIgnore 어노테이션을 붙여서 해결했다.

2. 서버 배포

Travis CI나 S3 + CodeDeploy를 통해 배포자동화 로직을 구축하고 싶었는데 그건 너무 쓸데없는(..) 욕심이었던 것 같고,
테스트가 끝난 API 서버를 깃허브에 푸시하고 EC2에 클론해와서 빌드하는 방식의 수동 배포를 했다.

🚨 개발 중 겪은 에러 (2)
분명히 서버는 배포가 됐는데, 연결해둔 내 DB 상에 데이터가 뜨지 않았다.
원인도 모르고 자꾸 왜 이러나 허둥지둥 두시간동안 헤맸는데,
원인은 .ignore 처리한 설정파일(application.yml)이 깃허브에 푸시되지 않았기 때문이었다.
급하게 gitignore 해제 후 application.yml 파일을 푸시해서 해결했는데,
그 과정에서 나의 소중한 개인정보가 함께 푸시되는 사태가 발생했다.
해당 문제는 이렇게 해결했다.

🚨 개발 중 겪은 에러 (3)
집이 아닌 곳에서 배포하는 상황이라 AWS의 탄력적 ip 할당을 사용했는데,
문제는 프리티어의 경우 탄력적 ip 할당이 딱 한시간까지 무료여서 0.2달러 정도가 과금됐다.
탄력적 ip 할당을 사용한 후에는 꼭꼭 해제하는 것을 잊지 말 것...
(EC2 콘솔 상에서 탄력적 ip 연결 해제 후 릴리스하면 된다.)

3. 클라이언트와 연동

늘 그렇듯 CORS를 만났다.
대부분의 CORS 문제는 서버 단에서 해결해야 한다고 알고 있고,
이미 이전 프로젝트에서 여러번 해결해봤기에 Configuration 추가로 해결했다.

@Configuration
public class WebConfig implements WebMvcConfigurer {
    @Override
    public void addCorsMappings(CorsRegistry registry) {
        registry.addMapping("/**")
                .allowedOrigins("접속을 허용할 url");
    }
}

결과물

🔗 결과물 레포지토리 바로가기

여담

이번에는 후회 없이 열심히 불태우고 왔다~!
이제 솔챌 열심히 준비할게요 😎