A simplified Tamagotchi-like game where you create and interact with a toad by feeding and educating it.
a full stack MERN application to sandbox new features im learning. this mern app has strong error handling with authentication in the backendm while the front end messes around with fancy css animations to add life into its components.
This project is purely for laughs and to remind me that I can have fun while learning.
No installation necessary. the database is hosted on MongoDB, the server is hosted on Render, and the client is hosted on Git Hub. All you have to do is visit the website and start playing.
This app is being hosted on Renders Free tier service, so it takes a minute to spin up the server. once the server is spun up, you can freely play around.
The email and password inputs are validated both on the front and back end, so you need a valid email and a strong password (8 characters in length, one number, and one capital letter)
![signup](https://private-user-images.githubusercontent.com/28990037/307937254-53a6b757-71f5-4e22-ba4d-ede19bc03f20.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjQxNDQ4MzYsIm5iZiI6MTcyNDE0NDUzNiwicGF0aCI6Ii8yODk5MDAzNy8zMDc5MzcyNTQtNTNhNmI3NTctNzFmNS00ZTIyLWJhNGQtZWRlMTliYzAzZjIwLnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNDA4MjAlMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjQwODIwVDA5MDIxNlomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPTQ4YTA1ZGVhODQxMDkwMGU2ZTgzNmNhZDcwYTAxMmU1Mzc0MGZkNjk2MTI0N2M4NThlM2QxYmJjNzQ0ZDkzOTQmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.MRgra4TcLB-QBD9XPCitM8BA8aYEIZMN5gOL7IkcJNs)
Now that you have an account, you will be prompted to name your new toad.
![Screenshot 2024-02-26 at 11 32 15 AM](https://private-user-images.githubusercontent.com/28990037/307937382-b212897f-7147-4009-bea2-0f15f48f4675.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjQxNDQ4MzYsIm5iZiI6MTcyNDE0NDUzNiwicGF0aCI6Ii8yODk5MDAzNy8zMDc5MzczODItYjIxMjg5N2YtNzE0Ny00MDA5LWJlYTItMGYxNWY0OGY0Njc1LnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNDA4MjAlMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjQwODIwVDA5MDIxNlomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPWRkZDk5ODgzYWIyZGMyNGFkYWZhZDJjZDA5NTYwYWNiMDA2YWZiMWY4YWU1M2Q0MjI0ZDliYTk2YWE3NWYwMzEmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.uepPJ6th_SivnxSJjrmfVzEMJkmFqTToSKnhHyHOqKg)
Once you've named your toad, the client will create a toad object and save it in the database. you can feed and educate your toad. once you've fed/interacted with your toad it will be 'full', and you won't be able to interact with your toad again until the health bars for each interaction have gone down. Then, your toad will be ready to interact with you again.
If for any reason you want to start over, you can delete your toad by clicking on the delete button. Once your toad has been deleted from the database, you will be redirected to the 'name your toad' prompt.
I created this app.
Consistent and uniform backend error handling for easy front-end error handling
encrypted passwords with Bcrypt and authentication using JSON Web Tokens
this app is small enough to utilize Reacts Context API instead of Redux with the help of reducer to handle different types of global state updates
- a cursor that displays images depending on what interaction state the game is in.
- a health bar that displays bars for each type of interaction you can have with your toad.
- a toad that floats by use of multiple css animations.
happy sad angry emotes for when you're clickin on your toad.
Already implemented in vanilla css html and js but not translated to React yet