A two player online version of the classic card game.
Thanks for giving this project a star! ⭐️
Report Bug
·
Request Feature
Table of Contents
Cribbage Monster is an online version of the classic card game. The app is built with React and uses Firebase Realtime Database for storage and providing updates to clients via websocket.
You can check out the live playable version at Cribbage Monster.
Don't know how to play? Cribbage is a great card game! You can start here with learning the Rules of Crib.
Cribbage Monster started with the idea of building a small app as a holiday gift for relatives (notably my Dad), so that we can enjoy the family pastime when we aren't together.
Some highlights from what I wanted to accomplish and include in the project:
- create a multipage app with auth protected routing (React Router and Firebase)
- using Firebase Realtime Database Rules for data validation
- design a UI for gameplay that translates directly from mobile to desktop
- subscribing clients to the database via websocket for multiplayer gameplay
- experimenting with Anime.js for creating svg animations (and menu transitions)
- trying different strategies for conditional styles and animations with Tailwind
- building some basic dashboard components (rather than using VISX, MUI, or etc.)
- checking for dirty / clean disconnects from games
- cleaning up old game data with cloud functions
There is still more work and ideas I would love to add (or go back and change 😅), but I'm happy with where the project is at in terms of what I set out to make and I look forawrd to moving my focus to other projects.
- block out pages and routing
- Firebase auth
- block out game play UI
- game logic
- read/write game and app context from Firebase backend
- websocket subscription for in game clients
- game cleanup via cloud functions
- flush out UI
- presence for users in game
- improve type safety and validation for data from API
- custom avatar illustrations
- expand game play options
- computer opponent(s)
- ... 🏁
See the open issues for a list of open issues.
Contributions are what make the open source community such an amazing place to learn, inspire, and create. Any contributions you would like to make or suggest are welcomed!
If you have a suggestion that would make Cribbage Monster better, please fork the repo and create a pull request. You can also simply open an issue with the tag "enhancement". Note that you will not be able to run the project locally without setting up at dev backend with Firebase. If you would like assistance with this, please note that when opening an issue.
- Fork the Project
- Create your Feature Branch (
git checkout -b feature/AmazingFeature) - Commit your Changes (
git commit -m 'Add some AmazingFeature') - Push to the Branch (
git push origin feature/AmazingFeature) - Open a Pull Request
Distributed under the MIT License. See LICENSE.txt for more information.
Think you can beat me at a game or would like to reach out? I'm happy to hear from you!
ChrisCoastal: contactchriscoastal@gmail.com 🌊
Project Link: https://github.com/ChrisCoastal/cribbage-monster
- Thank you to everyone responsible for the libraries, packages, and other code that has made this project possible. 🙏
- Thanks as always to the authors of the innumerable articles, Stack Overflow answers, and other resources that were life savers. ⛑
- Thanks to my Mom and Dad for teaching me how to play cards. 🃕🂵🂥🃋 🃅