Back to project
Catsino

Catsino

Project Overview

DEMO: https://catsino-alpha.vercel.app/

The Catsino project is a whimsical and fun casino game featuring cats. The project combines modern web technologies to create an engaging user experience where players can play simple games, view leaderboards, and enjoy cat-themed entertainment.

Short Explanation

I created Catsino as a weekend project to showcase the integration of various technologies and to provide a playful environment for users to enjoy. The project includes a landing page fetching a limited number of photos from an external API, user authentication using NextAuth and MongoDB, and dynamic routes for the game. Deployed using GCP and Docker, Catsino demonstrates a full-stack approach to web development.

Tech Stack

  • Next.js: Utilized for its server-side rendering and dynamic routing capabilities, enhancing both performance and user experience.
  • Express.js: Powers the backend, handling API requests and user data.
  • MongoDB: Serves as the database for storing user information and game results.
  • NextAuth: Manages user authentication, providing secure login and registration features.
  • GCP (Google Cloud Platform): Used for deploying the application, ensuring scalability and reliability.
  • Docker: Facilitates containerization, making deployment straightforward and consistent.

App Demo

Explore the live demonstration of Catsino, where you can log in, view the leaderboard, and play games. The playful theme and simple mechanics are designed to provide a light-hearted and enjoyable user experience.

Catsino Demo

Click on the image above to visit the live site.

Features Implemented

  • Landing Page: Fetches and displays a limited number of photos from an external API.
  • User Authentication: Secure sign-in and registration using NextAuth and MongoDB.
  • Protected Routes: Access to the leaderboard and games only available to logged-in users.
  • Leaderboard: Displays the top 10 players based on wins, combining data from an external API and the database.
  • Games Route: Fetches and displays 1000 game cards without blocking the app, each leading to a simple game on click.

Challenges Faced

  • API Integration: Ensuring smooth and efficient data fetching from external APIs without blocking the app.
  • User Authentication: Implementing secure and user-friendly authentication processes.
  • Dynamic Routing: Creating and managing dynamic routes for different game cards.
  • Deployment: Containerizing the application with Docker and deploying on GCP for scalability and reliability.

Conclusion

Catsino was a simple app built as a weekend project to keep my skills sharp and build something fun. It demonstrates the integration of several technologies and serves as a light-hearted, engaging example of modern web development practices.

Disclaimer: This project was created for educational and entertainment purposes only.