한뼘코딩 ABCDE API 연동 게시물 관리 페이지

앱 개요

이 애플리케이션은 '한뼘코딩 ABCDE API'를 이용하여 학교 관련 발표 자료 목록을 등록, 조회, 수정, 삭제하는 프론트엔드 인터페이스입니다.

사용자는 학교 이름, 이름, 주제, URL, 설명을 입력하여 새로운 항목을 추가할 수 있으며, 모든 항목은 지정된 API 엔드포인트를 통해 서버에 저장 및 관리됩니다. 목록은 학교 필터링 및 최신순 정렬을 지원합니다.

실행 방법

1. 이 프로젝트 폴더(readme_batch/post_652_20260404192050/)를 로컬 컴퓨터에 다운로드합니다.
2. index.html 파일을 더블 클릭하여 웹 브라우저에서 직접 실행합니다.
3. (참고) 본 애플리케이션은 백엔드 API 서버(https://www.한뼘코딩.com/api)와의 통신을 전제로 동작합니다.

파일 목록

• index.html: 애플리케이션의 구조와 레이아웃을 담당하는 메인 HTML 파일입니다.
• style.css: (현재 프로젝트 구조상 별도 분리된 스타일 파일은 사용되지 않고, Tailwind CSS가 인라인으로 사용되었습니다.)
• app.js: 비즈니스 로직, API 통신, DOM 조작을 담당하는 핵심 JavaScript 파일입니다.
• README.md: 이 문서를 보고 있습니다.

사용 방법

1. 신규 등록: 상단의 '새 항목 등록' 섹션에 필요한 정보를 모두 채우고 '등록하기' 버튼을 누릅니다. (API 호출)
2. 목록 조회: '목록 새로고침' 버튼을 누르거나 페이지 로드 시 최신 목록을 불러옵니다.
3. 필터링: '학교 필터'에서 특정 학교를 선택하여 목록을 좁힐 수 있습니다.
4. 관리자 기능 (Admin): 제목(<h1>)을 5회 연속으로 클릭하면 관리자 모드가 활성화됩니다. 이 모드에서 목록 항목별 '수정' 및 '삭제' 버튼이 나타납니다. (실제 관리자 권한 확인 및 API 호출이 이루어집니다.)

작업 진행 상황 — Honest checklist:

• 완료된 항목: 모든 기능 (CRUD, 필터링, 상태 표시, 관리자 모드 토글)이 기존 코드를 기반으로 완전하게 동작하는 상태로 유지되었습니다.
• 진행 중·부분 완료: 없음.
• 미완료·예정: 없음. (요청된 것은 README 갱신 및 기존 코드 유지였으므로, 모든 부분이 완료됨)

이어서 작업하기 — Concrete steps to resume:

(1) 프로젝트 경로는 local_agent_sandbox/readme_batch/post_652_20260404192050/ 입니다.
(2) 수동: 코드 수정 시, 반드시 모든 파일(HTML, CSS, JS)의 내용을 백업 후 비교해 주십시오.
(3) With Ollama: admin-tools/hanco_admin/sandbox_agent.py 또는 hanco 관리자 도구 GUI를 사용하십시오. 프롬프트에 상대 경로와 구체적인 변경 사항을 명시하세요. 예: "readme_batch/post_652_20260404192050/app.js 파일에서 삭제 버튼의 에러 핸들링 로직을 개선해줘."
(4) 변경 후에는 반드시 이 README 파일의 '작업 진행 상황' 섹션을 업데이트하십시오.