LobbyX is a React-based application designed for a casino games list lobby. This project showcases a user-friendly interface for browsing and searching through a list of casino games. It is built using Next.js, TypeScript, Tailwind CSS, and Redux for the front end, and Java Spring Boot for the back end.
Search functionality to find games quickly.
Lazy loading for efficient performance.
Detailed view of game image and name.
Scalable and well-structured codebase.
Docker containerization for easy deployment.
Performance Metrics
Lighthouse Scores: 99% Performance, 100% SEO, 95% Best Practices, 93% Accessibility.
Installation and Running the Project
Frontend To run the frontend part of the application in a Docker container, execute the following commands in your terminal:
- 🏗️ build the project:
./build-docker.sh
./run-docker.sh- 🏃 run th project:
docker run -d -p 3000:3000 lobbyx-frontend:latest
# logs could be found by:
docker logs <container_id>Backend Similarly, to set up and run the backend:
- 🏗️ build the project:
./build-docker.sh
./run-docker.sh- 🏃 run th project:
docker run -d -p 9080:9080 lobbyx:latest
# logs could be found by:
docker logs <container_id>
API Endpoints The back end provides several API endpoints for interacting with the games database. For details on available endpoints and their usage, please refer to the API documentation section.
- I haven't included environment variables for the backend or frontend in the project, even though they should be there. This is because I hosted the database on a VPS, and I didn't have enough time to configure it for proper communication.
Contact For any further queries or suggestions, please contact contact@matboud.com.