🗝️ Pick

👨‍💻 DEVELOPERS

고성연	김석희	이청민	장시원	정민선	최혜민

🔖 목차

💡 Tech Stack

📢 프로젝트 개요

🛠️ 주요 기능

📅 개발 사이클

🧵 와이어 프레임

🪄 스토리 보드

📰 WBS

🙆‍♀️ 기능 명세서

🛜 Server

📱 테스트 케이스

📑 트러블 슈팅

🔜 향후 확장 계획

🍪 동료 평가

💡 Tech Stack

🌿 Backend

🗝️ Frontend

🗂️ DB

🛜 Server

🔧 Tools

📢 프로젝트 개요

1. 프로젝트 주제

평생 공부해야 하는 개발자를 위한 사이드 프로젝트 매칭 & 관리 플랫폼

2. 프로젝트 필요성

사이드 프로젝트란?
규모와 수익성과는 상관없이 스스로 원해서 개발해 보고 싶은 서비스, 적용해 보고 싶은 기술 스택 등을
수련하며 스스로 자기 계발을 하는 기회를 마련하는 나만의 프로젝트

사이드 프로젝트를 진행할 때는 팀원 간의 협업과 커뮤니케이션이 매우 중요하며, 모집부터 실제 실행, 완성까지 꽤 많은 시간과 노력이 필요합니다.

기존에 사용되던 팀원 매칭 플랫폼인 비사이드는 팀 구성에 용이하지만, 이후의 협업과 프로젝트 관리 기능이 부족하다는 한계가 있습니다. Jira는 체계적인 프로젝트 관리를 도와주지만, 팀원 모집이나 매칭 기능은 전혀 제공하지 않아 초기 팀 구성에 어려움이 있습니다.

이러한 두 플랫폼의 아쉬운 점을 보완하고, 각각의 장점만을 살려 팀원 매칭부터 프로젝트 관리까지 한 번에 가능한 올인원 플랫폼, Pick이 탄생했습니다. Pick은 효율적인 팀 구성과 유연한 협업, 체계적인 진행 관리를 모두 지원하여, 사이드 프로젝트의 시작부터 완성까지 모든 과정을 더 쉽고 효율적으로 만들어줍니다.

🛠️ 주요 기능

매칭을 희망하는 회원이 매칭을 신청하면, 미리 생성된 방의 레벨과 비교하여 레벨 범위에 맞는 방에 신청자 매칭

프로젝트 방이 생성되면, 참가자에게 문서화와 일정 관리 서비스 제공.
프로젝트가 끝나면 각 팀원은 프로젝트와 서로에 대한 후기 작성 -> 포트폴리오 & 피드백이 됨

매일매일 반복적으로 달성할 수 있는 단기 목표 부여 -> 일정 횟수 반복 시 도전 과제 달성 -> 업적 뱃지 제공
경력, 전공, 자격증 등 스펙 증명 시 스펙 뱃지 제공

📅 개발 사이클

1. Vuetify UI 라이브러리로 통일성 있는 UI 구현

Pick 프로젝트는 Vuetify UI 라이브러리를 활용해 프론트엔드 UI를 구축했습니다. Vuetify는 Material Design 기반의 풍부한 컴포넌트 세트를 제공하여, 버튼, 카드, 다이얼로그 등 잘 설계된 UI 요소를 빠르게 적용할 수 있었습니다. 이를 통해 팀원들은 디자인 작업에 소요되는 시간을 줄이고, 전체 플랫폼에 걸쳐 일관된 색상, 타이포그래피, 레이아웃을 유지할 수 있었습니다.

• 개발 속도 향상: 사전 정의된 컴포넌트로 UI 개발 시간 단축.
• 디자인 일관성: 통일된 스타일로 사용자에게 신뢰감 있는 인터페이스 제공.
• 반응형 지원: 다양한 디바이스에서 일관된 경험 보장.

2. SPA 구조로 부드러운 사용자 경험 제공

Pick은 SPA(Single Page Application) 아키텍처를 기반으로 설계했습니다. 헤더와 사이드바 같은 공통 레이아웃은 고정된 상태로 유지되며, 동적 콘텐츠 영역(이미지에서 색상으로 표시된 부분)만 Vue Router를 통해 동적으로 변경됩니다. 이 방식은 페이지 전체를 새로고침하지 않고 필요한 부분만 업데이트해 빠르고 부드러운 화면 전환을 가능하게 합니다. 또한, 컴포넌트 재사용성을 높여 코드 중복을 줄이고 유지보수를 용이하게 했습니다. 예를 들어, 프로젝트 목록과 매칭 페이지는 동일한 카드 컴포넌트를 활용해 일관된 UI를 제공합니다.

• 향상된 UX: 페이지 전환 시 깜빡임 없이 부드러운 경험 제공.
• 효율적 개발: 재사용 가능한 컴포넌트로 개발 및 수정 작업 간소화.
• 빠른 로딩: 필요한 데이터만 동적으로 로드해 성능 최적화.

3. 공통 컴포넌트로 재사용성과 생산성 극대화

