# 2026-02-02 전체 페이지 검토 보고서 ## 개요 31개 HTML 페이지에 대한 종합 검토를 실시했습니다. **검토 항목:** 1. 사이드바 스크립트 포함 여부 2. 경로 오류 3. 이모지 사용 (CODING_GUIDE 위반) 4. 하드코딩된 링크 오류 5. 코드 품질 이슈 --- ## 종합 결과 | 카테고리 | 페이지 수 | 사이드바 | 이모지 위반 | 인라인 스타일 | 경로 오류 | |----------|:--------:|:--------:|:-----------:|:------------:|:---------:| | work/ | 4 | 0/4 | 4/4 | 4/4 | 0/4 | | safety/ | 7 | 0/7 | 3/7 | 5/7 | 0/7 | | attendance/ | 8 | 0/8 | 8/8 | 6/8 | 0/8 | | admin/ | 9 | 6/9 (직접작성) | 9/9 | 7/9 | 0/9 | | profile/ | 2 | 0/2 | 2/2 | 1/2 | 1/2 | | dashboard | 1 | 1/1 | 1/1 | 1/1 | 0/1 | | **합계** | **31** | **7/31** | **27/31** | **24/31** | **1/31** | --- ## 카테고리별 상세 ### 1. work/ (4개) | 파일 | 사이드바 | 이모지 | 인라인 스타일 | 비고 | |------|:-------:|:------:|:------------:|------| | tbm.html | navbar만 | 21개 | 92개 | 가장 심각 | | report-create.html | navbar만 | 5개 | 29개 | 중간 | | report-view.html | navbar만 | 8개 | 6개 | 양호 | | analysis.html | navbar만 | 65개 | 23개 | 이모지 최다 | **총 이모지: 99개** (콘솔 로그 포함) ### 2. safety/ (7개) | 파일 | 사이드바 | 이모지 | 인라인 스타일 | 비고 | |------|:-------:|:------:|:------------:|------| | management.html | navbar만 | 0개 | 다수 | 양호 | | training-conduct.html | navbar만 | 1개 | 다수 | 양호 | | checklist-manage.html | navbar만 | 8개 | 다수 | CSS 하드코딩 | | issue-report.html | navbar만 | 0개 | 적음 | 우수 | | issue-list.html | navbar만 | 0개 | 적음 | 우수 | | issue-detail.html | navbar만 | 0개 | 적음 | 우수 | | visit-request.html | navbar만 | 2개 | 다수 | 양호 | **총 이모지: 11개** ### 3. attendance/ (8개) | 파일 | 사이드바 | 이모지 | 인라인 스타일 | 비고 | |------|:-------:|:------:|:------------:|------| | daily.html | navbar만 | 5개 | 다수 | - | | monthly.html | navbar만 | 2개 | 다수 | - | | vacation-request.html | navbar만 | 3개 | 다수 | - | | vacation-approval.html | navbar만 | 2개 | 다수 | - | | vacation-input.html | navbar만 | 3개 | 다수 | - | | vacation-management.html | navbar만 | 3개 | 다수 | - | | vacation-allocation.html | navbar만 | 2개 | 적음 | CSS 분리됨 | | annual-overview.html | navbar만 | 2개 | 적음 | CSS 분리됨 | **총 이모지: 22개** ### 4. admin/ (9개) | 파일 | 사이드바 | 이모지 | 인라인 스타일 | 비고 | |------|:-------:|:------:|:------------:|------| | accounts.html | 없음 | 9개 | 다수 | - | | page-access.html | 없음 | 5개 | 다수 | - | | workers.html | HTML 직접 | 26개 | 중간 | 사이드바 중복 | | projects.html | HTML 직접 | 20개 | 중간 | 사이드바 중복 | | tasks.html | HTML 직접 | 20개 | 중간 | 사이드바 중복 | | workplaces.html | HTML 직접 | 22개 | 다수 | Canvas 복잡 | | equipments.html | HTML 직접 | 12개 | 중간 | - | | codes.html | HTML 직접 | 23개 | 중간 | 탭 시스템 | | attendance-report.html | 없음 | 6개 | 심각 | 인라인 JS 포함 | **총 이모지: 143개** ### 5. profile/ (2개) | 파일 | 사이드바 | 이모지 | 인라인 스타일 | 비고 | |------|:-------:|:------:|:------------:|------| | info.html | navbar만 | 9개 | 적음 | 링크 오류 1개 | | password.html | navbar만 | 12개 | 적음 | - | **총 이모지: 21개** **링크 오류**: info.html에서 `/pages/profile/change-password.html` → `password.html`로 수정 필요 ### 6. dashboard.html | 파일 | 사이드바 | 이모지 | 인라인 스타일 | 비고 | |------|:-------:|:------:|:------------:|------| | dashboard.html | ✅ 있음 | 3개 | 다수 | 범례/모달 인라인 | --- ## 주요 문제점 ### 1. 이모지 사용 (CODING_GUIDE 위반) 🔴 **CODING_GUIDE 규정:** > "모던하고 깔끔한 디자인: 이모지 사용 지양, 아이콘 또는 심플한 텍스트 사용" **현황:** - 31개 페이지 중 27개에서 이모지 사용 - 총 이모지 사용: 약 300개 이상 - 가장 심각: `analysis.html` (65개), `workers.html` (26개), `codes.html` (23개) **주요 사용 위치:** - 페이지 제목 (``) - 버튼 아이콘 (`<span class="btn-icon">`) - 섹션 헤더 - 콘솔 로그 (analysis.html) ### 2. 사이드바 불일치 🟡 **현황:** - dashboard.html만 `load-sidebar.js` 사용 - admin/ 6개 페이지는 사이드바 HTML 직접 포함 (중복 코드) - 나머지 페이지는 사이드바 없음 (navbar만) **문제점:** - 일관성 부족 - 코드 중복 (admin/ 페이지들) - 유지보수 어려움 ### 3. 인라인 스타일 과다 사용 🟡 **심각한 파일:** - `tbm.html`: 92개 - `attendance-report.html`: style 블록 + 인라인 JS - `workplaces.html`: 200줄 이상 - `dashboard.html`: 모달/범례 전체가 인라인 **문제점:** - CSS 변수 미사용 (CODING_GUIDE 위반) - 스타일 재사용 불가 - 유지보수 어려움 ### 4. 하드코딩된 색상값 🟢 일부 페이지에서 CSS 변수 대신 하드코딩된 색상 사용: - `#3b82f6`, `#2563eb`, `#e5e7eb` 등 - CODING_GUIDE: `var(--primary-500)` 등 CSS 변수 사용 권장 --- ## 권장 조치사항 ### 🔴 높은 우선순위 1. **이모지 제거 작업** - 모든 페이지의 이모지를 텍스트 또는 CSS 아이콘으로 교체 - 예시: `📊` → "통계" 또는 CSS `::before` 아이콘 2. **사이드바 통일** - 모든 페이지에 `load-sidebar.js` 적용 - admin/ 페이지의 직접 작성된 사이드바 제거 3. **링크 오류 수정** - `profile/info.html`: `change-password.html` → `password.html` ### 🟡 중간 우선순위 4. **인라인 스타일 분리** - 각 페이지별 CSS 파일 생성 또는 공통 CSS 확장 - `tbm.html`, `attendance-report.html` 우선 5. **하드코딩 색상 → CSS 변수** - checklist-manage.html 등 ### 🟢 낮은 우선순위 6. **콘솔 로그 이모지 제거** (analysis.html) 7. **코드 중복 제거** (Axios 설정 등) --- ## 작업 계획 | 단계 | 작업 | 예상 파일 수 | |:---:|------|:-----------:| | 1 | 이모지 제거 - 버튼/제목 | 27개 | | 2 | 사이드바 통일 | 30개 | | 3 | 인라인 스타일 분리 | 10개 (심각한 것만) | | 4 | CSS 변수 적용 | 5개 | --- ## 결론 현재 코드베이스는 기능적으로는 잘 작동하지만, CODING_GUIDE 준수율이 낮습니다. - **CODING_GUIDE 준수율**: 약 40% - **가장 시급한 문제**: 이모지 사용 (300개+) - **구조적 문제**: 사이드바 불일치, 인라인 스타일 단계적으로 리팩토링을 진행하여 코드 품질과 유지보수성을 향상시킬 것을 권장합니다.