feat: Add OAuth2 server and client implementation with PKCE support

- Implemented OAuth2 server with client registration, authorization, and token endpoints.
- Created HTML templates for client authorization, client creation, and client editing.
- Developed an OAuth2 client application using Hono.js and Bun, supporting authorization code grant flow.
- Integrated PKCE (Proof Key for Code Exchange) for enhanced security during authorization.
- Added session management using cookies for user authentication.
- Included detailed README documentation for setup and usage instructions.

oauth2-client/README.md

@@ -0,0 +1,114 @@
+# OAuth2 Client
+
+이 프로젝트는 OAuth2 서버와 연동하는 클라이언트 애플리케이션입니다. Hono.js와 Bun을 사용하여 구축되었습니다.
+
+## 기능
+
+- OAuth2 Authorization Code Grant 플로우 구현
+- PKCE (Proof Key for Code Exchange) 지원
+- 사용자 프로필 조회
+- 쿠키 기반 세션 관리
+
+## 설정 방법
+
+### 1. OAuth2 서버에서 클라이언트 등록
+
+먼저 OAuth2 서버에서 클라이언트를 등록해야 합니다:
+
+1. OAuth2 서버 실행:
+   ```bash
+   cd ../example-oauth2-server
+   python app.py
+   ```
+
+2. 브라우저에서 `http://localhost:5000` 접속
+
+3. 사용자 생성 (예: 사용자명 "testuser")
+
+4. "Create Client" 클릭하여 새 클라이언트 생성:
+   - **Client Name**: "OAuth2 Client Demo"
+   - **Client URI**: "http://localhost:3000"
+   - **Grant Type**: "authorization_code"
+   - **Redirect URI**: "http://localhost:3000/callback"
+   - **Response Type**: "code"
+   - **Scope**: "profile"
+   - **Token Endpoint Auth Method**: "none" (PKCE 사용 시)
+
+5. 생성된 **Client ID**를 복사
+
+### 2. 클라이언트 설정
+
+`index.ts` 파일에서 `OAUTH_CONFIG.clientId`를 설정:
+
+```typescript
+const OAUTH_CONFIG = {
+  authServerUrl: 'http://localhost:5000',
+  clientId: 'YOUR_CLIENT_ID_HERE', // 복사한 Client ID 입력
+  clientSecret: '', // PKCE 사용 시 불필요
+  redirectUri: 'http://localhost:3000/callback',
+  scope: 'profile'
+}
+```
+
+### 3. 클라이언트 실행
+
+```bash
+bun run dev
+```
+
+또는
+
+```bash
+bun index.ts
+```
+
+기본적으로 `http://localhost:3000`에서 실행됩니다.
+
+## 사용법
+
+1. 브라우저에서 `http://localhost:3000` 접속
+2. "OAuth2로 로그인" 버튼 클릭
+3. OAuth2 서버로 리다이렉트됨
+4. 권한 승인
+5. 클라이언트로 다시 리다이렉트되어 로그인 완료
+6. "내 프로필 보기"로 사용자 정보 확인 가능
+
+## API 엔드포인트
+
+- `GET /` - 홈페이지
+- `GET /login` - OAuth2 로그인 시작
+- `GET /callback` - OAuth2 콜백 처리
+- `GET /profile` - 사용자 프로필 조회
+- `GET /logout` - 로그아웃
+
+## 보안 기능
+
+- **PKCE**: Code Injection 공격 방지
+- **State 매개변수**: CSRF 공격 방지
+- **HTTP-only 쿠키**: XSS 공격 방지
+- **세션 타임아웃**: 일회용 세션 데이터
+
+## 주의사항
+
+- 이 예제는 개발/데모 목적으로 제작되었습니다
+- 실제 운영환경에서는 다음을 고려하세요:
+  - HTTPS 사용
+  - 안전한 세션 스토리지 (Redis 등)
+  - 적절한 에러 핸들링
+  - 로깅 및 모니터링
+  - 토큰 갱신 로직
+
+## 트러블슈팅
+
+### "Client ID가 설정되지 않았습니다" 오류
+- `index.ts`에서 `OAUTH_CONFIG.clientId`를 설정했는지 확인
+- OAuth2 서버에서 클라이언트를 올바르게 등록했는지 확인
+
+### "유효하지 않은 redirect_uri" 오류
+- OAuth2 서버에 등록한 Redirect URI가 `http://localhost:3000/callback`인지 확인
+- 포트 번호가 일치하는지 확인
+
+### "토큰 교환 실패" 오류
+- OAuth2 서버가 실행 중인지 확인
+- Client ID가 올바른지 확인
+- 네트워크 연결 상태 확인