프로젝트 전반에 걸쳐 자주 사용되는 UI 요소를 공통 컴포넌트로 모듈화하여 재사용성을 높였습니다. 주요 공통 컴포넌트로는 헤더(네비게이션 메뉴 포함), 푸터(사이트 정보 표시), 탭창(콘텐츠 간 전환), 검색 컴포넌트(게시글 및 프로젝트 검색), 글 목록 컴포넌트(게시판 및 매칭 목록), 글쓰기 영역(제목과 내용 입력 UI), 프로젝트 카드(프로젝트 정보 요약) 등이 있습니다. 이러한 컴포넌트는 각 페이지에서 반복적으로 활용되어 UI 개발의 효율성을 높이고, 일관된 디자인을 유지했습니다.

• 재사용성: 동일한 컴포넌트를 여러 페이지에서 활용해 개발 시간 단축.
• 일관성: 모든 페이지에서 통일된 UI로 사용자 혼란 감소.
• 유지보수 용이: 컴포넌트 수정 시 전체 페이지에 자동 반영.

4. 체계적인 폴더 구조로 코드 관리 효율화

프로젝트의 코드 관리를 체계화하기 위해 명확한 폴더 구조를 설계했습니다. 최상위 디렉토리는 Components(공통 컴포넌트), Views(페이지별 뷰), Router(라우팅 설정), Stores(상태 관리), Utils(유틸리티 함수), JSON(정적 데이터), Assets(이미지 및 폰트)로 나뉘었습니다. 각 디렉토리 내부는 다시 기능별로 세분화하여 미션, 매칭, 회원, 게시글, 프로젝트 폴더로 구성했습니다. 프로젝트 폴더는 추가로 대시보드, 완료된 프로젝트, 프로젝트 정보, 이슈, 회의록, PR, 리뷰 등 세부 기능별로 패키지를 나누어 관리했습니다. 이 구조는 코드의 역할과 위치를 명확히 하여 협업과 유지보수를 간소화했습니다.

• 명확한 구조: 기능별 분리로 코드 탐색 및 이해 용이.
• 협업 효율성: 팀원 간 코드 충돌 최소화 및 병렬 작업 가능.
• 확장성: 새로운 기능 추가 시 기존 구조에 쉽게 통합 가능.

5. 특화된 라이브러리로 기능 구현 강화

Pick은 특정 기능의 품질을 높이기 위해 세 가지 특화된 라이브러리를 활용했습니다:

• Marked.js: 마크다운 파서를 사용해 회의록 작성 페이지에서 사용자가 마크다운 문법으로 작성한 내용을 실시간으로 HTML로 변환하여 표시합니다. 이를 통해 직관적이고 풍부한 텍스트 편집 경험을 제공했습니다.
  
• Chart.js: 대시보드의 REPO 모니터링 영역에서 사용되었습니다. 커밋 횟수, 이슈 상태, PR 진행 상황 등을 시각화한 차트(막대, 꺾은선 등)를 구현해 프로젝트 진행 상황을 한눈에 파악할 수 있게 했습니다.
  
• Diff2HTML: PR(Pull Request) 생성 페이지에서 코드 변경 사항을 시각적으로 비교하기 위해 사용되었습니다. 변경된 코드의 추가/삭제 부분을 색상으로 구분해 표시하여 팀원이 PR을 쉽게 검토할 수 있도록 지원했습니다.

• 기능 최적화: 각 라이브러리가 특정 기능에 최적화되어 사용자 경험 향상.
• 시각적 효과: 데이터와 코드 변경을 직관적으로 보여줘 이해도 증가.
• 개발 효율: 검증된 라이브러리로 안정적이고 빠른 구현 가능.

🧵 와이어 프레임

🔗 와이어 프레임 자세히 보기

🪄 스토리 보드

메인 페이지

매칭 페이지

대시보드

전체 프로젝트 리스트

프로젝트 디테일 페이지

📰 WBS

🔗 WBS 자세히 보기

🙆‍♀️ 기능 명세서

🔗 기능 명세서 자세히 보기

🛜 Server

Eureka 서버 + Config 서버 + GateWay + Frontend + Git REST API

Spring Gateway와 Eureka로 효율적인 MSA 구현

Pick의 서버 아키텍처는 마이크로서비스 아키텍처(MSA)를 기반으로 설계되었습니다. Spring Gateway는 모든 클라이언트 요청을 프론트가 받아 넘겨주어 중앙에서 관리하며, 인가 처리(권한 검증)를 담당합니다. Eureka 서비스 레지스트리는 동적으로 마이크로서비스를 탐색하고 로드밸런싱을 수행합니다. Member 도메인은 JWT 토큰 생성 및 인증(사용자 신원 확인)을 처리하며, Config Server는 환경 설정을 중앙화해 일관성을 유지합니다. 서비스는 Member 도메인(회원 관리)과 Core 도메인(매칭, 프로젝트, 신고, 게시판)으로 나뉘어 관리되며, 각 도메인은 MariaDB에서 데이터를 조회합니다. 또한, Git REST API를 추가해 Spring Gateway를 통해 외부 GitHub API를 호출, 커밋, 이슈, PR 데이터를 동적으로 통합했습니다.

• 확장성: MSA 구조로 도메인별 독립적 배포 및 유지보수 가능.
• 효율적 인증/인가: Member 도메인에서 인증, Gateway에서 인가로 역할 분리.
• 외부 API 통합: Git REST API로 프로젝트 데이터를 실시간 연동.

📱 테스트 케이스

