Product Docs
ShareCodeLive Documentation
A complete guide to public rooms, saved workspaces, access controls, real-time editing, team chat, AI assistance, and the online compiler.
Built for live code sessions
Interview, teach, debug, or pair program.
Interview, teach, debug, or pair program.
Real-time rooms
Live collaboration
Saved workspaces
Persistence
Node, C++, Python
Run code
Built-in AI chat
Assistance
Quick Start
ShareCodeLive supports quick public sessions and durable saved workspaces. Start public when speed matters, then save when ownership and access control matter.
01
Start or Join
Create a public room from the home page or join an existing room with a workspace ID.
02
Collaborate Live
Write code together, switch tabs, chat, run programs, and ask the AI assistant for help.
03
Save When Needed
Log in and save a public room as a workspace when the code should stay tied to your account.
04
Control Access
Invite registered users by email, choose read-only or edit access, and revoke access later.
Feature Reference
These are the major product surfaces and behaviors in the current ShareCodeLive app.
Public Live Workspaces
Use public workspaces for fast collaboration without requiring an account first.
Create a new public workspace from the home page and enter your display name before the editor opens.
Join an existing public workspace by entering the workspace ID or opening a shared workspace link.
Public workspaces sync code and tabs in real time while people are connected to the same room.
Presence updates immediately when someone joins or disconnects, so collaborators see active users in real time.
When the last user leaves a public room, ShareCodeLive keeps the room in memory briefly before cleanup so a normal page refresh can reconnect without losing the live session.
Anyone with the public workspace link can join, so use saved workspaces when access needs to be controlled.
Logged-in users can save a public workspace from the editor header and turn it into a persistent account-backed workspace.
Logged-out users who click save are sent through login first, then returned to the save-workspace flow with the current draft preserved.
Saved Workspace Dashboard
Saved workspaces keep code sessions connected to authenticated user accounts.
The /workspaces page shows a dashboard with recent workspaces in a table view.
The Workspaces view separates workspaces into Created by me and Shared with me.
Each table uses pagination with five workspaces per page so long lists stay manageable.
Search filters workspace names in the Workspaces view.
Updated times are shown as relative labels such as just now, 1 min ago, or 2 hours ago.
Owned workspace rows show the number of users who have access.
Clicking a row opens the workspace editor.
The three-dot row menu lets owners manage users or delete a workspace after confirmation.
Workspace Management
Owners can create, rename, delete, share, and manage access from the dashboard or editor.
Create workspace opens a modal with a workspace name and optional user access list.
Users can be added by email during workspace creation if they already have a registered profile.
The pen icon beside an owned workspace name opens a rename dialog.
Delete workspace is owner-only and requires confirmation before the workspace is removed.
Manage users opens the same access table used in the workspace editor share dialog.
The access table shows user names, exposes email on hover, includes a read-only toggle, and includes a revoke button.
Authentication and Profile
Account authentication powers saved workspaces, profile names, and access lists.
Users can sign up with email and password and provide their name during registration.
Login and signup are separate pages with Google login available when configured.
Forgot password sends users through the reset-password flow and returns them to login after the password update countdown.
The profile page lets authenticated users update the name shown to collaborators.
Logged-in users can open /code directly without entering a public display name because the app already knows their profile name.
Account menus are available on home, workspaces, profile, and editor pages.
Access Controls
Saved workspaces support owner, edit, and read-only collaboration modes.
Owners can invite registered users by email from the create modal, dashboard manage-users dialog, or editor share dialog.
Can edit users can work in the saved workspace and make changes to tabs and code.
Read-only users can view the workspace but cannot edit code, create tabs, rename tabs, close tabs, or use the AI assistant.
Owners can switch a collaborator between read-only and editable access at any time.
Owners can revoke access from the manage-users table.
Saved workspace links are not enough by themselves; the user must be authenticated and have access.
Editor and Tabs
The editor is built for multi-file collaboration with synchronized tab state.
The editor supports many language modes including plain text, JavaScript, TypeScript, Python, C++, Java, Go, PHP, Ruby, Rust, HTML, CSS, Markdown, YAML, and more.
Tabs are shared between collaborators in the same room.
New tabs start in plain text mode until a language is selected.
Each tab shows its selected language logo beside the tab title.
Users with edit access can add tabs, switch tabs, and close tabs when more than one tab exists.
The tab settings gear opens a form where users can rename the tab and change its language together.
Tab setting changes are applied when the user presses Enter in the tab name field or clicks Save.
The active tab content is what the compiler runs and what the download flow includes.
The close button stays visible on every tab and is disabled by design for the final remaining tab.
Read-only saved workspaces keep tab modification controls disabled.
Saving and Unsaved Changes
Saved workspaces combine automatic saving with explicit manual control.
Saved workspace code changes are queued and written to durable storage after the configured autosave delay.
The editor header includes a Save workspace button for manual saves.
The save button is disabled when there are no local unsaved changes.
Ctrl+S on Windows and Cmd+S on macOS trigger the same save behavior in saved workspace editors.
If local changes are unsaved, navigation through the logo, back button, refresh, or page leave is guarded so the user can save first.
Public workspaces are live sessions and should be saved into an account-backed workspace when persistence matters.
Online Compiler
Run the active tab without leaving the collaborative editor.
The compiler panel runs the currently active tab.
Supported run targets are NodeJS 18, C++, and Python 3.10.
Output is shown in the console panel with separate entries for each run.
Runtime errors and network failures are shown in the console and surfaced as alerts.
On mobile, Run lives inside the editor action dropdown to keep the header compact.
AI Code Assistant
Ask for explanations, improvements, or code edits inside the editor.
The AI assistant can explain code, suggest improvements, write code, and help reason through implementation ideas.
AI suggestions are reviewed before they are applied to the editor.
The assistant is available from the editor action area and can stay beside the workspace while users code.
Read-only saved workspace users cannot use the AI assistant because it can prepare edits for the codebase.
The AI Assistant marketing page explains the feature for visitors before they open a workspace.
Team Chat
Keep discussion near the code instead of moving context to another tool.
Workspace chat is available inside the editor for team discussion.
The chat button appears near the Run control when chat is closed.
Unread messages are indicated with a badge on compact and mobile action controls.
On mobile, Chat appears in the editor action dropdown when the chat panel is closed.
Chat can be closed to return more space to the editor.
Collaborative Whiteboard
Sketch diagrams, draw flowcharts, and brainstorm ideas on a shared whiteboard alongside your code.
Toggle between the code editor and the whiteboard from the editor header using the Whiteboard/Code toggle button.
The whiteboard syncs in real time across all collaborators in the same workspace using a shared Excalidraw canvas.
Draw freehand, add shapes, write text, and create diagrams that everyone in the room can see and interact with.
Whiteboard elements persist while at least one user remains in the workspace, so rejoining after a refresh restores the canvas.
Use the whiteboard for architecture diagrams, system design discussions, interview planning, and visual explanations during pair programming.
The whiteboard canvas automatically adjusts to dark and light themes to match the editor appearance.
Downloads and Editor Settings
Developer-focused controls keep the workspace comfortable for different coding styles.
Download exports the workspace as a zip file.
Language is controlled from each tab settings gear so every tab can use its own syntax mode.
Editor Theme lets you pick from 4 built-in Monaco themes (Light, Dark, High Contrast) or 50+ community themes such as Dracula, Monokai, Nord, Night Owl, Solarized, and GitHub Dark. When unset the editor follows the app dark/light mode.
Typography settings include Font Family (any installed or CSS-available monospace font such as Fira Code or JetBrains Mono), Font Size, Line Height, and Font Ligatures (renders → === ≥ with ligature-capable fonts).
Indentation settings include Tab Size (1–16 spaces) and Insert Spaces (spaces vs tabs on Tab key press).
Code intelligence settings include Bracket Pair Colorization, Suggest on Trigger Characters, Format on Paste, Format on Type, and Quick Suggestions.
Display settings include Line Numbers (On / Off / Relative / Interval), Minimap, Folding, Render Whitespace (None / Boundary / Selection / Trailing / All), Render Control Characters, Sticky Scroll (pins the current function or class header while scrolling), Mouse Wheel Zoom (Ctrl+Scroll), Smooth Scrolling, Cursor Smooth Caret Animation, and Rulers (vertical guide lines at custom column numbers).
Cursor settings include Cursor Style (Line / Block / Underline) and Cursor Blinking (Blink / Smooth / Phase / Expand / Solid).
Word Wrap settings include Word Wrap toggle, Word Wrap Column, and Wrapping Indent.
Additional settings include Code Lens, Read Only, Rounded Selection, Automatic Layout, and Scroll Beyond Last Line.
The settings drawer includes a search bar so users can find any specific option quickly.
Support and feedback actions are available from the editor action controls.
On smaller screens, download, feedback, support, run, and chat are grouped into a dropdown.
Theme and Responsive UI
The interface follows system theme by default and adapts across device sizes.
Theme options are System, Dark, and Light.
The selected mode persists across refreshes and is applied before hydration to avoid flicker.
Theme controls are available on the home page, workspaces page, and editor pages.
The home, AI assistant, auth, workspace, profile, and editor surfaces use the shared theme tokens.
Mobile and tablet layouts keep primary controls reachable through compact header actions and dropdowns.
Data Model and Safety Notes
Understand where workspace data lives and how to choose the right room type.
Saved workspace metadata, collaborators, and tabs are stored with the user account.
Access lists are stored per workspace and enforced by the saved workspace access rules.
Public workspaces are best for temporary sessions where everyone with the link is allowed to join.
Public workspace data lives in the live room memory, not account storage, and is cleaned up after the room has been empty for a short idle window.
Saved workspaces are best for durable work, private projects, teaching rooms, and team sessions that need controlled access.
Workspace owners should use read-only access when someone only needs to review code.
Common Workflows
A few practical flows that connect the major features together.
Create a saved workspace
1
Open Workspaces from the account menu.
2
Click Create workspace.
3
Enter a workspace name.
4
Optionally add registered users by email and choose read-only access.
5
Create the workspace and continue in the saved editor.
Save a public workspace
1
Open a public editor session.
2
Click Save workspace in the editor header.
3
If logged out, complete login and return to the save flow.
4
Enter a workspace name and optional collaborators.
5
Save to open the persistent workspace editor.
Rename a tab or change language
1
Open the editor and find the tab you want to update.
2
Click the tab settings gear beside the tab title.
3
Edit the tab name, choose a language, or change both fields.
4
Press Enter in the tab name field or click Save.
5
The tab updates and the settings modal closes.
Manage collaborators
1
Use the workspace table three-dot menu or the editor Share button.
2
Add a registered user by email.
3
Use the read-only toggle to control editing ability.
4
Use revoke to remove access after confirmation.
Ready to try it?
Open a workspace, invite a teammate, run code, and save the session when it becomes worth keeping.