Connect.

Connect is a social media platform built with DRF & TS. Fully Responsive and minimalistic design.

Connect to your Friends and interact with them

Preview

🚀 Tech Stack

Logo	Technology	Intended Use
	React	Frontend UI library for building dynamic, component-based user interfaces.
	React Router	Client-side routing for navigating between pages without reloading.
	TailwindCSS	Utility-first CSS framework for fast, responsive styling.
	shadcn/ui	High-quality headless UI components for consistent, modern interface design.
	Zod	Schema validation + TypeScript inference for form data.
	React Hook Form	Fast, optimized form handling with built-in validation.
	TypeScript	Strongly typed JavaScript for more robust frontend code.
	Python	Backend programming language to build the API logic.
	Django REST Framework (DRF)	Backend API framework for authentication, serialization & business logic.
	Pytest	Testing backend logic, endpoints, models & utilities.
	JWT	Token-based authentication for secure login & session handling.
	Postgres	High Performance SQL Database.

🛢️ Database Schema

Features

• Create or Delete Account
• Login (JWT Authenticated)
• Add or Delete Post
• See Your Posts
• View Latests Post from the People you follow
• Update and Edit Profile
• Search for other Users
• Follow other Users
• See Following/ Follower List/Count

Endpoints

• Swagger API docs /api/v1/docs/
• Register a user POST /api/v1/register/
• Login a user POST /api/v1/login/
• Refresh access token POST /api/v1/refresh/
• Get your or other User Profile Details GET /api/v1/profile/
• Update Profile Details PATCH /api/v1/profile/
• Delete your Profile DELETE /api/v1/profile/
• Post Feed GET /api/v1/feed/
• Search for other user GET /api/v1/search/
• Get Comments for a Post GET /api/v1/comments/
• Post a Comment on a Post POST /api/v1/comments/
• Add a Post POST /api/v1/post/
• Delete a Post DELETE /api/v1/post/
• Get all Post of a User GET /api/v1/all_posts/
• Get following list/count GET /api/v1/following/
• Follow a User POST /api/v1/following/
• Get Follower list/count GET api/v1/follower/

• For request/response structure visit api docs or backend/api/v1/views/

Backend Setup

• cd backend/

• Create .env

  DEBUG = "True" | "False"
  DJANGO_ENV = "dev" | "prod"
  
  SECRET_KEY
  
  DEV_DB_NAME
  PROD_DB_NAME
  
  DB_USERNAME
  DB_PASSWORD
  
  DB_HOST
  DB_PORT
  
  

• Run make venv

• Then run make migrate

• Then run make seed for seeding database with fake users

• Then run make run

Frontend Setup

• cd frontend/

• Create .env

  VITE_BASE_URL=http://localhost:8000/api/v1/
  
  VITE_IMAGE_URL=http://localhost:8000
  

  or change according to backend

• Run npm install

• Then npm run dev