📄 공통 부분

공통 부분

메인 페이지 조회

오류 페이지

👤 회원

회원

회원가입

로그인

회원 정보 조회

회원 정보 수정

프로필 페이지 조회

깃허브 연결하기

로그아웃

🎖️ 일일 미션

일일 미션

일일 미션 조회

📜 게시글

게시판

자유 게시판 조회

단일 게시글 조회

게시글 쓰기 페이지

🤼 매칭

매칭

랜덤 매칭 생성

매칭 조회

사설 매칭 생성

사설 매칭 입장

사이드 바 매칭 조회

헤더 랜덤 매칭 생성

헤더 랜덤 매칭 조회

헤더 사설 매칭 생성

헤더 사설 매칭 입장

헤더 프로젝트 매칭 페이지

🗂️ 프로젝트

프로젝트

프로젝트 리스트 및 상세페이지 조회

대시보드 조회

회의록 조회 / 작성 / 수정

커밋 목록 조회

깃 이슈 생성 취소하기

깃 이슈 생성하기

깃 이슈 목록 조회

깃 PR 목록 조회

깃 PR 생성하기

📑 트러블 슈팅

#GIT REST API 연동 #v-infinite-scroll 무한 로딩 #개발중 AI 도구 활용

1. GIT REST API 연동 관련 문제

Pick 프로젝트는 백엔드 통신에서 JWT 토큰 기반의 Stateless 인증 및 인가 처리를 사용했으나, Git REST API 연동 시 OAuth 2.0 기반의 세션 방식과 리다이렉트가 필요해 무결성 유지에 문제가 발생했습니다. 기존 JWT 방식은 상태를 저장하지 않아 가볍고 확장 가능했지만, GitHub의 OAuth 2.0은 세션 기반으로 동작하며 리다이렉트 후 액세스 토큰을 처리해야 했습니다. 이를 해결하기 위해 다른 도메인은 JWT 방식을 유지하고, Git REST API 연동에만 Spring Gateway에서 OAuth 2.0 설정을 추가했습니다. Gateway에 OAuth 2.0 클라이언트 ID, 액세스 토큰, 리다이렉트 경로를 설정하여 GitHub에서 개인 액세스 토큰을 받아 MariaDB에 저장하도록 구현했습니다. 이를 통해 컨트롤러에서 GitHub API 요청(커밋, 이슈, PR 데이터 조회 등)을 안정적으로 처리할 수 있었습니다. 또한, SecurityFilterChain 설정에서 SessionCreationPolicy.IF_REQUIRED로 조정하여 세션 기반 OAuth 2.0과 JWT를 병행하며 무결성을 유지했습니다.

• 인증 방식 통합: JWT와 OAuth 2.0을 도메인별로 분리 적용해 무결성 유지.
• 효율적 토큰 관리: Gateway를 통해 GitHub 액세스 토큰을 DB에 저장, API 호출 간소화.
• 안정성 강화: 세션 및 리다이렉트 처리로 Git REST API 연동의 안정성 확보.

2. v-infinite-scroll로 안정적인 무한 스크롤 구현

v-infinite-scroll를 활용하여 무한 스크롤 기능을 구현하는 과정에서, 더 이상 읽어올 데이터가 없음에도 load 함수가 반복 호출되어 로딩 애니메이션이 지속되는 문제가 발생했습니다. 이는 사용자 경험 저하와 불필요한 연산을 유발했습니다. 이를 해결하기 위해 데이터 흐름을 명시적으로 제어하도록 리팩토링했습니다. 데이터 가져오기 함수가 Promise 객체를 반환하도록 수정하여, 데이터가 성공적으로 로드된 경우(ok)와 더 이상 데이터가 없는 경우(empty)를 구분해 처리 흐름을 개선했습니다. 또한, 비동기 데이터 로딩으로 인해 초기 렌더링 시 스크롤이 임계점에 도달하여 load 함수가 불필요하게 호출되는 문제를 해결하기 위해 초기화 플래그(isInit)를 도입했습니다. 이를 통해 첫 번째 호출은 무시하고, 초기 데이터를 동기적으로 로드한 후 정상적으로 렌더링되도록 제어했습니다.

• 사용자 경험 개선: 불필요한 로딩 애니메이션 제거로 부드러운 스크롤 경험 제공.
• 성능 최적화: 데이터 상태를 명확히 구분해 불필요한 연산 감소.
• 안정성 강화: 초기화 플래그 도입으로 비동기 로딩 시 오류 방지.

3. 개발중 AI 도구 활용

AI 도구를 활용하여 프론트 개발에 관한 질문을 처리하는 과정에서 적절한 프롬포트 없이 사진과 설명만 주는 경우 원하는 결과가 나오지 않거나, 각각 코드를 작성하고 스타일을 적용하여 화면을 확인해본 결과 각각 스타일이 달라 페이지의 통일성이 없는것을 확인하였습니다. 이는 사용자 경험 저하와 불필요한 작업이 추가되어 비효율적인 것을 깨달았고, 모두가 공통적인 결과를 얻기 위해 프롬포트 양식을 작성하여 프롬포트 기반으로 어느정도 동일한 결과값을 받을수 있도록 진행하였습니다.

🔜 향후 확장 계획

#백엔드 전체 연동 #Webhook 적용 #WebSocket 적용 #보안 및 예외처리 #리팩토링

