Get 10X more out of your pair programming sessions

A real-time collaborative coding environment built for pair programming, technical interviews, and focused coding discussions — with live code sync, AI assistance, and more.

---

---

Table of Contents

• Features
• Tech Stack
• Project Structure
• Getting Started
• Documentation
• License

---

Features

Category	What's Included
Real-Time Collaboration	Live code sync via Yjs + Liveblocks, Monaco Editor (VS Code engine), multi-language support, live cursors & selections with user colors
AI Assistance	AI-powered session bootstrap (generates problem + starter code), integrated AI chat panel, powered by OpenRouter (Kimi model)
Code Execution	Docker-isolated execution for Python, JavaScript, C, C++ — shared output synced to all collaborators
Interview Mode	Problem panel with difficulty, hints system, complexity display, solution reveal
Premium UI/UX	Glassmorphism, dark mode, JetBrains Mono, Framer Motion transitions, route-aware shutter animations
Presence	Avatar stack, live cursors, sync status badge, connection loss toasts
Coming Soon	WebRTC audio calls, Excalidraw whiteboard, follow-me cursor, execution queue

---

Tech Stack

Frontend

Technology	Purpose
React 19	UI framework with concurrent features
TypeScript	Type-safe development
Vite	Build tool and dev server
Tailwind CSS v4	Utility-first styling
Liveblocks	Real-time presence, CRDT sync, broadcast
Monaco Editor	VS Code-grade editor
Yjs + y-monaco	Conflict-free collaborative document
Framer Motion	Animations and route transitions
React Router v7	Client-side routing

Backend

Technology	Purpose
Node.js + Express	HTTP server with layered routing
TypeScript	Type-safe server code
Liveblocks Node SDK	Server-side room seeding
OpenRouter SDK	AI model access (Kimi, etc.)
Docker SDK	Ephemeral code execution containers

---

Project Structure

session/
├── frontend/
│   └── src/
│       ├── components/
│       │   ├── editor/           # Monaco, TopBar, AIChat, OutputPanel,
│       │   │                     # LiveCursors, AvatarStack, ConnectionToast,
│       │   │                     # BroadcastProvider, NotificationsPanel...
│       │   ├── landing/          # Hero, SessionInput, SessionLoadingScreen,
│       │   │                     # Header, Footer, Marquee...
│       │   ├── ui/               # hero-shutter-text, weave-spinner, link-preview
│       │   ├── Editor.tsx        # RoomProvider + CollaborativeEditorInner
│       │   └── RouteTransition.tsx
│       ├── hooks/                # useRoomSettings
│       ├── utils/                # getContrastingColor, useBoundingClientRectRef
│       ├── liveblocks.config.ts  # Presence/Storage types
│       ├── App.tsx               # Routes + editorReady state
│       └── index.css             # Design tokens, global styles
│
├── backend/
│   └── src/
│       ├── config/               # env.ts, kimi2thinking.ts
│       ├── controllers/          # session, aichat, execute
│       ├── middleware/           # errorHandler, asyncHandler
│       ├── routes/               # ai.routes.ts, code.routes.ts
│       ├── services/             # session, liveblocks, aichat, execute, yjs
│       └── utils/                # languageMapper
│
├── docs/
│   ├── ARCHITECTURE.md           # System design, data flow diagrams
│   ├── CONTRIBUTING.md           # Workflow, code style, project-specific notes
│   ├── DEPLOYMENT.md             # Vercel + Render setup
│   └── ENV_VARS.md               # All environment variables reference
│
└── README.md

---

Getting Started

Prerequisites

• Node.js v18+
• npm
• Docker (required for code execution feature)
• A Liveblocks account (free) — get your keys at liveblocks.io
• An OpenRouter API key — openrouter.ai

Installation

git clone https://github.com/silky-x0/session.git
cd session

# Backend
cd backend
npm install
cp .env.example .env    # then fill in your keys

# Frontend
cd ../frontend
npm install
cp .env.example .env    # then fill in your keys

# Pull Docker images for code execution
docker pull python:3.11-alpine
docker pull node:20-alpine
docker pull gcc:latest

Running Locally

# Terminal 1 — Backend (http://localhost:1234)
cd backend && npm run dev

# Terminal 2 — Frontend (http://localhost:5173)
cd frontend && npm run dev

Open http://localhost:5173, click "Start Session", share the URL — done.

---

Documentation

Doc	Contents
docs/ARCHITECTURE.md	System diagram, component tree, data flow, Yjs/Liveblocks internals, execution pipeline
docs/ENV_VARS.md	Every environment variable for backend and frontend
docs/DEPLOYMENT.md	Render + Vercel deployment instructions
docs/CONTRIBUTING.md	PR workflow, code style, project-specific gotchas

---

License

MIT — see LICENSE.

---

Built with ♥ by the Session Contributors

Website • Report Bug • Request Feature

⭐ Star this repo if you find it helpful!