ZeroFlex is a gamified email management application that helps users maintain inbox zero through streak tracking, badges, and leaderboards.
- Gmail Integration: Track inbox zero status via Gmail labels API
- Streak Tracking: Daily tracking of inbox zero streaks
- Signature Badges: Dynamic SVG badges to show off your streak in email signatures
- Social Leaderboards: Compete with other users for the longest streaks
- Achievements: Unlock achievements as you progress
- Frontend: Next.js 13.4, React 18, TypeScript, Tailwind CSS
- Authentication: NextAuth.js with Google OAuth
- Database: GibsonAI hosted database (MySQL)
- API: Server-side API routes for all external communication
- Node.js (v18+)
- Google API credentials for OAuth
- GibsonAI project and API credentials
Create a .env.local
file with the following variables:
NEXTAUTH_URL=http://localhost:3000
NEXTAUTH_SECRET=your-secret-key
# Google OAuth
GOOGLE_CLIENT_ID=your-google-client-id
GOOGLE_CLIENT_SECRET=your-google-client-secret
# Gibson API Keys
GIBSON_API_KEY=your-gibson-api-key
GIBSON_PROJECT_ID=your-gibson-project-id
- Clone the repository
- Install dependencies:
npm install
- Initialize the database by seeding badges:
# Visit this endpoint after starting the server http://localhost:3000/api/seed
- Start the development server:
npm run dev
- Build the project:
npm run build
- Start the production server:
npm start
See directory-tree.txt
for a detailed overview of the project structure.
Badges are dynamically generated SVGs that display:
- Current streak count
- Level (based on streak length)
- Visual indicators of achievements
Users can embed these badges in their email signatures and when recipients click on them, they're taken to a public profile page.
The application uses the Gmail labels API to check inbox zero status. It only requests the minimum permissions needed:
https://www.googleapis.com/auth/gmail.labels
https://www.googleapis.com/auth/userinfo.email
https://www.googleapis.com/auth/userinfo.profile
MIT