1. 백엔드 전체 연동

Pick 플랫폼의 모든 기능을 완성하기 위해, 현재 구현된 백엔드 기능(매칭, 챌린지, 회의록 등)을 프론트엔드와 완전히 연동할 계획입니다. 이를 통해 백엔드에서 처리된 데이터를 프론트엔드에서 실시간으로 시각화하고, 사용자에게 매칭 결과, 챌린지 진행 상황, 회의록 내용을 동적으로 보여줄 수 있도록 확장할 예정입니다. 연동 과정에서는 Spring Gateway와 Eureka를 활용해 마이크로서비스 간 통신을 최적화하고, 데이터 무결성을 유지하며 안정적인 사용자 경험을 제공할 것입니다.

• 데이터 시각화: 매칭, 챌린지, 회의록 데이터를 프론트엔드에 동적으로 표시.
• 통신 최적화: Gateway와 Eureka로 마이크로서비스 간 효율적 연동.
• 사용자 경험 강화: 실시간 데이터 반영으로 직관적 인터페이스 제공.

2. Webhook 적용

GitHub의 Webhook을 연동하여 프로젝트 대시보드에 PR(Pull Request), 커밋, 이슈의 변화를 자동으로 감지하고 업데이트하는 기능을 구현할 예정입니다. Webhook은 GitHub 리포지토리의 이벤트를 실시간으로 서버에 알리며, 이를 통해 프로젝트 대시보드에서 최신 변경 사항을 즉시 반영할 수 있습니다. 이를 위해 Webhook 이벤트를 수신하는 엔드포인트를 설정하고, 이벤트를 처리해 MariaDB에 저장하거나 프론트엔드에 알림을 전송하는 로직을 추가할 것입니다.

• 실시간 업데이트: PR, 커밋, 이슈 변경을 자동 감지해 대시보드에 반영.
• 효율적 데이터 관리: Webhook 이벤트를 DB에 저장해 데이터 무결성 유지.
• 사용자 편의성: 수동 업데이트 없이 최신 프로젝트 상태 제공.

3. WebSocket 적용

WebSocket을 도입하여 여러 사용자가 회의록을 동시에 편집할 수 있는 실시간 협업 기능을 구현할 예정입니다. 현재 회의록 작성은 단일 사용자 중심으로 설계되었으나, WebSocket을 통해 다중 사용자가 동일한 문서를 실시간으로 수정하고 변경 사항을 즉시 공유할 수 있도록 확장할 것입니다. 이를 위해 Spring WebSocket을 활용해 서버-클라이언트 간 양방향 통신을 설정하고, 동시 편집 충돌을 방지하기 위한 동기화 로직을 추가할 계획입니다.

• 실시간 협업: 다중 사용자가 회의록을 동시에 편집 가능.
• 충돌 방지: 동기화 로직으로 편집 충돌 최소화.
• 효율적 통신: WebSocket으로 저지연 데이터 전송 구현.

4. 보안 및 예외 처리

플랫폼의 안정성과 신뢰성을 높이기 위해 보안 및 예외 처리 로직을 강화할 예정입니다. 권한별 요청 처리를 세분화하여 사용자 역할(관리자, 일반 회원 등)에 따라 접근 가능한 API를 제한하고, 회원 매칭 로직에서 멤버와 요청 간 통신 설정을 추가해 데이터 무결성을 보장할 것입니다. 또한, 현재 누락된 예외 처리(예: 잘못된 입력, 네트워크 오류 등)를 각 요청에 맞게 보완하여 사용자에게 명확한 에러 메시지를 제공하고, 시스템 안정성을 높일 계획입니다.

• 보안 강화: 권한별 API 접근 제어로 데이터 보호.
• 안정성 개선: 매칭 로직에 통신 설정 추가로 무결성 확보.
• 사용자 경험 향상: 상세한 예외 처리로 명확한 에러 피드백 제공.

5. 리팩토링

개발 일정으로 인해 급하게 작성된 코드를 체계적으로 정리하고, 코드 품질을 높이기 위해 리팩토링을 진행할 예정입니다. 우선, 일관되지 않은 코딩 컨벤션을 프로젝트 전반에 맞춰 표준화하고, 주석과 문서화를 보완할 것입니다. 또한, 현재 단일 Core 도메인에 포함된 매칭, 프로젝트, 뱃지, 챌린지 기능을 MSA(마이크로서비스 아키텍처) 단위로 분리하여 각 도메인을 독립적으로 배포하고 관리할 수 있도록 재구성할 계획입니다. 이를 통해 코드 유지보수성과 확장성을 높일 것입니다.

• 코드 품질 향상: 일관된 컨벤션과 문서화로 가독성 개선.
• 확장성 강화: Core 도메인을 MSA 단위로 분리해 독립적 배포 가능.
• 유지보수 용이: 체계적 코드 구조로 수정 및 업데이트 간소화.

🍪 동료 평가

🐙 고성연

