2026년 9월 6일 일요일

[행정/연구] 생기부 기초 데이터 오류 검출기 - 드래그 앤 드롭 1초 리포트



야근의 대조 작업이 1초 리포트로 — 생기부 기초 데이터 정제 & 오류 검출기 완전 정복

🔍 학기말 나이스 입력 전, 각 교사가 수합한 출결 일수·봉사 시간·독서 기록 목록 파일을 화면에 드래그 앤 드롭(drag and drop)으로 놓으면 — 누락된 학생 번호, 빈 칸, 서식 위반, 중복 항목을 1초 만에 찾아 빨간색 하이라이트 리포트로 정리합니다.

실행기는 단일 HTML 브라우저 도구 — 파이썬 설치·터미널 명령 없이 더블클릭으로 열립니다. 원본 데이터는 처리 후 저장되지 않고(세션 휘발 — 완료 후 새로고침 권장), 외부 전송 일절 없음 — 민감한 생기부 데이터가 학내망 안에서만 다뤄집니다.

📖 한 줄 정의

심기 모드(데이터 임베딩): API 데이터를 미리 받아 HTML 파일 안 상수로 박아두는 방식(앱 실행 중 외부 통신 0).

학내망 원칙: 학교 배포 웹앱은 개인정보 수집·저장·전송 없음(외부 CDN·API 호출 0, 단일 파일) — 학생은 학내망에서 교사 PC 서버에 접속.

1. 3대 핵심 분석 비교표

무엇이 바뀌었나요? / 영역 초보자를 위한 쉬운 설명 이렇게 한번 써보세요!
해결 문제 수백 명 데이터를 일일이 눈으로 대조하던 학기말 야근 — 검출 규칙 4종이 자동으로 대신 대조합니다. 리포트 화면 확인.
드래그 앤 드롭 실행기 엑셀(CSV) 파일을 화면에 놓으면 즉시 검사 — 파이썬·터미널·설치 없이 더블클릭으로 열리는 브라우저 실행기. drop zone 올려보기.
검출 규칙 4종 ① 누락 번호(연번 빠짐) ② 빈 칸(필수 열) ③ 서식 위반(날짜 형식·음수) ④ 중복 번호 — 규칙은 상수라 학기마다 수정 가능. RULES 상수.
빨간 하이라이트 리포트 문제 행은 빨간색 배경·굵은 글씨로 표시하고 문제 요인(누락·빈칸·서식·중복)을 열별로 요약 — 수정할 곳이 한눈에. 리포트는 CSV 내보내기(로컬)로 보존 가능. .bad 서식.
원칙·정합 원본 데이터는 저장하지 않음(세션 휘발 — 처리 후 새로고침 권장), 표기는 학생 번호 기준(실명 파싱 금지), 외부 전송 일절 없음 — 생기부 데이터의 학내망 완결. 세션 휘발 설계.

2. 핵심 아키텍처 해설

① 파일 읽기와 드래그 앤 드롭

dropZone.addEventListener("drop", function (e) {
  e.preventDefault();
  const reader = new FileReader();
  reader.onload = function () { parseCSV(reader.result); };
  reader.readAsText(e.dataTransfer.files[0]);
});

브라우저의 파일 읽기(FileReader)로 엑셀에서 내보낸 CSV를 메모리로 읽습니다 — 파일이 어디에도 복사되거나 전송되지 않습니다.

② 누락 번호 검출

function missingNos(rows, max) {
  const seen = rows.map(function (r) { return Number(r.no); });
  const missing = [];
  for (let n = 1; n <= max; n++) {
    if (seen.indexOf(n) === -1) missing.push(n);
  }
  return missing;
}

③ 서식 위반 검사

const RULES = [
  { col: "date", msg: "날짜 형식(YYYY-MM-DD)", ok: function (v) {
      return /^\d{4}-\d{2}-\d{2}$/.test(v); } },
  { col: "service", msg: "봉사 시간 0 이상", ok: function (v) {
      return Number(v) >= 0; } }
];

