Final presentation (BS Capstone)
Team introduction
Nathan Lodge
- Role: Frontend Developer, Designer, DevOps
- Responsibilities: Design and build frontend, deploy app
Slater Leonardo
- Role: Backend Developer, DB Admin
- Responsibilities: Build API, design database
Emotial overview
The social platform for sharing your thoughts and feelings.
- Full featured text-based social media
- Unique emoji reaction system
- User accounts
- Avatars / banners
- Following / friends
- Posts (with images, GIFs, or a video)
- Replies
- Sharing
- Hashtags / mentions
- Realtime notifications
- Multiple themes
Timeline
| Week | Highlights |
|---|---|
| 1 | Init frontend and backend, wired up boilerplate, set up hosting |
| 2-3 | Profiles, avatars / banners / media, followers, search, live notifications, basic mobile layout |
| 4 | Auth pages and login / signup, set up themes |
| 5 | Frontend polish, Docker / CI, account settings, and media cropping |
| 6 | Admin functionality, mentions / hashtags, emoji styles |
| 7 | Shares, emoji picker, image uploading / CDN, Open Graph, reaction list |
| 8 | Feed sorting, theme accents, friends / suggestions, drag-and-drop media |
| 9 | Live new post updates, crop / zoom polish, and remaining bug fixes |
Database ERD
Obstacles overcome
Frontend
- Rich text editor with mentions, hashtags, and links
- Media normalization / uploading in the background
- Type safety between frontend and backend
- Emoji styles
Backend
- Creating an OpenAPI specification
- Server-sent events
- PostgreSQL on a large scale application
Technical design
Frontend
- Next.js app with React client components fetching data via TanStack Query
- API client generated from the backend's OpenAPI spec, keeping types in sync automatically
- User interactions update the UI optimistically, then sync with the server in the background
- Live feed and notification updates arrive over server-sent events
Backend
- Go REST API built on Gin and Huma. Huma generates the OpenAPI spec from models and handlers
- API handlers to service layer to GORM to Postgres
- Auth with JWTs stored as a cookie
- Live feed and notification updates are pushed over server-sent events
Deployments We deploy the app on one of Slater's servers. We use Docker to deploy frontend, backend, Postgres, and MinIO containers, which all connect over the local network.
Summary
Overall this project was fun for us. We had a lot of support and good ideas going in, so our focus was on executing and making the platform feel nice to use.
Live Demo
Sharing on Mobile
Open Graph
