🔥 Dev Streaks

Track your GitHub & LeetCode streaks in one beautiful app.

A feature-rich React Native mobile app that helps developers maintain coding consistency by tracking GitHub contributions, LeetCode problem-solving stats, and more — all in a stunning dark-themed interface.

---

✨ Features

Feature	Description
🐙 GitHub Tracking	Current streak, longest streak, total contributions, interactive heatmap
💻 LeetCode Tracking	Streak tracking, Easy/Medium/Hard breakdown with progress bars
📊 Advanced Statistics	Week/Month/Year/All Time period filtering, activity charts
🔐 GitHub OAuth	Connect via OAuth to include private contributions
🔔 Smart Notifications	Customizable streak reminders — only notifies if you haven't contributed today
📱 Home Screen Widgets	Native Android widgets for GitHub & LeetCode heatmaps
🎨 Dark & Light Themes	Beautiful dark mode with system preference support
🔗 Share Card	Premium-styled developer card with flip animation
📦 Repo Browser	Browse, search, and filter your GitHub repositories
🔒 Secure Auth	Supabase authentication with local-only fallback

📸 Download Link

Website :- https://www.devstreaks.site/

🛠 Tech Stack

Layer	Technology
Framework	React Native + Expo SDK 54
Navigation	Expo Router (file-based routing)
State	React Context + AsyncStorage
Language	TypeScript 5.9
Backend	Supabase (Auth + PostgreSQL)
Notifications	expo-notifications + expo-background-fetch
Widgets	Custom Android AppWidgetProvider (Kotlin)
Secure Storage	expo-secure-store
Animations	react-native-reanimated

🚀 Getting Started

Prerequisites

• Node.js 18+ — Download
• Git — Download
• Android Studio (for Android dev) — Download
  • Android SDK, emulator, or a physical device
• Xcode (macOS only, for iOS) — Mac App Store

Installation

# 1. Clone the repository
git clone https://github.com/ermadhav/DevStreaks.git
cd DevStreaks

# 2. Install dependencies
npm install

# 3. Set up environment variables
cp .env.example .env
# Edit .env with your values (see Environment Setup below)

# 4. Start the development server
npx expo start --dev-client

# 5. Run on Android
npx expo run:android

# 6. Run on iOS (macOS only)
npx expo run:ios

Environment Setup

Create a .env file in the project root (or copy from .env.example):

# GitHub OAuth App — Create at https://github.com/settings/developers
# Set callback URL to: devstreaks://oauth
EXPO_PUBLIC_GITHUB_CLIENT_ID=your_github_oauth_client_id

# Supabase — Get from https://supabase.com > Your Project > Settings > API
EXPO_PUBLIC_SUPABASE_URL=https://your-project.supabase.co
EXPO_PUBLIC_SUPABASE_ANON_KEY=your_supabase_anon_key

Note: The app works without Supabase — it falls back to local-only mode. Supabase is only needed for cloud authentication and profile sync.

Supabase Database Setup (Optional)

If you want to enable cloud features:

1. Create a free project at supabase.com
2. Go to SQL Editor in your dashboard
3. Run the SQL from lib/supabase-schema.sql
4. Copy your Project URL and anon key from Settings > API into your .env

📂 Project Structure