④ 빨간 하이라이트 리포트

.bad {
  background: #fee2e2;
  color: #b91c1c;
  font-weight: bold;
}

⑤ 원칙·정합

처리된 원본은 메모리에만 존재하고 화면 리포트로 요약됩니다 — 종료하면 남지 않습니다. 리포트 CSV(번호·항목·문제)만 로컬 저장으로 남겨 수정 작업에 활용하고, 파일 이름에 실명을 쓰지 않는 운영 수칙을 함께 안내합니다.

3. 초보자를 위한 바이브 코딩 실전 사용 예시

  1. 프롬프트 복사 — 아래 '제미나이 전용 에러 제로 프롬프트' 전체를 복사해 Gemini에 붙여넣습니다.
  2. 역질문 답변 — Gemini의 질문 3가지(데이터 열 구조, 학급 인원, 검출 규칙)에 답하면 설계가 확정됩니다.
  3. HTML 파일 실행 — 완성 코드를 '데이터검출기.html'로 저장 후 더블클릭 — 교무실 PC에서 파일을 놓는 순간 리포트가 완성됩니다.

제미나이 전용 에러 제로 프롬프트

[🚨 에러 방지 기본 안전장치]
1. 결과물은 외부 라이브러리·폰트·이미지 없이 단일 HTML 파일로 완성한다.
2. 사운드는 Web Audio API로 직접 합성한다: 검사 완료 '팡파르', 오류 발견 '삑'. 오디오 파일·CDN 금지.
3. 파일 입력은 화면에 놓는 드래그 앤 드롭과 파일 선택 버튼 2가지 모두 지원 — 브라우저 파일 읽기(FileReader)만 사용, 서버 업로드 금지.
4. 검출 규칙 4종 상수화: 누락 번호(연번), 빈 칸(필수 열), 서식 위반(날짜 YYYY-MM-DD·숫자 범위), 중복 번호 — 학기마다 수정 가능하게 상단 상수 배치.
5. 리포트는 문제 행 빨간색 하이라이트 + 요인 요약(누락/빈칸/서식/중복 카운트) 표시, '리포트 CSV 내보내기'는 로컬 파일 저장만 허용(서버·외부 전송 금지).
6. 원본 데이터는 어떤 저장소에도 남기지 않는다(세션 휘발) — 화면 상단에 '처리 후 새로고침 권장' 안내 상시 표기.
7. 표기는 학생 번호 기준(실명 파싱·저장 금지), 이름이 담긴 열은 검출 대상에서 제외하는 안전 옵션 제공.
8. // TODO, /* 생략 */ 같은 미완성 코드는 절대 넣지 말고 끝까지 완성한다.

[❓ 역질문 유도]
코드를 바로 만들지 말고, 아래 3가지를 먼저 나에게 질문한 뒤 내 답변으로 설계를 확정한다.
Q1. 데이터 열 구조는? (번호,출결일수,봉사시간,독서일자 기본)
Q2. 학급 인원은 몇 명까지? (연번 1~30 기본)
Q3. 검출 규칙에 추가할 것은? (음수·빈칸·형식 외에 범위 상한 등)

🎯 에디터 한줄평

무결성은 시간이 아니라 규칙의 문제라는 문장이 이 글의 결론입니다. 눈으로 대조하던 야근이 규칙 4종의 자동 검출로 바뀌면, 교사의 남는 시간은 데이터가 아니라 학생에게 돌아갑니다. 원본을 저장하지 않는 실행기 설계 — '도구가 데이터를 두면 안 된다'는 태도가 행정 데이터의 최고의 존중입니다.

📚 기술·교육 참고 링크

  • MDN — FileReader : 브라우저 파일 읽기와 드래그 앤 드롭
  • 교육·행정 연계: 행정 서식·규칙은 학내망 공개 자료 기준으로 활용하고, 학기마다 검출 규칙 상수를 갱신
By 시간:
라벨: ,