평가자	내용
김석희	회원 관련 페이지의 화면을 모두 제작하셨을 뿐만 아니라 발표도 완성도 있게 수행해주셨습니다. 화면 구성 외에도 데이터 중복 확인, 입력 데이터 연동, 로컬 저장 등 신경써야 할 부분을 모두 꼼꼼하게 처리해주셨습니다. 성연님 덕분에 신경쓰지 못한 내용들이 모두 알차게 들어갔습니다. 고생많으셨습니다🙂
이청민	백엔드 때부터 이어온 회원 관련 기능을 프론트엔드에서도 맡아주셔서, 로그인, 회원가입, 마이페이지 등 다양한 페이지들을 안정감 있게 구현해주셨다. 여러 기능이 얽힌 복잡한 흐름 속에서도 깔끔하게 정리된 구조와 예외 처리가 인상적이었다. 또한 발표에서도 핵심을 잘 짚어주셔서, 전체 프로젝트의 흐름을 이해하는 데 많은 도움이 되었다.
장시원	백엔드부터 맡아온 회원 관련 기능을 프론트엔드에서도 맡으며, 보이지 않는 정합성 검사까지 꼼꼼하게 구현해주셨다. 시간적으로 여유도 없었을텐데 발표도 먼저 맡아주시겠다고 해서 프로젝트 진행도 수월했다. 발표에서도 서비스의 흐름에 따라 깔끔하게 발표하면서도 각자의 노력이 묻히지 않게 꼼꼼히 발표하는 부분도 인상깊었다. 회원을 중심으로 많은 기능이 얽혀 있는데 구조와 흐름을 잘 정리해주셔서 참고하기 좋았다.
정민선	백엔드에 이어 회원 관련 도메인을 담당하셨는데, 플랫폼에서 핵심인 로그인, 회원가입 기능을 완성해 주셨습니다. 또한 상태 관리 라이브러리(Pinia)를 적용하여 회원 정보를 전역적으로 사용할 수 있도록 구현해 주셔서 다른 페이지에서도 쉽게 회원 정보에 접근할 수 있었습니다. 항상 전체적인 흐름을 고려하시면서 다른 팀원들이 놓치고 있던 부분을 보완할 수 있도록 해주셔서 서비스의 완성도를 높일 수 있었던 것 같습니다. 많은 작업을 진행하면서 발표까지 맡아주셔서 부담이 많으셨을 텐데 상세한 부분까지 구체적으로 놓치지 않고 전달해 주셔서 감사했습니다!
최혜민	이번에도 회원 관련 페이지를 맡아주셨는데, 번거로운 작업들이 많았음에도 불구하고 묵묵히 잘 처리해주셨다. 발표도 먼저 맡아주시겠다고 해서 발표 준비가 훨씬 수월했고, 실제 발표도 깔끔하게 마무리해주셨다. 항상 어려운 일들을 기꺼이 맡아주시고 중요한 역할을 성실하게 해내주셔서, 프로젝트 전체가 안정적으로 진행될 수 있었다.

🪨 김석희

평가자	내용
고성연	프론트 일정이 배우면서 진행되면서 빠듯한 시간임에도 불구하고 앞서 진행되었던 백엔드와의 연동 또한 신경써주시고 서비스의 메인 기능을 문제없이 작동되게 해주셨고, 전반적으로 다른 팀원들이 화면 구성하면서 놓친 부분에 대해서도 디테일한 부분들을 다 잡아주셨다 또한 이제 기본적인 라이브러리에서 내 화면을 구성하기 위한 간단한 컴포넌트만 사용할 생각이였는데, diff2html 등 다양한 라이브러리를 사용하여 단조로운 화면이 아니라 한눈에 변화를 파악할 수 있게 사용자 입장을 고려햐여 편의성을 신경 써 주셨다. 항상 프로젝트를 진행함에 있어서 문서화, 어떤 방식으로 작업할지와 일정 관리 전반적인 개발 흐름 등을 정해주고 다른 팀원들의 진행 상황들을 자세히 체크해주시고 신경써 주셔서 온전히 개인의 일에 집중 할 수 있었던것 같다. 프론트와 백엔드 프로젝트를 같이 하면서 항상 열심히 하시고 저런 식으로 나도 할수 있으면 좋지 않을까 라고 많이 생각하고 보면서 배우고 여러 부분에서 감사했다다
이청민	깃허브 API를 연동하는 까다로운 작업을 맡아주셨고, 짧은 시간 내에 완성도 높은 결과물을 보여주셨다. 특히 API를 처리하는 중 에러 처리를 깔끔히 표시하는 구현이 인상적이었다. 작은 디테일까지 신경 쓰는 모습에서 팀에 대한 책임감이 느껴졌다.
장시원	게이트웨이와 서버에 이어 깃허브 API 연동까지 어려운 작업을 끝까지 맡아주셨다. 옆에서 괴로워 하면서도 포기하지 않고 하나하나 해결해나가는 모습이 인상 깊었다. 여러 의견을 조율하며 교통정리도 해주면서 본인이 맡은 부분을 묵묵히 해내시고 모르는 부분에 대한 질문을 잘 받아주셔서 감사했다. 맡은 부분에 대해서 부담도 많았을텐데 시연에서도 완벽하게 동작하며 성공적인 프로젝트로 이끌었다. 항상 정확하게 일을 분배하며 각자 맡은 부분에만 집중할 수 있도록 만들어주셔서 정말 든든했다.
정민선	우리 서비스의 핵심 기능인 Github api 연동을 성공적으로 완성해주셨습니다. 짧은 시간 안에 가능할까 했던 기능들을 혼자 담당하셔서 어려운 부분이 많으셨을 텐데, 끈기있게 해결해내시는 모습이 정말 든든하고 존경스러웠습니다. 또한 프로젝트 관련 페이지에 공통적으로 사용되는 레이아웃이나 메뉴 데이터 등을 미리 정리해주셔서 다른 팀원들이 개발하기가 편리했습니다. PR 생성 시 파일의 변경사항을 보여주는 diff 페이지를 설계했던 그대로 구현하신 걸 보면, 데이터를 시각적으로 깔끔하게 다루는 작업에도 능숙하신 것 같습니다. 항상 긍정적인 에너지로 일정 관리, 개발을 진행하시는 모습을 보며 많이 배웠습니다.
최혜민	우리 팀의 핵심인 깃허브 API 연동을 성공적으로 구현하셨다. 정말 어려운 작업이었고 나 같으면 엄두도 못 냈을 것 같은데, 혼자서 그 복잡한 과정을 차근차근 해결해내시는 모습이 너무 인상 깊었다. 이번 프로젝트를 통해 석희님이 얼마나 대단한 분인지 다시 한 번 느꼈다. 항상 묵묵히 본인의 일을 해내시고, 누구보다 정확하게 처리해주셔서 정말 든든하고 존경스럽다. 우리 팀에서 없어서는 안 될 존재다.