DevStreaks/
├── app/                          # Expo Router screens
│   ├── _layout.tsx               # Root layout with auth guard
│   ├── auth/
│   │   ├── login.tsx             # Login screen
│   │   └── signup.tsx            # Signup screen
│   ├── (tabs)/
│   │   ├── _layout.tsx           # Tab navigation (Home, Stats, Share, Repos, Profile)
│   │   ├── index.tsx             # Home dashboard
│   │   ├── stats.tsx             # Advanced statistics with period filtering
│   │   ├── share.tsx             # Developer card sharing
│   │   ├── repos.tsx             # GitHub repository browser
│   │   └── settings.tsx          # Profile & preferences
│   ├── policy.tsx                # Privacy policy
│   └── terms.tsx                 # Terms of service
├── components/                   # Reusable UI components
│   ├── StreakCard.tsx             # Platform streak card
│   ├── Heatmap.tsx               # GitHub-style contribution heatmap
│   ├── ActivityChart.tsx          # Bar chart for activity data
│   ├── StatCard.tsx              # Individual stat display
│   ├── DifficultyBar.tsx         # LeetCode difficulty progress bars
│   └── RepoCard.tsx              # Repository card
├── hooks/                        # Custom React hooks
│   ├── useGithubStreak.ts        # GitHub API + caching + OAuth support
│   ├── useLeetCodeStreak.ts      # LeetCode API + fallback + caching
│   └── useGithubRepos.ts         # Repos & starred repos fetching
├── services/                     # Business logic services
│   ├── GithubAuthService.ts      # GitHub OAuth flow
│   ├── NotificationService.ts    # Smart streak reminders
│   └── WidgetService.ts          # Native widget data bridge
├── context/                      # React Context providers
│   ├── AuthContext.tsx            # Auth state (Supabase + local fallback)
│   └── ThemeContext.tsx           # Dark/Light/System theme
├── constants/                    # Design tokens & config
│   ├── Theme.ts                  # Colors, fonts, spacing, radii
│   └── config.ts                 # App config, API endpoints, storage keys
├── lib/                          # Backend utilities
│   ├── supabase.ts               # Lazy-initialized Supabase client
│   └── supabase-schema.sql       # Database schema (RLS-enabled)
├── android/                      # Native Android code
│   └── app/src/main/java/.../widget/  # Home screen widget implementations
├── assets/                       # Images, fonts, icons
├── .env.example                  # Environment variable template
├── app.json                      # Expo configuration
├── eas.json                      # EAS Build profiles
└── package.json                  # Dependencies & scripts

🤝 Contributing

We love contributions! Whether it's fixing bugs, adding features, or improving docs — all help is welcome.

How to Contribute

1. Fork the repository
2. Clone your fork:

   git clone https://github.com/YOUR_USERNAME/DevStreaks.git
   cd DevStreaks

3. Create a branch for your feature/fix:

   git checkout -b feature/your-feature-name

4. Make your changes and test them locally
5. Commit with a clear message:

   git commit -m "feat: add your feature description"

6. Push to your fork:

   git push origin feature/your-feature-name

7. Open a Pull Request against the master branch

Commit Message Convention

We follow Conventional Commits:

Prefix	Usage
feat:	New features
fix:	Bug fixes
docs:	Documentation updates
style:	Code style changes (formatting, etc.)
refactor:	Code refactoring
perf:	Performance improvements
test:	Adding or updating tests
chore:	Maintenance tasks

Ideas for Contributions

• 📸 Add app screenshots to the README
• 🧪 Write unit tests for hooks and services
• 🍎 Build iOS home screen widgets (WidgetKit)
• 🏆 Achievement badges / milestones system
• 👥 Friend comparison & leaderboards
• 📈 More data visualizations (line charts, pie charts)
• 🌐 Internationalization (i18n) support
• ♿ Accessibility improvements
• 📝 Improve in-app onboarding experience

Development Guidelines

• Use TypeScript — no any unless absolutely necessary
• Follow the existing design system (constants/Theme.ts) for colors, spacing, fonts
• Use useTheme() hook for dynamic dark/light mode support
• Keep components small and focused — one component, one job
• Use process.env for any sensitive configuration
• All new screens should support both dark and light themes

🔒 Security

• All API keys and secrets are loaded from environment variables (.env)
• The .env file is in .gitignore and is never committed
• OAuth tokens are stored using expo-secure-store (device keychain)
• Supabase has Row Level Security (RLS) enabled on all tables
• No secrets exist in git history

📄 License

This project is licensed under the MIT License — see the LICENSE file for details.

🙏 Acknowledgements

• Expo — for the incredible React Native toolchain
• Supabase — for the open-source Firebase alternative
• GitHub Contributions API — for public contribution data
• Alfa LeetCode API — for LeetCode data proxy

---

Made with ❤️ by ermadhav

If you find this project useful, please consider giving it a ⭐!