막번호 (MakNumber)

막 쓸 비밀번호, 편하게 막 만들어요.

🌐 라이브: maknumber.vercel.app

막번호란?

막번호는 1회성 웹사이트 가입을 위한 즉석 비밀번호 생성기입니다. 사이트마다 미묘하게 다른 비밀번호 정책(길이, 특수문자 종류, 대소문자 포함 여부 등)을 옵션으로 입력하면, 조건을 모두 만족하는 비밀번호를 그 자리에서 만들어 줍니다.

• 즉석 생성 — 입력한 조건이 모두 반영된 비밀번호 생성, 첫 글자는 항상 영문자(사이트 호환성)
• 강도 측정 — zxcvbn 기반 점수 + 한국어 예상 크랙 시간
• 위험 패턴 경고 — qwerty / 12345 / password 등 5종 카테고리 감지
• 사이트별 프리셋 6종 — 일반 / 강화 / 네이버 / 구글 / 은행권 / 게임
• 직접 편집 — 생성된 비번을 손으로 고치면서 강도·구성 실시간 확인
• 세션 히스토리 — 이번 세션에서 만든 비번 최대 20개 목록 + 즐겨찾기 (메모리 only, 새로고침 시 모두 소거)
• 다크모드 토글 — 시스템 추종 + 우측 상단 수동 전환
• 100% 브라우저 안 동작 — 서버 통신·저장·추적 없음

왜 만들었나

자주 갈 사이트의 중요한 비밀번호는 본인이 따로 관리하기 마련입니다. 문제는 단발성 가입입니다. 이벤트 응모, 일회용 회원가입 같은 곳에까지 패스워드 매니저를 동원하기엔 번거롭고, 그렇다고 qwerty123 같은 걸 쓰면 정책에 막히거나 위험합니다.

막번호는 그 빈자리를 메우는 도구입니다. "중요하지 않은 1회성 사이트" 전용이라는 점을 분명히 합니다. 본 도구는 비밀번호를 저장하지 않으며, 저장 기능을 추가하지도 않을 계획입니다.

사용법

기본

1. 페이지에 접속하면 기본 옵션("일반" 프리셋)으로 비밀번호가 이미 생성되어 있습니다.
2. 가입할 사이트 정책에 맞게 프리셋을 선택하거나 옵션을 조정합니다.
   • 길이 (4~64), 슬라이더 또는 숫자 입력
   • 대문자 / 소문자 / 숫자 / 특수문자 포함 여부
   • 특수문자 모드 — 전체 (32종) 또는 일부 (안전한 8종 ! @ # $ % ^ & *)
   • 혼동되는 문자 제외 (O, 0, l, 1, I)
3. [복사] 버튼으로 클립보드에 복사 후 가입 폼에 붙여넣기.
4. 마음에 들지 않으면 [새로 만들기] 로 다시 생성.

직접 편집

• 비번 박스 우측 상단 ✏️ 아이콘 클릭
• 입력하면 길이 카운터(12/64), 문자 구성(대 3·소 4·숫 3·특 2), 강도 바, 위험 패턴 배너가 실시간 업데이트
• ✓ 완료 (Enter 키도 동일) 또는 ↩ 되돌리기
• ASCII 인쇄 문자만 입력 가능 (한글·이모지는 자동 차단)

세션 히스토리

• 옵션 카드 아래 "이번 세션 비밀번호" 영역에 만든 비번이 자동 누적
• 카드 클릭 → 그 비번을 메인으로 가져오기
• ⭐ 클릭 → 즐겨찾기 (좌측 고정, 20개 한도에서 자동 삭제 면제)
• X 클릭 → 그 카드만 삭제
• "모두 지우기" → 즐겨찾기를 제외한 모든 항목 일괄 삭제
• ⚠️ 새로고침 시 히스토리는 모두 사라집니다 (메모리 only)

다크/라이트 모드

• 첫 진입 시 시스템 prefers-color-scheme 자동 추종
• 헤더 우측 🌙/☀️ 토글로 그 세션 동안 전환 가능 (영구 저장 안 함)

보안 안내

막번호는 다음 원칙을 지킵니다.

• 서버 전송 없음 — 비밀번호는 어떤 외부 서버로도 전송되지 않습니다. 네트워크 요청 자체를 만들지 않습니다.
• 저장 없음 — localStorage / sessionStorage / IndexedDB / 쿠키 등 어떤 영구 저장소에도 비밀번호를 기록하지 않습니다. 세션 히스토리도 메모리(React state)에만 존재합니다.
• 추적 없음 — Google Analytics / Vercel Speed Insights 등 어떤 분석·텔레메트리 SDK도 포함하지 않습니다.
• 새로고침 시 초기화 — 페이지를 다시 불러오면 메인 비번·히스토리· 편집 내용 모두 사라집니다.
• 안전한 난수 사용 — 브라우저의 crypto.getRandomValues() 만 사용하며 편향 없는 정수 추출(rejection sampling) 보장. 예측 가능한 Math.random() 은 사용하지 않습니다.

코드가 공개되어 있으니 위 약속이 실제로 지켜지는지 직접 확인하실 수 있습니다.

알아두세요

• 막번호는 중요한 사이트(메일, 금융 본인인증, 업무 계정 등)에는 사용하지 마세요. 그런 비밀번호는 본인이 직접 안전하게 관리해야 합니다.
• 복사된 비밀번호는 클립보드에 남아 있을 수 있습니다. 다른 내용을 복사해 덮어쓰거나 클립보드를 비워 주세요.
• 자동 입력기/브라우저 기억 기능을 끄고 사용하는 것을 권장합니다.
• 히스토리는 같은 탭/창에서만 유지됩니다. 중요한 비밀번호는 미리 복사해 두세요.

로컬 실행 방법

요구사항: Node.js 18.17+ (개발 환경은 Node 25 기준 검증).

# 의존성 설치
npm install

# 개발 서버 (http://localhost:3000)
npm run dev

# 프로덕션 빌드 — 결과는 `out/` 폴더에 순수 정적 파일로 생성됨
npm run build

배포 (정적 호스팅)

npm run build 후 생성되는 out/ 폴더가 그대로 결과물입니다. 서버 런타임이 필요 없는 100% 정적 사이트이므로 다음 어디든 그대로 올리면 됩니다.

• 로컬 미리보기: npx serve out → http://localhost:3000
• Vercel / Netlify: 저장소 연결 → Build command: npm run build / Output directory: out 만 지정
• GitHub Pages: out/ 의 내용을 gh-pages 브랜치에 푸시
• Amazon S3 / Cloudflare Pages / 기타: out/ 의 모든 파일을 호스팅 루트에 업로드

외부 폰트/CDN/Analytics 등 어떤 외부 도메인에도 요청하지 않으므로 CSP 설정이 간단합니다(default-src 'self' 로 충분).

기술 스택

• Next.js 16 (App Router · 정적 export)
• React 19
• TypeScript 5
• Tailwind CSS v4 + shadcn/ui
• zxcvbn (강도 측정, 동적 import)
• Noto Sans KR (OG 이미지 한글 폰트, @fontsource 로 로컬 임베드)
• crypto.getRandomValues() (브라우저 표준 난수)
• 외부 폰트·CDN·analytics 의존성 0건 — 정말 100% 자기 호스트

라이선스

MIT © 2026 dandanhandol

코드 자유롭게 사용·수정·재배포 가능합니다. "서버 전송 없음·저장 없음" 같은 보안 약속이 코드 차원에서 지켜지는지 누구나 검증해 보세요.