Escape Room
A browser-based horror escape-room game on the MERN stack: sign up, solve puzzle levels against a timer, post your time to a leaderboard, leave a review. My first full client-server-database build.
The brief
A themed horror escape room in the browser. A React SPA carries the storyline and the puzzle levels (level one ships its own self-contained HTML, CSS and JS puzzle assets inside the React shell), players sign up and log in with bcrypt-hashed passwords, a timer tracks the run, and finishing times post to the backend and rank on a leaderboard. A review section closes the loop.
Architecture
- Backend. Express and Mongoose with a single API router: signup, login, users, reviews, and the time-submission endpoint that feeds the leaderboard. Three models: User, Review, Time.
- Frontend. Create-React-App with React Router v6 and MUI: home, storyline, level, login, leaderboard, review and about pages.
- Ops. One
npm run devruns server and client together, with a Heroku post-build script for deployment.
Why it’s on this site
This is where the full-stack thread starts, in second year, and the line from here runs through DanceIt to Bill2Go. It is 2022 student code and reads like it (one route is even registered with a hard-coded absolute URL, a bug we shipped and I now find funny). The point is the complete loop: real auth, real persistence, real gameplay state, deployed target. Everyone’s first full app should be this finished.
Credit
Semester-3 team build.