How prahang/griet-go works
1. Top-level shape
- This repo is split into two deployable applications: frontend/ and backend/.
- The frontend is a Next.js 14 app; the backend is a Python API that exposes the social app’s domain operations.
2. Frontend presentation layer
- The UI is organized with the Next.js App Router under frontend/src/app/.
- Route groups separate auth flows (login, signup) from the main app (feed/home, create, explore, messages, notifications, profile/[uid]).
- This is a client-heavy app shell with page-level composition rather than a single SPA entry.
3. Frontend state and auth boundary
- Authentication state is centralized in React context (frontend/src/context/AuthContext.tsx and frontend/context/AuthContext.tsx).
- Firebase client SDK is used on the frontend for sign-in/sign-up and session state.
- The frontend likely attaches Firebase identity information to API calls rather than managing its own auth system.
4. Frontend-to-backend API layer
- frontend/src/lib/api.ts is the main boundary for talking to the backend.
- frontend/src/lib/firebase.ts holds Firebase client setup.
- Shared UI components such as Feed, PostCard, PostModal, EditProfileModal, Sidebar, and BottomNav consume data from these layers.
5. Backend request handling structure
- The backend is organized into an entrypoint (backend/app.py), configuration (backend/config.py), middleware (backend/middleware.py), route modules, and service modules.
- Route files are grouped by domain: chat, notifications, posts, social, and users.
- Services under backend/services/ contain the actual business logic, keeping route handlers thin.
6. Backend domain boundaries
- posts handles feed content, creation, likes, and post-related retrieval.
- users handles profiles and user metadata.
- social handles the follow/unfollow graph.
- chat handles direct messaging.
- notifications handles notification generation and retrieval.
7. Authentication and authorization
- The backend uses middleware to validate Firebase ID tokens, acting as the trust boundary for protected endpoints.
- This means the frontend authenticates with Firebase, then the backend verifies identity before performing user-scoped operations.
8. Data and infrastructure dependencies
- Persistent data lives in Firebase Firestore rather than a relational ORM/database.
- Media uploads go to Firebase Storage.
- The backend uses Firebase Admin credentials from environment configuration, so Firestore/Storage access is server-side only.
9. Key runtime technologies
- Frontend: Next.js, React, TypeScript, Tailwind CSS, and likely Framer Motion for animation.
- Backend: Python API stack with Firebase Admin integration; the README describes Django 5 / Django REST Framework, while the file layout shows an API app split by routes/services.
10. Main data flows to show in a diagram
- User signs in on the frontend via Firebase Authentication.
- Frontend sends requests through api.ts to backend endpoints.
- Backend middleware validates the Firebase token.
- Service layer reads/writes Firestore, and uploads/reads media from Firebase Storage.
- The frontend renders feed, profile, chat, and notification views from backend data.
11. Interaction patterns implied by the UI
- The app supports a social feed, post creation, profile viewing, follow/unfollow, messaging, and notifications.
- Pages like messages/[chatId] and profile/[uid] imply dynamic, per-resource screens backed by backend lookups.
12. Practical diagram boundaries
- Treat frontend/ as the client presentation and interaction layer.
- Treat backend/ as the domain API and authorization layer.
- Treat Firebase Auth, Firestore, and Storage as external managed services shared by both sides, with the backend owning privileged access.
Main entry points: app.py API app · api.ts API client · page.tsx Main routes · AuthContext.tsx Auth context
Components 15
Frontend
Next.js client app, route composition, auth state, and UI layer.
- App shell · Root frontend app shell and route composition entry.
frontend/src/app/layout.tsx - Auth routes · Login and signup flows under the App Router auth group.
frontend/src/app/(auth)/login/page.tsx - Main routes · Feed, create, explore, messages, notifications, and profile screens.
frontend/src/app/(main)/page.tsx - Auth context · Centralized client-side auth/session state.
frontend/src/context/AuthContext.tsx - API client · Frontend boundary for backend requests.
frontend/src/lib/api.ts - Firebase client · Client-side Firebase setup for sign-in and session handling.
frontend/src/lib/firebase.ts - UI components · Shared feed, post, navigation, and modal components.
frontend/src/components/Feed.tsx
Backend
Python API entrypoint, middleware, route handlers, and domain services.
- API app · Backend application entrypoint.
backend/app.py - Config · Backend configuration and Firebase credentials setup.
backend/config.py - Auth middleware · Validates Firebase ID tokens and enforces protected access.
backend/middleware.py - Route layer · Thin request handlers for posts, users, social graph, chat, and notifications.
backend/routes/posts.py - Service layer · Business logic for posts, users, social graph, chat, and notifications.
backend/services/posts.py
Managed Services
Firebase services used for identity, data, and media storage.
- Firebase Auth · External identity provider used by the client and verified by the backend.
- Firestore · Primary persistent store for social app data.
- Storage · Media upload and retrieval backend for user content.
Connections 17
- App shell → Auth routes: renders · Root app shell composes auth flows.
- App shell → Main routes: renders · Root app shell composes main app routes.
- Auth routes → Auth context: uses · Auth pages depend on shared auth state.
- Auth context → Firebase client: reads session · Auth context is backed by the Firebase client SDK.
- Main routes → UI components: composes · Main screens render shared social UI components.
- UI components → API client: loads data · UI components fetch and mutate backend-backed content.
- Main routes → API client: calls · Main app routes access backend APIs through the client boundary.
- Auth context → API client: attaches identity · Frontend requests carry authenticated user identity to the API layer.
- Firebase client → Firebase Auth: signs in · Client SDK authenticates users with Firebase.
- API client → API app: requests · Frontend API client talks to the backend entrypoint.
- API app → Config: loads config · Backend app initializes with environment configuration.
- API app → Auth middleware: wraps · Request pipeline passes through auth middleware.
- API app → Route layer: dispatches · Backend app dispatches requests to domain routes.
- Auth middleware → Firebase Auth: verifies token · Middleware validates Firebase ID tokens.
- Route layer → Service layer: delegates · Route handlers forward business work to services.
- Service layer → Firestore: reads/writes · Services persist and query social data in Firestore.
- Service layer → Storage: uploads media · Services use storage for images and other uploaded content.