Skip to content

Darshan3690/The-Dev-Pocket

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

281 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

📚 The Dev Pocket

Curated resources, interactive tools, and step-by-step roadmaps for learners, students, and developers.


Hacktoberfest Badge EWOCS Badge Contributions Welcome License: MIT GitHub Repo stars Visitors GitHub forks PRs Welcome


┌─────────────────────────────────────────────────────────┐
│  🎯 Learn → 🛠️ Build → 🚀 Deploy → 🤝 Contribute       │
└─────────────────────────────────────────────────────────┘

📑 Table of Contents


🌟 Features That Set Us Apart

📖 Rich Learning Resources

Carefully curated content for Web Development, DSA, AI/ML, and cutting-edge technologies

🛠️ Interactive Tools

Boost productivity with hands-on coding practice tools and utilities

🎯 Guided Roadmaps

Crystal-clear paths for developers at every stage of their journey

🌍 Community-Powered

Built by developers, for developers with Hacktoberfest spirit

graph LR
    A[🌱 Beginner] --> B[💪 Intermediate]
    B --> C[🚀 Advanced]
    C --> D[⭐ Expert]
    style A fill:#84cc16
    style B fill:#3b82f6
    style C fill:#8b5cf6
    style D fill:#f59e0b
Loading

🛠️ Tech Stack

Category Technologies
Frontend Next.js React TypeScript Tailwind
Backend Node.js Next.js API
Database Supabase Prisma
Auth Clerk
Deployment Vercel

🏗️ System Architecture

To help contributors understand how The Dev Pocket handles data and authentication, here is a visual representation of our tech stack integration:

graph LR
    User((User)) -- Interacts --> NextJS[Next.js Frontend]
    
    subgraph "Application Logic"
        NextJS -- Auth Request --> Clerk[Clerk Auth]
        NextJS -- Query --> Prisma[Prisma Client]
    end

    subgraph "Data Layer"
        Prisma -- Session Pooling --> Supabase[(Supabase DB)]
        Prisma -- Direct Connect --> Migrations[DB Migrations]
    end

    Clerk -- Session Tokens --> NextJS
    Supabase -- Data Results --> Prisma
    Prisma -- Typed Response --> NextJS

    style NextJS fill:#000,color:#fff,stroke:#333
    style Clerk fill:#6C47FF,color:#fff
    style Supabase fill:#3ECF8E,color:#fff
    style Prisma fill:#2D3748,color:#fff
Loading

🚀 Getting Started (Developer Mode)

📦 Quick Setup Guide

1️⃣ Fork & Clone Repository

# Clone the repository
git clone https://github.com/Darshan3690/The-Dev-Pocket.git

# Navigate to project directory
cd The-Dev-Pocket

2️⃣ Install Dependencies

npm install
# or
yarn install
# or
pnpm install

3️⃣ Set Up Supabase Database (Prisma)

⚠️ Important: Prisma CLI does not load .env.local.
Please use a .env file for database configuration.

  1. 🌐 Visit Supabase
  2. ➕ Create a new project
  3. ⚙️ Go to Settings → Database → Connection string

You will need two connection URLs from Supabase:

  • Session pooler URL (used by Prisma Client)
  • Direct connection URL (used by Prisma migrations)
  1. 📝 Create a .env file in the project root (same level as package.json) and add:
DATABASE_URL="postgresql://postgres:<PASSWORD>@db.xxxxx.supabase.co:6543/postgres?pgbouncer=true"
DIRECT_URL="postgresql://postgres:<PASSWORD>@db.xxxxx.supabase.co:5432/postgres"

4️⃣ Run Database Migrations

# Generate Prisma Client
npx prisma generate

# Push schema to database
npx prisma db push

# (Optional) Open Prisma Studio for DB management
npx prisma studio

5️⃣ Configure Authentication with Clerk

  1. 🔐 Go to Clerk Dashboard
  2. ➕ Create a new application.
  3. 🔑 Copy your API keys.
  4. 📝 Add to .env.local:
CLERK_PUBLISHABLE_KEY=your_publishable_key
CLERK_SECRET_KEY=your_secret_key

6️⃣ Launch Development Server

npm run dev

🎉 Success! Visit http://localhost:3000


🤝 Contributing

💖 We Love Contributions from Everyone!

🚩 Before You Start

⭐ Star

Show some love to the project

🍴 Fork

Create your own copy.

🚀 Contribute

Make your mark

📋 Contribution Steps

# 1. Star this repository ⭐

# 2. Fork the repo 🍴

# 3. Create a feature branch
git checkout -b feature-amazing-feature

# 4. Commit your changes
git commit -m "feat: add amazing feature"

# 5. Push to your fork
git push origin feature-amazing-feature

# 6. Open a Pull Request 🚀

📌 Please read our CONTRIBUTING.md and CODE_OF_CONDUCT.md before contributing


🎯 Hacktoberfest 2025

🌍 Join the Global Open Source Celebration! ✨

🎁 Rewards

Submit 6 quality PRs to win official Hacktoberfest swag

🏷️ Find Issues

Check labels: hacktoberfest, good first issue, help wanted


👥 Our Amazing Contributors

⭐ Stargazers

Stargazers repo roster

🍴 Forkers

Forkers repo roster

👨‍💻 Project Maintainer

Darshan Rajput
Darshan Rajput

Creator & Lead Maintainer 🚀


📄 License

This project is licensed under the MIT License

See the LICENSE file for details

┌─────────────────────────────────────────┐
│  Free to use • Modify • Distribute      │
└─────────────────────────────────────────┘

⭐ Show Your Support

If you find this project helpful:

⭐ Star

Star the repository

🍴 Fork

Fork and customize

📢 Share

Spread the word



Made with ❤️ by Darshan3690 & Contributors

⭐ Star us on GitHub — it motivates us a lot!

About

The Dev Pocket is an open-source platform that empowers learners and developers through curated resources, structured roadmaps, and interactive tools. Built with Next.js, Tailwind CSS, and Clerk, it encourages collaborative learning and participation in open-source programs like Hacktoberfest 2025 and ECWoC 2026.

Topics

Resources

License

Code of conduct

Contributing

Security policy

Stars

Watchers

Forks

Releases

No releases published

Sponsor this project

Packages

 
 
 

Contributors