To run this app (basic, web mode), you'll need Node.js (22+ recommended), Docker/Podman for PostgreSQL, and npm.
- First, install dependencies with
npm iin the project roots (frontend and backend) - Start the database with
podman compose -f docker-compose.yaml up -d(or use Docker) - Run
npx prisma migrate devinserver/src/prisma/to set up the database schema - Run
npm run devin both theserverandclientdirectories to start the backend and frontend - For AI use, place an open AI API key in the .env file in the server
Choppd is a social media platform for people to connect over what they make and eat.
Choppd is a full-stack food social media where users can share their food experiences, follow other users, and discover new recipes and restaurants. It is built with Expo/React Native for the mobile client and a tRPC backend with Prisma and Postgres.
- Share your food experiences with posts
- Upload food photos with automatic processing
- Write descriptions about your cooking or dining experiences
- View profiles with post counts, followers, and following statistics
- Follow people and build your network
- For your feed, you can switch between "Following" (posts from users you follow) and "Explore" (discover new content)
- Search and discover new users by name or email
- View your social connections (followers/following)
- Like and unlike posts with counter updates
- Comment on posts and start discussions
- Infinite scroll feed
- Built-in AI chatbot powered by OpenAI
- Get food advice and cooking tips and recommendations
- Secure registration and login
- Authenticated endpoints with proper authorization
- Persistent login sessions with refresh tokens
- Bcrypt password hashing and validation
- Expo
- Typescript
- tRPC
- Expo Router
- Node + Express
- tRPC
- Prisma ORM
- Postgres
- see prisma.client
-
If you don't already have nodejs installed (tested with 22 & 24), install it (nvm is very good), then do
npm iin the project root to install the packages for both the backend and frontend. -
Setup database.
- Use the docker-compose.yml to run the database, you cant install docker desktop on work laptops so I use podman instead. You can also used docker through WSL, but had some issue with network access with that.
- Install podman desktop and podman compose. PgAdmin is also helpful to have
- Run
podman compose -f docker-compose.yaml up -d
-
Run
npx prisma migrate devinserver/src/prisma/to apply the schema to the database and generate prisma client files
You should then be able to run npm run dev in both the server and client directories and use the website version of the app. To use an emulator follow the below instuctions.
tldr: Install android studio, add a virtual phone (i used pixel 9a), add ANDROID_HOME env var, and add /emulator & /platform-tools to the Path
It looks like the gradle version that it's using (8.13) isn't supported by java 24 (min 8.14), installing jdk 21 (and fixing JAVA_HOME) seems to have fixed it. I also installed the previous version of sdk (15) when trying to fix "bad file version 68" error, but i think it was just fixed by using jdk 21
Run the android emulator. It appears that it does not work while connected to the work VPN, i suspect because it creates a local network that conflicts.
It looks like its possible to setup a github action to create an ios build (xcodebuild on gh macos runner) and then run it with testflight. Will need to work out having multiple deployed versions, will probably get k8's running on my vps
https://docs.expo.dev/guides/local-app-development/#local-app-compilation
- when the db is not up to date with the schema and you want to keep the data:
npx prisma migrate dev --name your_migration_name - when the db is not up to date with the schema and you don't care about the data:
npx prisma db push --force-resetornpx prisma migrate reset - for viewing db in web:
npx prisma studio
- Authentication, home feed, create post, profile, search, settings
- Tests: Component testing with Jest and React Native
- API endpoints (auth, posts, profiles, search, comments, chat)
- Prisma schema with migrations and seeding
- authorized routes reject when not signed in, send to auth page
- auto refresh access token when api call fails with 401
- decode and store user info from jwt in fe so i can access user id and email without extra api calls
- mfa setup
- store jwt in db, and revoke on logout
- email verification after signup
- logout of all devices slay
- profile pictures/avatars
- push notifications for likes and comments
- advanced search and filtering
- food categories and tagging system
- restaurant/location tagging
- recipe sharing with ingredients and instructions
- meal planning features
- dietary restriction filters
Rianna -> Comments (validate empty), Feed
Josh -> Profile Page, Followers/Following
client/app/profile/[userId].tsxclient/components/profile/client/app/followers.tsxclient/app/following.tsx
Olivia -> Posting page, Post view page (validate post contents)
Mukund :D -> Signup, Login, Likes (validate password creation), Chatbot
client/app/auth.tsxserver/src/controllers/auth-api.tsserver/src/controllers/post-api.ts(likeToggle)client/components/ChatBot.tsxserver/src/controllers/chat-api.ts
Oliver -> Search, Settings page (validate new name) (oliver also set up the repo which was a huge help to our team, even though it is not recognized here)