BRAG
← 자랑 목록으로
💻 코드/앱· 2026년 6월 12일

심심해서 만든 네온 미니게임 모음 - ARCADE LAB

반응속도, 기억력 테스트하는 토이 미니게임 4종 가볍게 만들어봤어요

빠야야마토토
Lv.1 → Lv.20 / 100 XP
팔로워 0
0
자랑
0
누적
0
누적
프로필 보기 →
48 2
ReactTypeScriptViteTailwind CSS

자랑 포인트

  • 서버/DB 없이 순수 클라이언트로만 동작 - 기록은 localStorage에 저장
  • CRT 스캔라인·네온 글로우·픽셀 폰트로 만든 레트로 아케이드 비주얼
  • "치타급/금붕어급" 같은 재미있는 등급 시스템 + 상위 퍼센트 표시

주말에 손가락 좀 풀 겸 가볍게 만들어본 미니게임 모음이에요. 거창한 거 없고 그냥 반응속도랑 기억력 테스트하는 작은 게임 4개 모아놨습니다.

네온 아케이드 감성으로 꾸며봤는데, CRT 스캔라인이랑 글로우 효과 넣으니까 의외로 분위기가 살더라고요. 서버 없이 순수 클라이언트로만 돌아갑니다.

ARCADE LAB 로비

주요 기능

심심풀이용이라 게임 자체는 단순한데, 그래도 4종류 넣었어요.

  • REACTION — 초록불 켜지면 바로 탭하는 반응속도 테스트. 5회 평균 ms 재줍니다. 생각보다 손이 늦더라고요
  • SEQUENCE — 3x3 타일 켜지는 순서 기억하고 따라 누르기. 레벨 올라갈수록 길어져서 금방 머리 아파져요
  • NUMBER — 잠깐 보여주는 숫자 외워서 입력하기. 3자리부터 시작해서 점점 늘어남
  • AIM LAB — 20초 동안 타겟 빠르게 클릭, 콤보 보너스까지

결과 나오면 "치타급 반응속도!" "금붕어급..." 같은 등급도 붙여주고, 베스트 기록은 localStorage에 저장돼서 다음에 들어와도 남아있어요.

기술 이야기

React 19 + TypeScript에 Vite로 말았어요. 스타일은 Tailwind v4 썼는데 새 vite 플러그인 방식이 편하더라고요. 서버나 DB 같은 거 전혀 안 쓰고 기록도 localStorage로 때워서, 그냥 Vercel에 올리니까 바로 끝났습니다. 토이 프로젝트는 이렇게 가볍게 가는 게 마음 편해요.

모바일 화면

모바일에서도 터치로 잘 되니까 심심할 때 한 번씩 눌러보세요. 다들 반응속도 몇 등급 나오는지 궁금하네요.

댓글 2

0/1000
아직 댓글이 없어요. 첫 댓글을 남겨보세요!