레거시 JSP 관리자 화면 모바일 대응

feat: 불필요 메세지 정리

JSP UI 작업은 레거시 환경에서 어떻게 사용성을 올릴 수 있는지 계속 고민하게 만듦.

테이블 레이아웃 개선

모바일에서 가로 스크롤 없이 보이게 하는 게 과제였음. 카드형 뷰로 폴백 처리함.

<%-- PC: 테이블 형태 --%>
<div class="admin-table-wrapper d-none d-md-block">
  <table class="table">...</table>
</div>

<%-- 모바일: 카드 형태 --%>
<div class="card-list-wrapper d-md-none">
  <c:forEach var="item" items="${list}">
    <div class="card mb-2"><div class="card-body">...</div></div>
  </c:forEach>
</div>

colspan 동적 처리

document.querySelectorAll('.auto-colspan').forEach(td => {
  const cols = td.closest('table')
    .querySelector('thead tr')
    .querySelectorAll('th').length;
  td.setAttribute('colspan', cols);
});

성능 최적화

항목	개선
이미지 lazy load	`loading="lazy"` 추가
AJAX 조회	디바운스 적용

개발 원칙 정리

이 작업을 진행하면서 재확인한 원칙들:

작은 커밋: 변경 단위를 작게 유지해서 코드 리뷰와 롤백이 쉽게.

테스트 먼저: 변경 전 현재 동작을 파악하고, 변경 후 동일하게 동작하는지 확인.

문서 동기화: 코드가 바뀌면 관련 주석과 문서도 같이 업데이트.

원칙	이유
단일 책임	하나의 함수/클래스는 하나의 역할만
명시적 코드	영리한 코드보다 읽기 쉬운 코드
실패 우선 처리	happy path보다 에러 케이스 먼저 설계