skills.rest
tincopper
tincopperCOMMUNITY
Explore all skills by this author →
GitHub

xterm-js

Build and configure xterm.js terminal emulators for web and Electron apps.

10|Updated Mar 21, 2026
Search Tags:#react#electron#websocket#xterm.js#node-pty#terminal emulator#webssh
One-click install
npx skills add https://github.com/tincopper/neeko --skill xterm-js-tincopper
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: xterm-js
Source: https://github.com/tincopper/neeko/tree/main/.agents/skills/xterm-js
Command: npx skills add https://github.com/tincopper/neeko --skill xterm-js-tincopper

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

xterm-js helps you add a real interactive terminal to browser or Electron apps instead of trying to fake shell behavior in the UI. It is useful when you need persistent agent sessions, remote shell access, or an embedded console that behaves like a desktop terminal.

Core Features & Use Cases

  • Terminal Integration: Create and configure xterm.js instances with the right options, themes, and addons.
  • Backend Connectivity: Connect the terminal to node-pty, WebSocket, or other PTY backends for live command execution.
  • User Experience: Handle resizing, keyboard shortcuts, search, links, clipboard, and WebGL fallback for polished terminal UX.
  • Use Cases: Build in-browser shells, WebSSH dashboards, Electron command panes, AI coding tools, and project-specific terminals that stay alive across navigation.

Quick Start

Use the xterm-js skill to design an interactive terminal component for my app, connect it to a node-pty backend over WebSocket, and include the resize, theming, and disposal practices needed for a stable production experience.

Frequently Asked Questions about xterm-js

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I add an interactive terminal emulator to my React web app?▼

You can add an interactive terminal emulator to a React web app by creating and configuring an xterm.js instance, ensuring correct DOM mounting, and integrating it with a backend process like node-pty over WebSocket for live command execution.

What's the best way to build a WebSSH terminal backed by node-pty?▼

Building a WebSSH terminal requires connecting your frontend terminal emulator to a node-pty backend over WebSocket, then handling live command execution, encoding, and disposal to ensure a stable production experience for remote shell access.

Can I use xterm.js for an embedded console in Electron applications?▼

Yes, xterm.js can be used to build Electron command panes by configuring the terminal emulator instance with the right options, themes, and addons, then connecting it to a PTY-backed shell for persistent agent sessions.

Why does my browser terminal break when resizing the window?▼

Browser terminal resizing issues occur without disciplined resize and disposal handling; you must properly configure terminal resizing events and update the PTY backend dimensions to maintain a stable production experience.

Do I need a WebSocket backend to run shell commands in a browser terminal?▼

Yes, a browser terminal requires a backend process such as node-pty over WebSocket to execute shell commands live, as the frontend terminal emulator only handles display, keyboard input, and user experience.

Related Skills

Explore More Software Engineering Skills→
bermudibermudi

pty-handling

Spawn and manage PTY sessions with I/O streaming and shell wrapping.

Community
Advanced
GGPromptsGGPrompts
1

xterm-js

Implement xterm.js terminal UIs with React hooks and WebSocket I/O.

Community
Advanced
Dzakiamriz22Dzakiamriz22
1

command-palette

Implement keyboard-accessible command palettes with the shadcn/ui Command component.

Community
Intermediate
sblueminsbluemin
16

desktop-e2e

Automate end-to-end testing of the Fleet Console Electron Desktop shell.

Community
Advanced