🦸‍♂️ Superhero Encyclopedia 🦸‍♀️

A superhero encyclopedia app built with Expo and React Native, targeting iOS, Android, and Web.

Tech Stack

Concern	Library
Navigation	expo-router 4 (file-based)
Auth + DB	Supabase
External APIs	SuperheroAPI, ComicVine API
Animations	react-native-reanimated 4
Carousel	react-native-reanimated-carousel
Card shape	react-native-figma-squircle
Testing	jest-expo + @testing-library/react-native

Get Started

Requires Node.js and Yarn.

git clone https://github.com/ginoleeswan/hero
cd hero
yarn install

Copy .env.example to .env.local and fill in your keys:

cp .env.example .env.local

Variable	Description
EXPO_PUBLIC_SUPABASE_URL	Supabase project URL
EXPO_PUBLIC_SUPABASE_KEY	Supabase anon key
SUPABASE_SERVICE_ROLE_KEY	Supabase service role key (server-side only)
SUPERHERO_API_KEY	SuperheroAPI key
COMICVINE_API_KEY	ComicVine API key
EXPO_PUBLIC_GOOGLE_WEB_CLIENT_ID	Google OAuth web client ID
EXPO_PUBLIC_GOOGLE_IOS_CLIENT_ID	Google OAuth iOS client ID

Then start the dev server:

yarn start

Run tests:

yarn test:ci

Author

👤 Gino Swanepoel   Twitter · GitHub · LinkedIn

❤️ Show your support

Give a ⭐️ if this project helped you!