This project is an online trading card game using NFTs as trading cards and 2 separate tokens, energy to join battles, and currency which is awarded after battles and used to purchase in-game items from the store. NFTs are generated on the fly by stitching together random layers to make unique monsters for every player. Battles take place as 3v3 and each monster has unique stats based on the random generation. There will also be a marketplace for trading penguins using ETH. Players battle using energy that is accrued daily to encourage daily check-ins. Under the hood, this project is a React web app that powers live monster battles using web sockets and enables decentralized ownership of monster cards using ERC1155-based NFTs.

Banguins TCG showcase

How it's made

This project is composed of three components: frontend, backend, and contracts. The frontend was developed using CSS/HTML and hosted on Netlify. This consists of the UI and buttons players interact with. The backend was built using TypeScript React and consists of all the battle logic, switching between pages, and preparing transactions for the smart contracts. The hooks for the contracts was built using ether.js and wagmi. The backend uses web sockets to power live battles. For the contracts, we used Remix, truffle, Ganache to develop the smart contracts and test them. The contracts were deployed to the rinkeby testnet using truffle migrate. We developed NFTs using the ERC1155 standard and used OpenZeppelin's libraries to enable permissioned access to the contracts. Thus, our project has an extra layer of security that can prevent any exploits. There is some code for chainlink randomness but it was replaced using a pseudo random generator using keccak256 and block timestamp due to lack of time to test the chainlink. This is all of our first time ever using Solidity to this extent, so we've impressed ourselves with being able to build something functional in a short time!