🐊 이청민

평가자	내용
고성연	공통적인 컴포넌트 관련하여 다른 페이지에서도 사용할 수 있게 각 컴포넌트들을 잘 만들어 주셨고, 다른 페이지에서 기본적인 틀은 같지만 세부사항이 다른 부분에 대해서 요청이 오면 원하는대로 바로 수정해서 올려주셔서 작업하는데 매우 편하게 가능했다. 어떻게 보면 메인 기능이 아닐수도 있는 부분에 대해서도 유효한 데이터와 함께 상세하게 페이지를 구성해 주셔서 발표하는데 매우 많은 도움이 됐다. 항상 옆에서 제가 하고 싶은게 많아서 일은 많이 벌려 두는데 어떻게든 만들어 주셔서 매우 감사했다.
김석희	코드를 항상 꼼꼼하게 봐주셔서 개념적으로 약한 부분에 대해 한번 더 공부하고 갈 수 있어 너무 좋았습니다. 청민님 덕분에 개발한 기능들에 대해 제대로 생각해보고, 고민할 수 있는 시간을 가질 수 있었습니다. 본인이 담당하지 않은 기능들에 대해서도 공부하고 생각하시는 모습을 보고 많이 배웠습니다🔥
장시원	언제나 책임감 있는 모습을 보여주며 기능을 구현해주신다. 조급해질 수 있는 순간에도 차분함을 유지하며 우리 팀의 브레이크 역할을 맡아주셨다. 놓치는 부분이 없도록 세심한 부분까지 확인해주며 믿음을 주는 분이다. 주요 기능이 아니라 소홀해질 수 있을법도 한데 사소한 디테일까지 놓치지 않고 구현해내는 모습이 인상 깊었다. 청민님이 맡은 부분은 언제나 마음 놓고 볼 수 있었다. 내가 말 주변이 없어 짝꿍으로 보냈던 시간이 있음에도 더 많은 이야기를 해보지 못한게 약간 아쉽다.
정민선	서비스 내에서 공통적으로 사용되는 컴포넌트들을 다른 페이지에서 사용할 수 있도록 미리 구현해주셔서 개발하기 편리하게 해주셨고, 필요한 변경 사항을 빠르게 반영해주셨습니다. 게시글 관련 부분을 담당해주셔서 계획했던 모든 기능을 구현할 수 있었는데, 특히 게시판 영역마다 성격에 맞는 유의미한 데이터를 신경써서 넣어주셔서 서비스의 완성도를 높여주셨습니다.
최혜민	이번 프로젝트에서 맡은 기능을 책임감 있게 잘 구현해주셨다. 맡은 일은 항상 정확하게 처리해주시고, 팀 내에서 차분하고 안정감 있게 자신의 역할을 묵묵히 해내시는 모습이 인상 깊었다. 실력과 성실함으로 팀에 큰 신뢰를 주는 분이다. 따로 많은 설명 없이도 항상 제 시간에 결과물을 잘 마무리해주시고, 꼼꼼하게 작업해주셔서 같이 일하면서 마음이 편했다. 안정감 있게 팀 분위기를 지켜주는 든든한 팀원이었다.

🦝 장시원

