nicholasoxford/meme-folder

meme folder with remix, cloudflare, and supabase. A perfect stack for zero users

Welcome to MMFLDR (MEME FOLDER)!

• The easiest way to upload and track your memes.

Tech Stack

• Bun
• Remix
• CDN: Cloudflare R2
• UI: Shadcn and Tailwind
• Database: Cloudflare D1
• Authentication: Supabase
• Deployed via Cloudflare Pages

Local Development

When you run dev locally, it serves the Remix app through wrangler.

# start the remix dev server and wrangler
bun run dev

Open up http://127.0.0.1:8788

Note: You need to add a .dev.vars in the root

SUPABASE_URL=""
SUPABASE_ANON_KEY=""
R2_PUBLIC_URL=""

Deployment

bun run pages:deploy

Database

D1 is a sqlite DB

Create an empty migration file

bun run create:migration

Run all migrations on local DB

bun run local:migrate

Run all migrations on Prod DB

bun run remote:migrate

Known issues

R2 uploading does work locally

Knowledge base

server.ts

When you use anything besides the default remix server, you need to create this file. In our case it does server magic to change your remix app into a single cloudflare worker.

Your Remix Project will generate a functions/[[path]].js file the first time you run remix dev or remix build. The [[path]] filename indicates that this file will handle requests to all incoming URLs. Refer to Path segments to learn more. Source: Cloudflare Pages Remix Tutorial

bun.lockb

Bun's version of package-lock.json

remix.env.d.ts

Defining both Remix and Cloudflare workers types as global here

wrangler.toml

Cloudflare worker config