feat: 완전한 문서 업로드 및 관리 시스템 구현

- 백엔드 API 완전 구현 (FastAPI + SQLAlchemy + PostgreSQL)
  - 사용자 인증 (JWT 토큰 기반)
  - 문서 CRUD (업로드, 조회, 목록, 삭제)
  - 하이라이트, 메모, 책갈피 관리
  - 태그 시스템 및 검색 기능
  - Pydantic v2 호환성 수정

- 프론트엔드 완전 구현 (Alpine.js + Tailwind CSS)
  - 로그인/로그아웃 기능
  - 문서 업로드 모달 (드래그앤드롭, 파일 검증)
  - 문서 목록 및 필터링
  - 뷰어 페이지 (하이라이트, 메모, 책갈피 UI)
  - 실시간 목록 새로고침

- 시스템 안정성 개선
  - Alpine.js 컴포넌트 간 안전한 통신 (이벤트 기반)
  - API 오류 처리 및 사용자 피드백
  - 파비콘 추가로 404 오류 해결

- 포트 구성: Frontend(24100), Backend(24102), DB(24101), Redis(24103)
This commit is contained in:
Hyungi Ahn
2025-08-22 06:42:26 +09:00
parent 3036b8f0fb
commit a42d193508
28 changed files with 1213 additions and 152 deletions

View File

@@ -17,26 +17,27 @@ window.authModal = () => ({
this.loginError = '';
try {
// 실제 API 호출
const response = await api.login(this.loginForm.email, this.loginForm.password);
// 토큰 저장
api.setToken(response.access_token);
localStorage.setItem('refresh_token', response.refresh_token);
// 사용자 정보 로드
const user = await api.getCurrentUser();
// 사용자 정보 가져오기
const userResponse = await api.getCurrentUser();
// 전역 상태 업데이트
window.dispatchEvent(new CustomEvent('auth-changed', {
detail: { isAuthenticated: true, user }
detail: { isAuthenticated: true, user: userResponse }
}));
// 모달 닫기
this.showLogin = false;
// 모달 닫기 (부모 컴포넌트의 상태 변경)
window.dispatchEvent(new CustomEvent('close-login-modal'));
this.loginForm = { email: '', password: '' };
} catch (error) {
this.loginError = error.message;
this.loginError = error.message || '로그인에 실패했습니다';
} finally {
this.loginLoading = false;
}