평가자	내용
고성연	프로젝트의 메인 기능인 프로젝트 매칭 부분에 대해서 만들어야할 페이지도 많았고, 어떤식으로 연결 되어야 할지와 필요한 로직, 컴포넌트, 구성등이 복잡하여 어려운 부분이였는데도 발표 당일까지 메인 기능에 대해서 모든 기능이 동작하도록 만들어 주셔서 정말 감사했다. 또한 본인이 많든 부분 뿐만 아니라 다른 페이지에 대해서도 컴포넌트 분리가 잘못 된 부분 또한 잡아주시고, 수정하여 동적으로 페이지 변환이 되도록 해주셔서 발표 준비에 집중할 수 있었다. 항상 제 의견에 대해서 잘 들어주시고 좀더 나은 방향성을 제시해주고 시원님과 얘기하면서 여러가지 배워가는 경우도 많았고, 내가 잘못 알고 있는 부분에 대해서도 확실하게 개념을 잡아주셔서 프로젝트를 같이 진행하면서 많은걸 배울 수 있었다.
김석희	개념이나 기획 방향에 대해 물어보면 항상 논리적으로 본인의 생각을 말씀해주셔서 기능을 정리하고 개발하는데 많은 도움이 되었습니다. 또한, 회의가 조금 산으로 가는 것 같으면 적절히 끊어주셔서 팀적으로 회의 시간을 좀 더 유용하게 활용할 수 있었습니다. 구현해야 하는 페이지와 기능이 많아 힘드셨을텐데 포기하지 않고 끝까지 노력하시는 모습이 굉장히 인상적이었습니다😯
이청민	프로젝트의 핵심 기능 중 하나인 매칭 페이지를 맡아, 사용자 경험을 고려한 UI와 기능 구현을 잘 해주셨다. 단순한 페이지 구성에 그치지 않고, 조건에 맞는 필터링과 매칭 로직을 세심하게 설계해주셔서 실제 사용에도 무리가 없을 만큼 완성도가 높았다. 시연 때 보여준 페이지 흐름은 특히 매끄러웠고, 보는 사람 모두가 이해하기 쉽게 잘 구성되어 있었습니다.
정민선	서비스의 정체성인 매칭 관련 페이지를 담당하셨습니다. 매칭 기능 로직이 복잡하고, 다른 도메인과 연결되어 있는 부분이 많아서 UI/UX를 어떻게 설계할 지 고민이 많으셨을 것 같은데, 깔끔하고 사용자 친화적으로 잘 설계해주셔서 서비스의 완성도가 높아진 것 같습니다. 프론트를 구현하는 과정에서 어려움을 겪으면서도 끈기있게 해결하시고 회의하는 과정에서 의견을 적극적으로 공유하시는 모습이 인상적이었습니다.
최혜민	자신이 맡은 기능을 끝까지 책임지고 완성해주셨다. 중간에 어려움을 겪는 부분도 있었지만, 포기하지 않고 결국 해내는 모습을 보며 많은 자극을 받았다. 다른 팀원들의 코드나 기능도 꼼꼼히 확인해주시고, 잘못된 부분을 찾아서 알려주셔서 전체적인 프로젝트 완성도 향상에 큰 도움이 되었다. 적극적인 태도와 끈기가 인상 깊었고, 함께 일하면서 많이 배웠다.

🦭 정민선

평가자	내용
고성연	이번 프론트 프로젝트의 1등 공신이라고 생각한다. 처음 기본 vbase-3-setup 방식의 세팅과 기본틀을 잡아주시고, 제일 중요한 전체 프로젝트 및 프로젝트 대시보드 부분에 회의록, 프로젝트 상세 페이지 등 기본 피그마 형식으로 구상해뒀던 깔끔하고 예쁜 모양 그대로 만들어 주시고, 다양한 이벤트를 통해 반응형 페이지를 만들어 주어 사용자 경험 측면도 생각해주셨다. 또한 백엔드와 연결 안된 부분 또한 json 서버를 열어 수정, 삭제, 추가가 가능하게 해주셨고, 그 변경된 내용을 페이지에 적용되게 하여 실제로 기능이 동작된걸 바로 눈으로 확인할 수 있게 해주셨다. 백엔드 때와 프론트 때도 그랬듯이 강사님이 피드백 해주신 부분들을 정리하여 올려주셔서 어떤 부분에 대해서 수정하고 보완을 해야할지 확인할 수 있었다. 미적 감각이 낮은 나에게 있어서 민선님의 페이지를 참고하여 좋은 결과를 낼 수 있어서 정말 정말 감사했다.
김석희	만약 민선님이 없었다면 이렇게 좋은 결과물이 나오지 않았을거라고 생각합니다. 프론트 개발에 필요한 라이브러리나 기능들을 찾아 공유해주셨을 뿐만 아니라, 본인이 맡은 페이지에 대해서 정말 완벽하게 구현해주셨습니다. 정말 하나를 말하면 100, 200을 해오는 분이셨습니다. 기능 하나하나가 다 유의미하게 작동했으며, 시간 부족으로 미뤘던 기능들도 어느 순간 모두 구현을 해두셨습니다. 모든 기능에 최선을 다하는 모습을 보며 굉장히 많은 것을 배울 수 있었습니다. 민선님도.. 제 보석함 한자리하실래요...?🙊
이청민	프로젝트 대시보드는 전체 프로젝트를 대표하는 핵심 페이지 중 하나였는데, 이를 생각한 것보다 훨씬 높은 퀄리티로 완성해주셨다. 각종 데이터를 한눈에 보기 좋게 시각화하고, 실시간 반영까지 고려한 설계가 매우 인상 깊었습니다. 사용자 관점에서도 기능적으로도 뛰어난 페이지였고, 디테일까지 세심하게 챙긴 점이 돋보였습니다. 특히 JSON 서버를 활용한 데이터 관리가 돋보였다.
장시원	평소엔 조용하지만 결과물은 전혀 조용하지 않았다. 다른 서비스와 차별화된 점을 보여줄 수 있는 핵심인 프로젝트 대시보드를 맡아주셨는데 생각한 것 이상으로 높은 퀄리티를 보여주셨다. 페이지 구성이 오밀조밀하게 알차면서도 정돈된 모습이었다. 맡은 부분을 글자 하나하나까지 디테일도 놓치지 않으면서도 다른 페이지에서도 쓸 수 있는 컴포넌트들을 잘 정리해주셔서 내가 맡은 부분의 퀄리티를 올리는데 집중할 수 있었다. 문서 정리과 PPT 제작에서도 여전히 높은 퀄리티를 보여주시며 프로젝트 내내 큰 존재감을 보여주셨다. 프론트를 처음 다뤄봐서 익숙해지는데 오래걸렸는데 질문에 답변도 잘 해주시고 내가 놓치고 있던 부분까지 확인해주셔서 전체적인 완성도를 높이는데 도움이 되었다.
최혜민	프론트의 신!! 맡은 페이지를 예쁘고 완성도 높게 구현해주셨고, 꼼꼼한 작업 방식 덕분에 전체적인 프로젝트 퀄리티가 한층 올라갔다. 문서 정리와 PPT 제작도 완벽하게 해주셔서 발표 준비도 훨씬 수월했다. 민선님이 작업한 결과물은 항상 감탄이 나올 정도로 완성도가 높았고, 팀에서도 큰 역할을 해주신 분이다. 그동안 내 장난도 다 받아주시고, 늘 편하게 대해주셔서 너무 감사했다.

