Modernized Setup

Seamlessly Pooled.
Developer Ready.

Everything you need to set up StitchDrive on your local machine. From Clerk authentication to Google Drive API pooling.

Production app: https://stitchdrive.vercel.app/

Node.js 18+MongoDB AtlasClerk AppGoogle Account
01

Clone the Repository

Begin by cloning the stitch-drive repository to your local development environment.

Shell
git clone https://github.com/Atifhasan250/stitch-drive.git
cd stitch-drive
NoteEnsure you have Git installed and configured on your system.
02

Clerk Authentication Setup

StitchDrive uses Clerk for enterprise-grade authentication. It's free for individual developers.

  1. 1Sign up at clerk.com and create a new application.
  2. 2Enable Email and Google (OAuth) as authentication providers.
  3. 3Go to API Keys in your Clerk Dashboard and copy the Publishable Key and Secret Key.
ImportantKeep your CLERK_SECRET_KEY strictly confidential.
03

Google Cloud Platform Setup

You need a Google Cloud Project to interface with the Drive API. One project is enough for infinite accounts.

  1. 1Visit Google Cloud Console and create a project named StitchDrive.
  2. 2Enable the Google Drive API from the API Library.
  3. 3Configure the OAuth Consent Screen as "External" and add your Gmail accounts as Test Users.
  4. 4Create an OAuth Client ID (Web App) and add these Authorized Redirect URIs:
    https://stitchdrive.vercel.app/api/accounts/oauth/callback
    http://localhost:3000/api/accounts/oauth/callback
  5. 5Download the resulting JSON file. You will upload this in Step 07.
TipAdding accounts as Test Users prevents OAuth tokens from expiring every 7 days during development.
04

Environment Configuration

StitchDrive now runs as a single Next.js app. Configure the environment variables in frontend/.env.

frontend/.env

NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY=pk_...
CLERK_SECRET_KEY=sk_test_...
MONGO_URI=mongodb://.../stitchdrive
FRONTEND_URL=http://localhost:3000
STATE_SECRET=your-random-secret
ENCRYPTION_KEY=your-base64-key
NoteFor MONGO_URI, use MongoDB Atlas (recommended) or local MongoDB. When testing from phone/LAN, keep FRONTEND_URL for your main local web URL and also whitelist your LAN callback URI in Google Cloud.
05

Start the App

Run the Next.js development server. API routes are served from the same app.

Terminal
cd frontend
npm install
npm run dev
NoteThe dashboard will be accessible at http://localhost:3000.
06

Initialize via Dashboard

Once you log in via Clerk, you'll need to provide the app with your Google Client secrets.

  1. 1Log in at http://localhost:3000/login.
  2. 2You will be automatically prompted to Upload Credentials.
  3. 3Drag the JSON file you downloaded from Google Cloud (Step 03) into the box.
TipThese credentials are encrypted and stored server-side for your signed-in account, so the raw client secret no longer lives in browser storage.
07

Connect Drive Accounts

With credentials initialized, you can now start pooling storage accounts.

  1. 1Navigate to SettingsAccount Management.
  2. 2Click Connect another account.
  3. 3Choose any Google account from the popup and approve the permissions.
  4. 4Repeat for as many accounts as you want!

10 × 15 GB = 150 GB

The Storage Pool Math

Questions? Answers.

How is my data secured?

OAuth refresh tokens are encrypted using AES-128-CBC (Fernet compatible) before MongoDB storage. Clerk manages identity, and Google handles the physical files.

Is there a limit on accounts?

No. You can add as many Google accounts as you need. StitchDrive will automatically use the account with the most free space for every upload.

What is the 'Sync' feature for?

Since StitchDrive is a layer over Drive, clicking Sync pulls metadata for files you've uploaded directly to Drive via other devices.

Can I use it for collaboration?

Yes. Files shared with your connected accounts appear in the 'Shared with me' section and can be managed just like local files.

Troubleshooting

! CORS issues in the browser

Ensure FRONTEND_URL is correctly set in frontend/.env. For local development this should be http://localhost:3000.

! Clerk 'User Not Found' or Redirect loop

Verify that your Redirect URLs in the Clerk Dashboard include http://localhost:3000 and matches the env URLs.

! Google 'Access Blocked: Project is in Testing'

Ensure the Gmail account you are trying to connect is added as a 'Test User' in the Google Cloud Console OAuth consent screen.

Everything clear?

Join the dashboard and build your storage empire today.