https://github.com/narsibhati-dev/cosketch
CoSketch is a real-time collaborative drawing application built using Turborepo and Bun as the package manager. It includes separate apps for the frontend, backend API, and WebSocket server to enable seamless collaboration.
https://github.com/narsibhati-dev/cosketch
express-js express-middleware jwt-authentication nextjs15-typescript postgresql prisma-orm react-hot-toast react19 tailwindv4 turborepo
Last synced: 2 months ago
JSON representation
CoSketch is a real-time collaborative drawing application built using Turborepo and Bun as the package manager. It includes separate apps for the frontend, backend API, and WebSocket server to enable seamless collaboration.
- Host: GitHub
- URL: https://github.com/narsibhati-dev/cosketch
- Owner: NarsiBhati-Dev
- Created: 2025-03-10T17:50:04.000Z (3 months ago)
- Default Branch: master
- Last Pushed: 2025-03-26T13:16:43.000Z (2 months ago)
- Last Synced: 2025-03-26T14:32:06.308Z (2 months ago)
- Topics: express-js, express-middleware, jwt-authentication, nextjs15-typescript, postgresql, prisma-orm, react-hot-toast, react19, tailwindv4, turborepo
- Language: TypeScript
- Homepage:
- Size: 5.96 MB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# CoSketch
CoSketch is a **real-time collaborative drawing application** built using **Turborepo** and **Bun**. It includes separate apps for the frontend, backend API, and WebSocket server to enable seamless collaboration.
---
## 🏗 Project Structure
This monorepo is managed using **Turborepo** and is structured as follows:
```sh
cosketch/
├── apps/ # Contains independent applications
│ ├── cosketch-frontend/ # Next.js app for the UI
│ ├── cosketch-backend/ # Express backend for API handling
│ ├── cosketch-websocket/ # WebSocket server for real-time collaboration
├── packages/ # Shared code across apps
│ ├── database/ # Prisma & PostgreSQL setup
│ ├── types/ # Shared TypeScript types
│ ├── ui/ # Shared UI components (e.g., buttons, modals)
│ ├── backend-common/ # Common utilities for backend services
├── turbo.json # Turborepo config file
├── package.json # Root package.json for Bun & Turborepo setup
└── README.md # Project documentation
```
---
## 🚀 Getting Started
### 1️⃣ Install Dependencies
Ensure **Bun** is installed on your system:
```sh
bun install
```
### 2️⃣ Start the Development Environment
Use Turborepo to start all apps simultaneously:
```sh
bun run dev
```
### 3️⃣ Run Individual Apps
You can start specific apps independently:
```sh
# Start frontend (Next.js)
bun run dev --filter=cosketch-frontend
# Start backend (Express API)
bun run dev --filter=cosketch-backend
# Start WebSocket server
bun run dev --filter=cosketch-websocket
```
---
## 📦 Tech Stack
- **Turborepo** → Monorepo management
- **Bun** → Fast JavaScript package manager & runtime
- **Next.js** → Frontend framework
- **Express.js** → Backend API
- **WebSockets** → Real-time collaboration
- **PostgreSQL** → Database
- **Prisma** → ORM for database management
- **Docker** → Containerized database for development
- **Sharp** → Image processing
---
## 🗄 Database Setup
### Start PostgreSQL with Docker
```sh
bun db:up
```
### Stop PostgreSQL
```sh
bun db:down
```
### Run Database Migrations
```sh
bun prisma migrate deploy
```
### Connect to PostgreSQL via CLI
```sh
docker exec -it psql -U -d
```
> Replace ``, ``, and `` accordingly.
---
## 📜 Available Scripts (Root `package.json`)
```json
{
"scripts": {
"build": "turbo run build",
"dev": "turbo run dev",
"start": "turbo run start",
"lint": "turbo run lint",
"format": "prettier --write \"**/*.{ts,tsx,md}\"",
"check-types": "turbo run check-types",
"db:up": "docker-compose -f docker/docker-compose.yml up -d",
"db:down": "docker-compose -f docker/docker-compose.yml down",
"generate": "turbo run generate"
}
}
```
---
🚀 **"Sketch Together, Think Better."**