고고고! 사진퍼즐
상단 점프 메뉴에서 토끼와 함께 박자를 익히는 콩콩! 리듬 점프를 즐길 수 있습니다. public/jump/에 독립적인 정적 게임을 포함하므로 로그인 없이 열립니다. 선택한 속도로 8박자 시범을 보여주고, 마지막 5박자에 큰 숫자 5·4·3·2·1을 표시한 뒤 직접 플레이합니다. 글꼴과 소리도 사이트 안에서 제공하며, 게임 로고를 누르면 고고고 메뉴로 돌아갑니다.
점프 게임을 갱신하려면 최신 게임의 dist/ 폴더를 지정해 node scripts/import-jump.mjs PATH_TO_DIST를 실행한 뒤 빌드·배포합니다. 이 작업은 변경된 파일 이름에 내용 해시를 넣고 메뉴 링크의 버전도 갱신합니다. Jua 글꼴은 Google Fonts의 원본을 사용하며 라이선스는 public/jump/OFL.txt에 포함합니다.
상단의 말랑 블록 메뉴에서 핑크 테마의 어린이 블록 퍼즐도 즐길 수 있습니다. 게임은 public/blocks/의 독립적인 정적 페이지이며 사진 업로드·로그인 없이 작동합니다. 블록을 놓고 가로·세로 줄을 완성하며, 모서리 기준 미리보기·되돌리기·진행 저장·꽃 보상을 제공합니다. 메뉴에서 게임으로 이동하면 사진 퍼즐의 진행 중 사진은 보관되지 않습니다.
찍고, 자르고, 붙이고. 고고고! Camera/gallery → crop → puzzle. Phone layouts show six large pieces at a time with previous/next controls and advance when a tray is completed. Returned pieces fill the earliest empty tray slots, and the app opens their tray page. The editor keeps a large start button at the bottom of the phone screen, with difficulty chosen before starting. Touch controls are at least 44px where practical.
Korean, mobile-first photo puzzles for young children. Built with Next.js App Router, TypeScript, React and browser APIs. The deployed app is static HTML/CSS/JavaScript; there is no API, backend, authentication, analytics or cloud storage.
Develop and build
Use Node.js 22 or newer.
npm install
npm run dev
Open http://localhost:3000. Development uses / and does not register a service worker.
npm run typecheck
npm test
npm run build
npm run preview
npm run build exports out/ and then generates the offline worker from the actual exported files. Preview serves only these files at http://127.0.0.1:4173/gogogo/, including real 404 responses. It does not run Next.js or provide any app backend.
Production defaults to /gogogo. For another repository or a custom domain, set NEXT_PUBLIC_BASE_PATH consistently at build and preview time; use an empty string for a root-domain site. basePath also prefixes Next's static assets, so a second assetPrefix is unnecessary. Asset links share src/lib/paths.ts. Manifest URLs are relative to the manifest, making its start URL, scope and icons safe at either path. The post-build script also adds dotted aliases for any nested Next.js segment-data files, so static hosting serves route prefetch requests without rewrites or 404s.
GitHub Pages deployment
- Put this project in your
gogogo GitHub repository. If the folder has no repository yet, run git init -b main and git remote add origin https://github.com/neegiman/gogogo.git.
- In the repository, open Settings → Pages → Build and deployment → Source → GitHub Actions. Ensure Actions is enabled.
- Push to
main:
git add .
git commit -m "Add photo puzzle app"
git push -u origin main
.github/workflows/deploy.yml runs npm ci, TypeScript checks, rule tests and npm run build, uploads out/ using actions/upload-pages-artifact, and publishes with actions/deploy-pages. No manual copying is needed. The deployment job links to the final Pages URL, such as https://neegiman.github.io/gogogo/.
If your default branch is not main, update the workflow trigger. If your repository is not gogogo, update NEXT_PUBLIC_BASE_PATH in the workflow. .nojekyll is included for compatibility. The lockfile pins the verified dependency versions.
Project structure
.github/workflows/deploy.yml Pages build and deployment
public/ Bundled sample, icons, manifest, local sounds
scripts/
prepare-public.mjs Generates PNG icons, WAV chimes and manifest
build-offline.mjs Versioned worker based on exported resources
preview.mjs Static-only repository-path preview
src/
app/ Static layouts and /, /puzzle/, /records/ routes
components/ Photo selector, editor, puzzle, rewards, records, PWA
hooks/ Image gestures, placement, challenges and timer
lib/ Image normalization, puzzle rules, storage, audio, paths
types/ Difficulty, normalized pieces and record models
tests/ Rule tests and production browser scenarios
여기까지가 README 앞부분입니다. 나머지는 원문에서 읽을 수 있습니다. README 전문 보기 ↗
