[김동균] 3주차 Web 서버 7단계 구현 좋아요 빼고 기능 완성

[AnarchyDeve]

3. 핵심 시스템 아키텍처 (System Architecture)

3.1 ID 기반 파일 저장 전략 (ID-Based Storage)

이미지 파일의 무분별한 생성을 막고 관리 효율을 높이기 위해 고정 파일명 전략을 채택하였습니다.

게시글 이미지: article_{articleId}.ext 형식으로 저장.

프로필 이미지: profile_{userId}.ext 형식으로 저장하여 유저별 단일 파일 유지 및 자동 덮어쓰기 유도.

3.2 통합 업데이트 프로세스

단순 데이터 수정이 아닌, 물리적 파일 쓰기와 DB 트랜잭션 성격의 업데이트를 결합하였습니다.

4. 데이터베이스 스키마 및 Repository (DB & Persistence)

4.1 유저 정보 업데이트 쿼리

-- UserRepository.java
UPDATE "USER" 
SET name = ?, password = ?, profileImage = ? 
WHERE userId = ?;

4.2 게시글 저장 시 ID 반환 (JDBC)

// ArticleRepository.java
PreparedStatement pstmt = conn.prepareStatement(sql, Statement.RETURN_GENERATED_KEYS);
// ... 실행 후
ResultSet rs = pstmt.getGeneratedKeys();
if (rs.next()) return rs.getLong(1); // 생성된 고유 ID 확보

5. 트러블슈팅 리포트 (Troubleshooting)

Task 1: 마이페이지 템플릿 태그 {{user_name}} 노출 이슈

문제: 마이페이지 접속 시 닉네임 칸에 실제 이름 대신 중괄호 태그가 그대로 표시됨.

원인: ResourceController에서 HTML 파일을 읽은 뒤 실제 유저 데이터로 치환(replace)하는 과정이 누락되었거나, HandlerMapping에서 정적 파일로만 인식하여 처리를 건너뜀.

해결: ResourceController 내에 /mypage 분기문을 추가하고 세션 유저 정보를 읽어 html.replace() 로직을 명시적으로 구현함.

Task 2: 프로필 수정 후 헤더 정보 미갱신

문제: DB 정보는 수정되었으나 메인 페이지 헤더의 이름과 사진이 로그아웃 전까지 바뀌지 않음.

원인: DB만 업데이트하고 서버 메모리 상의 HttpSession에 저장된 유저 객체는 이전 상태를 유지함.

해결: UserUpdateController 마지막 단계에서 session.setAttribute("user", updatedUser)를 호출하여 세션 정보를 최신화함.

Task 3: 댓글 리스트 과다 노출로 인한 레이아웃 파괴

문제: 댓글이 많아질 경우 게시물 피드가 지나치게 길어져 가독성 저하.

해결: ResourceController에서 댓글 리스트 생성 시 Math.min(size, 3)을 적용하여 상위 3개만 렌더링하고, 3개 초과 시 모든 댓글 보기(n개) 버튼을 동적으로 생성하도록 로직 개선.

6. 주요 구현 코드 (Key Implementation)

6.1 댓글 요약 및 버튼 생성 로직

// ResourceController.java 일부
int displayCount = Math.min(comments.size(), 3);
for (int i = 0; i < displayCount; i++) {
    // 상위 3개 댓글 리스트 빌드...
}

if (comments.size() > 3) {
    contentBuilder.append("<button id='show-all-btn'>")
                  .append("모든 댓글 보기(").append(comments.size()).append("개)")
                  .append("</button>");
}

7. AI 협업 리포트 (AI Assistance)

7.1 프롬프트 엔지니어링 성과

구조적 접근: 단순히 코드를 생성하는 것이 아니라, "DB 데이터와 세션 정보의 불일치"라는 근본 원인을 파악하기 위해 단계별 로직 검증을 요청함.

7.2 주요 피드백 및 로직 교정

데이터 오염 방지: 마이페이지에 중괄호({{user_name}})가 노출된 상태로 저장 시 DB 값이 오염될 수 있다는 AI의 경고를 바탕으로, ResourceController의 렌더링 우선순위를 재설정함.

세션 갱신 로직 보완: DB 수정 후에도 화면이 변하지 않는 '캐시 데이터 불일치' 문제를 session.setAttribute를 통한 실시간 갱신 로직으로 해결함.

조건부 렌더링 구현: 사용자 경험(UX) 최적화를 위해 댓글 리스트의 크기에 따라 HTML 요소를 동적으로 가공(3개 제한 및 버튼 노출)하는 복합 로직을 완성함.