-
-
Track your MTG collection, view card statistics, and monitor its estimated market value over time.
-
Compare your original deck's value with an optimized version using cards you already own.
-
Discover lower-value alternatives from your collection and see their estimated impact on deck value.
-
Explore cards you already own and choose replacements that fit your deckbuilding goals.
-
Search for cards and select the exact set, artwork, and printing you own.
-
earch, filter, and manage your cards while viewing prices, quantities, and card details.
Inspiration
As Magic: The Gathering players, we know how expensive building new decks can become, especially when we already have growing collections of cards. It can be difficult to remember which cards we own, what they’re worth, and whether we actually need to buy more cards for our next deck. We created ManaSaver to help players make better use of their existing collections and spend less money while enjoying the game.
What it does
ManaSaver helps Magic: The Gathering players organize their card collections, track their collection’s value, and make more informed deckbuilding decisions. Players can add cards, distinguish between different printings and finishes, and view pricing information. By making their collections easier to manage, ManaSaver helps players get more value out of the cards they already own and avoid unnecessary purchases.
How we built it
We built ManaSaver using HTML, CSS, and JavaScript for the frontend, with Supabase handling authentication and our PostgreSQL database. We integrated the Scryfall API to retrieve Magic: The Gathering card information and pricing. A Supabase Edge Function refreshes card prices and records daily collection values, while Chart.js displays collection-value history. We deployed the website using GitHub Pages and GitHub Actions.
Challenges we ran into
One of our biggest challenges was handling different versions of the same Magic card. Cards can have multiple printings, sets, and finishes, each with a different price, so tracking cards by name alone was not enough. We had to redesign our database and pricing logic to distinguish between specific versions of cards. We also worked through challenges connecting our frontend to Supabase, protecting user-specific collection data, and deploying the website through GitHub Pages.
Accomplishments that we're proud of
We’re proud that ManaSaver grew from an idea into a working web application with user accounts, collection management, and card-pricing information. We implemented a database that tracks specific card printings and finishes, integrated collection-value tracking, and deployed a website that other players can access and try.
What we learned
Through ManaSaver, we gained hands-on experience building a full-stack application and connecting multiple technologies. We learned more about relational database design, Supabase Row Level Security, external API integration, serverless functions, and automated deployment. We also learned how important it is to design software around real user needs, especially when a seemingly simple feature becomes more complicated during development.
What's next for ManaSaver
We want to continue improving ManaSaver’s deckbuilding and financial tools. Future improvements could include more detailed historical price tracking, better collection analysis, and additional tools that identify which cards players already own when planning a new deck. Our long-term goal is to help Magic players build more decks while spending less money.
Built With
- api
- chart.js
- css
- github
- html
- javascript
- postgresql
- scryfall-api
- supabase
Log in or sign up for Devpost to join the conversation.