🐧 최혜민

평가자	내용
고성연	항상 잘 못한다고 말씀을 해주시는거와 별개로, 결과물은 당장 서비스를 운영하여 자랑하고 싶을정도로 잘 해주신다. 이번 프론트를 하면서 저번에도 느꼈던 일이지만, ppt 발표용 자료 정리 및 순서를 작성해주셔서 그걸 토대로 준비만 하면 되어서 빠르게 적응할 수 있었고, 화면 구성에 대해서 되게 잘 아시고 구상 관련하여 획기적인 아이디어를 제공해 주셨다. 또한 어떻게 보면 피그마, 스토리보드 등 신경써야될게 많고 작업이 많은 부분에 대해서도 먼저 나서주셔서 보고 참고 할수 있게 작업을 미리 해두셔서 많은 도움이 되었고, 프로젝트를 진행하면 지칠법도 한데 팀의 분위기를 항상 좋게 유지해주셔서 하는동안 큰 어려움 없이 진행할 수 있었다. 나중에 이 부트캠프가 끝나도 다른 곳에서 작업을 할때도 혜민님같은 분이 있으면 좋겠다고 생각이 들었다 프로젝트 감사했습니다!
김석희	맨날 잘 못한다고 겸손한 말씀을 하시지만, 어떤 어려운 일을 맡겨도 기간 내에 척척 해오시는 멋진 분이십니다. 팀원들을 잘 챙겨주시고, 웃으면서 대해주셔서 팀의 분위기를 항상 좋게 만들어주셨습니다. PPT 제작이나 피그마 정리 등 귀찮을 법한 일을 먼저 나서서 제작해주셨는데, 그 덕분에 프로젝트를 마무리 하는 동안 여유가 많이 생겼었습니다. 항상 혜민님과 함께 하면 마음이 든든해지는 느낌이 있는데, 제 보석함의 한자리를 차지하고 있는 이유가 정말 분명하게 있는 분이십니다. 혜민님 최고👍
이청민	발표 자료를 맡아 팀의 작업 내용을 명확하고 깔끔하게 정리해주셔서, 전체 발표의 흐름이 잘 살아났다. 자료 구성뿐 아니라 디자인적인 부분에서도 섬세하게 신경 써주셔서 보는 사람 입장에서 이해하기 쉬웠다. 또한 프로젝트 후반에는 스토리보드 제작까지 도맡아주셨는데, 개발 과정을 정리하고 시각화하는 데 큰 도움이 되었다.
장시원	팀 내에 언제나 즐거움을 가져오는 분이다. 덕분에 팀 내의 분위기도 좋았고 백엔드에서 다른 사람이 맡았던 부분을 프론트에서 다루느라 익숙하지 않았을텐데도 끈기있게 결과물을 만들어내셨다. 발표 자료도 맡아 작업 내용을 시각적으로도 깔끔하게 정리해주셔서 내가 맡은 부분이 아니어도 이해하기 쉬웠다. 먼저 다가와서 팀 제안을 주셨던 것도 감사했고 그 제안을 받아들였던건 정말 후회없는 선택이었다.
정민선	목록 리스트, 사이드바 등 페이지 뿐만 아니라 프로젝트에서 공통으로 사용되는 컴포넌트들을 다수 담당해주셨는데, 컴포넌트 구조를 보기 쉽게 구현해주셔서 편리하게 사용할 수 있었습니다. UI/UX 를 설계했던 그대로! 구현해내시는 것을 보면, 데이터를 다루고 깔끔하게 시각화하시는 데 능숙하신 것 같습니다. 발표자료나 문서화를 미리 준비하고 정리하시는 철두철미한 모습을 보고 많이 배웠습니다. 항상 즐거운 분위기를 만들어주셔서 감사했습니다. 덕분에 적극적으로 의견을 낼 수 있었던 것 같습니다!