🚀 Skill Connect

A full-stack web application where users can connect, offer work, chat in real-time, and collaborate.
Built using Django REST Framework, React (Vite), Django Channels, WebSockets, and fully Dockerized.

---

📌 Features

🔐 Authentication & Users

• JWT Authentication
• Login / Signup
• Cookies to store refresh token

💼 Work / Skill System

• Users can offer work or services
• Add skills

💬 Real-Time Chat

• Django Channels + Redis
• WebSocket real-time messaging
• Live interactive chat rooms
• One-to-one chat

👥 Friends System

• Add friends
• View request list
• View friend list
• Chat only with accepted friends
• Search for friends

📁 Media & Assets

• Image uploads stored in media/uploads/images/
• Docker volume mounted for persistence

🖥 Frontend

• React + Vite
• Tailwind CSS
• Toast notifications (react-hot-toast)
• WebSocket client
• Clean modern UI

🐳 Fully Dockerized

• Backend container
• Frontend container
• Redis container

---

🏗️ Tech Stack

Backend

• Python 3.12
• Django
• Django REST Framework
• Django Channels
• Redis
• Daphne (ASGI)
• SQLite / PostgreSQL
• Docker

Frontend

• React + Vite
• Tailwind CSS
• Axios
• Toast (react-hot-toast)
• WebSocket API
• Docker

---

📁 Folder Structure

Skill_Connect/
│── back/ # Backend
│ ├── manage.py
│ ├── backend/ # Django project (settings, urls, asgi)
│ ├── SkillConnect/ # User app
│ ├── chat/ # Chat app
│ ├── friends/ # Friends logic
│ ├── work/ # Work posting logic
│ ├── media/
│ │ └── uploads/images/ # Uploaded images
│ ├── Dockerfile
│ └── requirements.txt
│ │── front/
│ └── frontend/ # React Vite frontend
│ ├── src/
│ ├── Dockerfile
│ └── package.json
│
└── docker-compose.yml

---

🔧 Environment Variables

Backend (back/.env)

SECRET_KEY=your_secret_key
ALLOWED_HOSTS=*

---

### Frontend (`front/frontend/.env`) Nothing to do here😊😊

---

Insatallation & Setup

Clone the Repository

git clone https://github.com/yogeswar2006/Skill-Connect.git

---

🐳 Docker Setup (Full Stack)

Starts everything:

docker compose up --build  

URL Routing

Backend URL

  http://localhost:8000

Frontend URL

  http://localhost:5173

Without Docker

Backend (Without Docker)

cd back  
python -m venv env  # creates an environment  
pip install -r requirements.txt  # install all dependencies required  
python manage.py migrate # make migrations  
daphne -b 0.0.0.0 -p 8000 backend.asgi:application # Run asgi server  

Frontend (Without Docker)

cd front/frontend  
npm install # install dependencies  
npm run dev # starts server  

visit above URLS

---

DEMO SCREENSHOTS

Home

Register

Login

Dashboard

Add Skill

Add Work Offer

Profile-1

Profile-2

Code snippet

ChatPage

------------------------------------------❤️THE END❤️--------------------------------------