C.W.K.
Stream
Lesson 01 of 05 · published

왜 대시보드가 필요한지

~15 min · dashboard, visibility, wireframe

Level 0Greenhorn
0 XP0/53 lessons0/14 achievements
0/100 XP to next level100 XP to go0% complete

인증 시스템은 silent 하게 실패해. 뭐가 잘못됐다는 첫 신호는 거의 알람이 아니야 — 화요일 오후의 막연한 느낌, 숫자가 안 맞는 느낌. 대시보드가 그 느낌을 30초에 증거로 바꿔.

솔로 auth 한테 "가시성" 이 진짜 뭘 의미하는지

물어볼 질문대시보드 없이대시보드와 함께
"지금 나 말고 누가 로그인돼 있어?"서버에 SSH, sqlite3 쿼리, row 파싱오른쪽 상단 카운터 glance
"이번 주 실패 로그인 시도 받았어?"rotation 가로질러 앱 로그 grep차트 하나, 지난 7일
"어떤 IP 가 blacklist 됐고 왜?"DB row 수동으로 읽기timestamp 있는 sortable 테이블
"지금 뭐 의심스러운 거 있어?"뭐가 명백히 깨질 때까지 모름상태 배지: 녹/황/적

최소한 viable 한 대시보드

Grafana 클론 만들고 싶은 충동 저항. 4 섹션, HTML 페이지 하나, JavaScript 프레임워크 필요 없음:

  1. 상태 헤더 — active session, 지난 시간 실패 시도, blacklist IP.
  2. Active session 테이블 — token prefix, IP, 생성, 만료, "Revoke" 버튼.
  3. 최근 시도 로그 — 성공/실패, IP, timestamp, 마지막 100.
  4. Killswitch 영역 — 큰 빨간 Revoke All, "unblock" 액션 있는 blacklist 테이블.

External links

Exercise

코딩 전 종이에 대시보드 스케치. 박스 4개: 상태 헤더, session 테이블, 시도 로그, killswitch 영역. 어느 게 좌상단 (가장 자주 glance) 일지 결정. 그다음 코드에서 그 4섹션 placeholder 가진 HTML 라우트 /admin/security 하나 만들어. 구조 먼저, 데이터 wiring 다음.

Progress

Progress is local-only — sign in to sync across devices.
이 페이지에서 버그를 발견하셨거나 피드백이 있으세요?문제 신고

댓글 0

🔔 답글 알림 (로그인 필요)
로그인댓글을 남기려면 로그인해 주세요.

아직 댓글이 없어요. 첫 댓글을 남겨보세요.