코딩 테스트 트래커

프로그래머스와 백준 문제 풀이를 기록하고 관리하는 웹 애플리케이션입니다.

주요 기능

• 문제 추가 및 관리 (제목, 링크, 플랫폼, 유형)
• 풀이 날짜 자동 기록
• 유형별 문제 분류 및 필터링
• 검색 기능 (제목, 메모)
• 통계 대시보드 (총 문제 수, 이번 달/주, 유형별/플랫폼별 통계)
• 문제별 메모 작성 및 수정

기술 스택

• Frontend: Next.js 16, React 19, TypeScript
• Styling: Tailwind CSS
• Database: Supabase (PostgreSQL)
• Deployment: Vercel

시작하기

1. 프로젝트 클론

git clone <repository-url>
cd coding-test-tracker

2. 의존성 설치

npm install

3. Supabase 설정

3.1 Supabase 프로젝트 생성

1. Supabase 에 접속하여 계정 생성 (무료)
2. "New Project" 클릭
3. 프로젝트 이름, 데이터베이스 비밀번호, 리전 선택 (Seoul 추천)
4. 프로젝트 생성 완료 대기 (1-2분)

3.2 데이터베이스 스키마 생성

1. Supabase 대시보드에서 SQL Editor 메뉴로 이동
2. "New Query" 클릭
3. 프로젝트 루트의 supabase-schema.sql 파일 내용을 복사
4. SQL Editor에 붙여넣기
5. "Run" 버튼 클릭하여 실행

3.3 환경 변수 설정

1. Supabase 대시보드에서 Settings > API 메뉴로 이동
2. "Project URL"과 "anon public" 키 복사
3. 프로젝트 루트에 .env.local 파일 생성:

cp .env.local.example .env.local

4. .env.local 파일에 복사한 값 입력:

NEXT_PUBLIC_SUPABASE_URL=your-project-url
NEXT_PUBLIC_SUPABASE_ANON_KEY=your-anon-key

4. 로컬 개발 서버 실행

npm run dev

브라우저에서 http://localhost:3000 접속

Vercel 배포

1. GitHub 저장소에 코드 푸시

git init
git add .
git commit -m "Initial commit"
git remote add origin <your-github-repo-url>
git push -u origin main

2. Vercel 배포

1. Vercel 접속하여 GitHub 계정으로 로그인
2. "Add New" > "Project" 클릭
3. GitHub 저장소에서 이 프로젝트 선택
4. "Environment Variables" 섹션에서 환경 변수 추가:
   • NEXT_PUBLIC_SUPABASE_URL: Supabase 프로젝트 URL
   • NEXT_PUBLIC_SUPABASE_ANON_KEY: Supabase anon 키
5. "Deploy" 클릭
6. 배포 완료 후 제공되는 URL로 접속

3. 자동 배포 설정

• GitHub에 푸시할 때마다 Vercel이 자동으로 배포합니다.
• Production 브랜치: main
• Preview 배포: Pull Request 생성 시 자동 생성

데이터베이스 스키마

problems 테이블

컬럼명	타입	설명
id	uuid	기본 키 (자동 생성)
title	text	문제 제목
url	text	문제 링크
platform	text	플랫폼 (programmers/baekjoon)
category	text	문제 유형
solved_at	timestamp	풀이 날짜
memo	text	메모 (선택)
created_at	timestamp	생성 시각
updated_at	timestamp	수정 시각

문제 유형

• DP (Dynamic Programming)
• Greedy
• Graph
• DFS/BFS
• Binary Search
• Two Pointer
• Simulation
• Implementation
• String
• Math
• Data Structure
• Sorting
• Backtracking
• Shortest Path
• etc

사용 방법

문제 추가

1. 왼쪽 "문제 추가" 폼에 정보 입력
   • 문제 제목
   • 문제 링크 (프로그래머스 또는 백준 URL)
   • 플랫폼 선택
   • 유형 선택
   • 메모 (선택)
2. "문제 추가" 버튼 클릭
3. 자동으로 현재 날짜가 풀이 날짜로 기록됨

문제 검색 및 필터링

• 상단 검색바에 문제 제목이나 메모 키워드 입력
• 유형 버튼을 클릭하여 특정 유형만 필터링
• "전체" 버튼으로 필터 초기화

문제 수정 및 삭제

• 각 문제 카드의 "수정" 버튼: 메모와 유형 수정 가능
• "삭제" 버튼: 문제 영구 삭제 (확인 메시지 표시)

통계 확인

• 왼쪽 하단 통계 패널에서 확인
  • 총 문제 수
  • 이번 달 푼 문제 수
  • 이번 주 푼 문제 수
  • 플랫폼별 통계
  • 유형별 통계 (Top 5)

문제 해결

Supabase 연결 오류

• .env.local 파일이 올바르게 설정되었는지 확인
• Supabase 프로젝트가 활성 상태인지 확인
• 브라우저 콘솔에서 오류 메시지 확인

데이터베이스 테이블 오류

• supabase-schema.sql 파일을 Supabase SQL Editor에서 실행했는지 확인
• Supabase 대시보드의 Table Editor에서 problems 테이블이 생성되었는지 확인

배포 후 환경 변수 오류

• Vercel 프로젝트 설정에서 환경 변수가 올바르게 입력되었는지 확인
• 환경 변수 수정 후 재배포 필요

라이선스

MIT