Skip to main content

Installation

Get Code Editor Thing running on your machine in just a few steps. This guide covers prerequisites, installation, and platform-specific considerations.

Prerequisites

Before installing Code Editor Thing, ensure you have the following installed:

Node.js

Version 16.x or higher recommended

npm or pnpm

Package manager for installing dependencies
Code Editor Thing uses Electron 33.x and requires Node.js to build native modules like node-pty for terminal support.

Verify Your Setup

Check your Node.js and npm versions:
node --version  # Should be v16.x or higher
npm --version   # Should be v8.x or higher

Installation Steps

1

Clone the Repository

Clone the Code Editor Thing repository to your local machine:
git clone https://github.com/yourusername/code-editor-thing.git
cd code-editor-thing
Replace yourusername with the actual repository location.
2

Install Dependencies

Install all required npm packages:
npm install
This will install:
  • React 18.3 and React DOM for the UI
  • Electron 33.4 for the desktop framework
  • CodeMirror 6 and language extensions
  • Vite 6 for development and building
  • TypeScript 5.6 for type checking
  • Tailwind CSS 3.4 for styling
  • xterm.js and node-pty for terminal support
  • Lucide React for icons
The postinstall script automatically runs electron-builder install-app-deps to rebuild native modules for your platform.
3

Build Electron Main Process

Compile the Electron main process:
npm run build:electron
This compiles electron/main.ts and electron/preload.ts into CommonJS modules that Electron can run.
4

Verify Installation

You’re ready to go! Verify everything works by running the development server:
npm run electron:dev
This will:
  1. Build the Electron main process
  2. Start the Vite development server
  3. Launch the Electron application
If the app window opens successfully, your installation is complete!

Platform-Specific Notes

macOS

On macOS, Code Editor Thing uses native keyboard shortcuts:
  • Cmd+O - Open folder
  • Cmd+S - Save file
  • Cmd+B - Toggle sidebar
  • Cmd+Shift+T - Toggle terminal
The app builds as a .dmg installer when you run:
npm run electron:build

Windows

On Windows, the terminal defaults to PowerShell. You can modify this in electron/main.ts:143. Keyboard shortcuts use Ctrl instead of Cmd:
  • Ctrl+O - Open folder
  • Ctrl+S - Save file

Linux

Linux users may need to install additional dependencies for Electron:
# Debian/Ubuntu
sudo apt-get install libgtk-3-0 libnotify4 libnss3 libxss1 libxtst6 xdg-utils libatspi2.0-0 libdrm2 libgbm1 libxcb-dri3-0

# Fedora
sudo dnf install gtk3 libnotify nss libXScrnSaver libXtst xdg-utils at-spi2-atk

Troubleshooting

Native Module Build Failures

If node-pty fails to build:
# Install build tools
npm install --global node-gyp

# Rebuild native modules
npm run postinstall

Electron Window Doesn’t Open

Check that the Vite dev server is running:
# Terminal 1: Start Vite
npm run dev

# Terminal 2: Start Electron
node start-electron.cjs
Make sure port 5173 is not in use by another application. Vite’s dev server must be accessible for Electron to load the UI.

TypeScript Errors

Rebuild TypeScript declarations:
npm run build

Available Scripts

Once installed, you have access to these npm scripts:
ScriptDescription
npm run devStart Vite development server
npm run buildBuild production React app
npm run build:electronCompile Electron main/preload
npm run electron:devRun Electron in development mode
npm run electron:buildBuild production Electron app
npm run previewPreview production build

Next Steps

Now that Code Editor Thing is installed, learn how to use it:

Quickstart Guide

Run the app, open a folder, and start editing code

Build docs developers (and LLMs) love