Card Browser App

Dec 21, 2024

Card Browser App

Star wars card browser, mobile and web app

Star Wars Card Browser: A Dynamic Way to Explore MTG-Style Cards

The Star Wars Card Browser is a web and mobile app that lets users dive into a galaxy of Star Wars-themed Magic: The Gathering (MTG) style cards. With intuitive search and sorting options, users can explore cards by attributes like HP, power, and cost.

Tools and Technologies

To bring this project to life, I utilized the following technologies:

Web App (Next.js):

ShadCN and Tailwind CSS: For styling and components, ensuring a sleek and consistent design.

Server interactions: Leveraged the server for seamless data handling and browser interactions.

Mobile App (React Native):

Nativewind and React Native Reusables: For responsive and reusable components, allowing a smooth and uniform experience across devices.

Context API: For managing application state efficiently.

Key Features

1. Search and Browse: Users can quickly search for cards by name or filter them by specific attributes like HP.

2. Sort Options: Cards can be sorted by power, cost, and more, making it easier to find exactly what you're looking for.

3. Cross-Platform Design: The app works on both web and mobile platforms, delivering a consistent user experience.

I had a lot of fun with this project and building it across both web and mobile platforms allowed me to explore different approaches to UI, state management, and interactions. It was a quick POC challenge, with a day spent on the web app and a day spent on the React Native app.

Gallery Image 1
Gallery Image 2
Gallery Image 3
Gallery Image 4