Skip to content

README.md

Latest commit

 

History

History
41 lines (33 loc) · 1.43 KB

README.md

File metadata and controls

41 lines (33 loc) · 1.43 KB

CodeInChat — Frontend

Frontend for CodeInChat, a collaborative learning platform enabling users to create and share code cards (step-by-step programming tasks), chat in groups, and interact in real-time.

🛠️ Tech Stack

  • ⚛️ React (with Vite)
  • 🌈 Chakra UI
  • ⚡ Axios
  • 🔐 Cookie-based Auth (via Rails API)

📷 Preview

brave_screenshot_localhost

localhost_5173_discover_people

localhost_5173_account_settings

📦 Setup

git clone https://github.com/GPFE/CodeInChat-Frontend.git
cd CodeInChat-Frontend
npm install
npm run dev

🧩 Features

  • ✅ Group creation and management
  • 💬 Messaging between users
  • 🧠 Interactive code cards (step-by-step programming tasks)
  • 🔐 Auth via cookies (secure + HTTP-only)
  • ⚡ Fast, modern UI with Chakra UI

🔐 Auth Note

Authentication is handled using HTTP-only cookies for enhanced security (migrated from JWTs to prevent XSS/Token theft risks).

📌 TODO

  • Add Markdown support to code cards
  • Real-time messaging (WebSocket integration)
  • Dark mode toggle