Agent skill

Javascript Typescript

by julianromli in julianromli/opencode-template

JavaScript and TypeScript development with ES6+, Node.js, React, and modern web frameworks.

Install Javascript Typescript

skills CLI

$ npx skills add julianromli/opencode-template --skill javascript-typescript -a claude-code

Project install by default; add -g for ~/.claude/skills/.

GitHub CLI

$ gh skill install julianromli/opencode-template javascript-typescript --agent claude-code

Project scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).

Manual copy

$ git clone --depth 1 https://github.com/julianromli/opencode-template.git skills-src && mkdir -p .claude/skills && cp -r skills-src/skill/javascript-typescript .claude/skills/javascript-typescript && rm -rf skills-src

Use ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.

Claude Code skills documentation · loads skills from .claude/skills/

Paste into Claude Code

Install the "javascript-typescript" agent skill from https://github.com/julianromli/opencode-template/tree/main/skill/javascript-typescript into .claude/skills/javascript-typescript/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "javascript-typescript", then confirm the skill loads.

Claude Code copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

$skill-installer

$skill-installer install https://github.com/julianromli/opencode-template/tree/main/skill/javascript-typescript

Type this inside Codex. $skill-installer <name> installs a curated skill from openai/skills. The installer writes to $CODEX_HOME/skills (default ~/.codex/skills). Restart Codex if the skill does not show up.

skills CLI

$ npx skills add julianromli/opencode-template --skill javascript-typescript -a codex

Project install goes to .agents/skills/; add -g for ~/.codex/skills/.

GitHub CLI

$ gh skill install julianromli/opencode-template javascript-typescript --agent codex

Project scope by default (.agents/skills/); add --scope user for a personal install.

Manual copy

$ git clone --depth 1 https://github.com/julianromli/opencode-template.git skills-src && mkdir -p .agents/skills && cp -r skills-src/skill/javascript-typescript .agents/skills/javascript-typescript && rm -rf skills-src

Use ~/.agents/skills/ instead of .agents/skills for a personal install.

Codex skills documentation · loads skills from .agents/skills/

Paste into Codex

Install the "javascript-typescript" agent skill from https://github.com/julianromli/opencode-template/tree/main/skill/javascript-typescript into .agents/skills/javascript-typescript/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "javascript-typescript", then confirm the skill loads.

Codex copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

skills CLI

$ npx skills add julianromli/opencode-template --skill javascript-typescript -a cursor

Project install goes to .agents/skills/; add -g for ~/.cursor/skills/.

GitHub CLI

$ gh skill install julianromli/opencode-template javascript-typescript --agent cursor

Project scope by default (.agents/skills/); add --scope user for a personal install.

Manual copy

$ git clone --depth 1 https://github.com/julianromli/opencode-template.git skills-src && mkdir -p .cursor/skills && cp -r skills-src/skill/javascript-typescript .cursor/skills/javascript-typescript && rm -rf skills-src

Use ~/.cursor/skills/ instead of .cursor/skills for a personal install.

Cursor skills documentation · loads skills from .cursor/skills/, .agents/skills/, .claude/skills/, .codex/skills/

Paste into Cursor

Install the "javascript-typescript" agent skill from https://github.com/julianromli/opencode-template/tree/main/skill/javascript-typescript into .cursor/skills/javascript-typescript/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "javascript-typescript", then confirm the skill loads.

Cursor copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

gemini skills install

$ gemini skills install https://github.com/julianromli/opencode-template.git --path skill/javascript-typescript

--scope user (default) or --scope workspace; --path is the subfolder of the repo that holds the skill; --consent skips the security confirmation prompt.

skills CLI

$ npx skills add julianromli/opencode-template --skill javascript-typescript -a gemini-cli

Project install goes to .agents/skills/; add -g for ~/.gemini/skills/.

GitHub CLI

$ gh skill install julianromli/opencode-template javascript-typescript --agent gemini-cli

Project scope by default (.agents/skills/); add --scope user for a personal install.

Manual copy

$ git clone --depth 1 https://github.com/julianromli/opencode-template.git skills-src && mkdir -p .gemini/skills && cp -r skills-src/skill/javascript-typescript .gemini/skills/javascript-typescript && rm -rf skills-src

Use ~/.gemini/skills/ instead of .gemini/skills for a personal install, then run /skills reload.

Gemini CLI skills documentation · loads skills from .gemini/skills/, .agents/skills/

Paste into Gemini CLI

Install the "javascript-typescript" agent skill from https://github.com/julianromli/opencode-template/tree/main/skill/javascript-typescript into .gemini/skills/javascript-typescript/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "javascript-typescript", then confirm the skill loads.

Gemini CLI copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

GitHub CLI

$ gh skill install julianromli/opencode-template javascript-typescript

Installs for Copilot at project scope by default; add --scope user for a personal install. Preview a skill first with gh skill preview. Needs GitHub CLI 2.90.0 or later (public preview).

skills CLI

$ npx skills add julianromli/opencode-template --skill javascript-typescript -a github-copilot

Project install goes to .agents/skills/; add -g for ~/.copilot/skills/.

Manual copy

$ git clone --depth 1 https://github.com/julianromli/opencode-template.git skills-src && mkdir -p .github/skills && cp -r skills-src/skill/javascript-typescript .github/skills/javascript-typescript && rm -rf skills-src

Use ~/.copilot/skills/ instead of .github/skills for a personal install. Commit .github/skills so cloud agent and code review can use it.

GitHub Copilot skills documentation · loads skills from .github/skills/, .claude/skills/, .agents/skills/

Paste into GitHub Copilot

Install the "javascript-typescript" agent skill from https://github.com/julianromli/opencode-template/tree/main/skill/javascript-typescript into .github/skills/javascript-typescript/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "javascript-typescript", then confirm the skill loads.

GitHub Copilot copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

skills CLI

$ npx skills add julianromli/opencode-template --skill javascript-typescript -a opencode

OpenCode documents no install command of its own. Project install goes to .agents/skills/; add -g for ~/.config/opencode/skills/.

GitHub CLI

$ gh skill install julianromli/opencode-template javascript-typescript --agent opencode

Project scope by default (.agents/skills/); add --scope user for a personal install.

Manual copy

$ git clone --depth 1 https://github.com/julianromli/opencode-template.git skills-src && mkdir -p .opencode/skills && cp -r skills-src/skill/javascript-typescript .opencode/skills/javascript-typescript && rm -rf skills-src

Use ~/.config/opencode/skills/ instead of .opencode/skills for a personal install.

OpenCode skills documentation · loads skills from .opencode/skills/, .claude/skills/, .agents/skills/

Paste into OpenCode

Install the "javascript-typescript" agent skill from https://github.com/julianromli/opencode-template/tree/main/skill/javascript-typescript into .opencode/skills/javascript-typescript/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "javascript-typescript", then confirm the skill loads.

OpenCode copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

Facts

Skill name: javascript-typescript
GitHub stars: 144
Token cost: ~783 tokens
SKILL.md length: 26 words
Files: 1
Skills in repo: 16
Repo updated: Feb 3, 2026
First seen: Oct 7, 2026
Licence: MIT

At a glance

JavaScript and TypeScript development with ES6+, Node.js, React, and modern web frameworks.

Full-stack JavaScript/TypeScript projects
SKILL.md covers TypeScript Configuration, Type Patterns, Modern JavaScript and React Patterns, plus 1 more section
Instructions only: no scripts, shell commands, URLs or credentials in SKILL.md

What it does

Javascript Typescript is an agent skill from julianromli/opencode-template. JavaScript and TypeScript development with ES6+, Node.js, React, and modern web frameworks. Use for frontend, backend, or full-stack JavaScript/TypeScript projects.

Its SKILL.md is about 780 tokens, which your agent loads only when the skill is triggered. It is a single SKILL.md file with no bundled scripts.

It sits in Frontend & Design. It works with JavaScript, TypeScript, Node.js and React. The repository describes itself as: OpenCode CLI Template by @faizntfd. The licence is MIT.

When your agent uses it

Full-stack JavaScript/TypeScript projects

Example prompts

“/javascript-typescript”

Requirements

Node.js

What it can do on your machine

Read from SKILL.md and the folder at commit 37ceab2. It shows what the files ask for, not the result of running them.

Tool permissions
Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.
From allowed-tools in the SKILL.md frontmatter.
Runs code
No scripts in the folder and no shell commands in SKILL.md (its code samples are typescript, javascript and json).
From the folder's file list and the shell code blocks in SKILL.md.
Network
No URLs in SKILL.md.
From URLs in SKILL.md, links to its own repository left out.
Credentials
Names no API keys, tokens, secrets or passwords.
From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.

Context cost

Javascript Typescript loads about 783 tokens when it runs. Until then it costs about 47 tokens; SKILL.md has 26 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it: ~47
When it runs · the whole SKILL.md, loaded when a task matches: ~783

Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.

Safety

Auto-check passed

The automated check found no risky patterns in SKILL.md.

Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.

SKILL.md

The full file from julianromli/opencode-template at commit 37ceab2, republished under its MIT licence (© julianromli). 26 words, ~783 tokens.

Download SKILL.mdSave it as .claude/skills/javascript-typescript/SKILL.md (or your agent's skills folder).

name: javascript-typescript
description: JavaScript and TypeScript development with ES6+, Node.js, React, and modern web frameworks. Use for frontend, backend, or full-stack JavaScript/TypeScript projects.
source: wshobson/agents
license: MIT

JavaScript/TypeScript Development

TypeScript Configuration

json

{
  "compilerOptions": {
    "target": "ES2022",
    "module": "ESNext",
    "moduleResolution": "bundler",
    "strict": true,
    "noUncheckedIndexedAccess": true,
    "noImplicitOverride": true,
    "skipLibCheck": true,
    "declaration": true,
    "outDir": "./dist"
  },
  "include": ["src/**/*"],
  "exclude": ["node_modules", "dist"]
}

Type Patterns

Utility Types

typescript

// Pick specific properties
type UserPreview = Pick<User, 'id' | 'name'>;

// Omit properties
type CreateUser = Omit<User, 'id' | 'createdAt'>;

// Make all properties optional
type PartialUser = Partial<User>;

// Make all properties required
type RequiredUser = Required<User>;

// Extract union types
type Status = 'pending' | 'active' | 'inactive';
type ActiveStatus = Extract<Status, 'active' | 'pending'>;

Discriminated Unions

typescript

type Result<T> =
  | { success: true; data: T }
  | { success: false; error: Error };

function handleResult<T>(result: Result<T>) {
  if (result.success) {
    console.log(result.data); // T
  } else {
    console.error(result.error); // Error
  }
}

Generic Constraints

typescript

interface HasId {
  id: string | number;
}

function findById<T extends HasId>(items: T[], id: T['id']): T | undefined {
  return items.find(item => item.id === id);
}

Modern JavaScript

Destructuring & Spread

javascript

const { name, ...rest } = user;
const merged = { ...defaults, ...options };
const [first, ...others] = items;

Optional Chaining & Nullish Coalescing

javascript

const city = user?.address?.city ?? 'Unknown';
const count = data?.items?.length ?? 0;

Array Methods

javascript

const adults = users.filter(u => u.age >= 18);
const names = users.map(u => u.name);
const total = items.reduce((sum, item) => sum + item.price, 0);
const hasAdmin = users.some(u => u.role === 'admin');
const allActive = users.every(u => u.active);

React Patterns

typescript

// Props with children
interface CardProps {
  title: string;
  children: React.ReactNode;
}

// Event handlers
interface ButtonProps {
  onClick: (event: React.MouseEvent<HTMLButtonElement>) => void;
}

// Custom hooks
function useLocalStorage<T>(key: string, initial: T) {
  const [value, setValue] = useState<T>(() => {
    const stored = localStorage.getItem(key);
    return stored ? JSON.parse(stored) : initial;
  });

  useEffect(() => {
    localStorage.setItem(key, JSON.stringify(value));
  }, [key, value]);

  return [value, setValue] as const;
}

Node.js Patterns

typescript

// ES Modules
import { readFile } from 'node:fs/promises';
import { join } from 'node:path';

// Error handling
process.on('unhandledRejection', (reason) => {
  console.error('Unhandled Rejection:', reason);
  process.exit(1);
});

Files

Just SKILL.md in skill/javascript-typescript of julianromli/opencode-template.

Open the folder on GitHubat commit 37ceab2

Compare with similar skills

Javascript Typescript next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.

Javascript Typescript compared with similar skills
Skill	Stars	Used in	Tokens	Auto-check	Licence	Repo updated
Javascript Typescript this skilljulianromli/opencode-template	144	—	~783	Automated safety check: Pass	MIT	8 mo ago
Frontend UIoomol-lab/open-flow	223	—	~857	Automated safety check: Pass	Apache-2.0	today
Iconify Iconsoomol-lab/open-flow	223	—	~850	Automated safety check: Pass	Apache-2.0	today
Bit CLIteambit/bit	18k	—	~2k	Automated safety check: Warn	Custom licence	yesterday
Ink Tui Wizardnovuhq/novu	40k	—	~1.9k	Automated safety check: Pass	MIT	today
Generate Release Notesteambit/bit	18k	—	~2.2k	Automated safety check: Pass	Custom licence	yesterday

Similar skills

Frontend UI
oomol-lab/open-flow
Implement and review Open Flow frontend components, styling, layout, and interactions.
223 GitHub stars~857 tokensUpdated today
Frontend & DesignAuto-check passed
Iconify Icons
oomol-lab/open-flow
Search local Iconify JSON and use UnoCSS icon classes in the Open Flow repository.
223 GitHub stars~850 tokensUpdated today
Productivity & AutomationAuto-check passed
Bit CLI
teambit/bit
MUST consult before running ANY bit command. An agent skill from teambit/bit.
18k GitHub stars~2k tokensUpdated yesterday
DevelopmentAuto-check: warnings
Ink Tui Wizard
novuhq/novu
Build terminal user interfaces (TUIs) using Ink (React for CLIs) and @inkjs/ui with a reactive, session-driven wizard pattern.
40k GitHub stars~1.9k tokensUpdated today
Frontend & DesignAuto-check passed
Generate Release Notes
teambit/bit
Generate comprehensive release notes for Bit from git commits and pull requests.
18k GitHub stars~2.2k tokensUpdated yesterday
DevelopmentAuto-check passed
Coding Standards
kurealnum/dotfiles
Universal coding standards, best practices, and patterns for TypeScript, JavaScript, React, and Node.js development.
290 GitHub starsUsed in 17 repos~2.9k tokens
DevelopmentAuto-check passed

More from julianromli/opencode-template

All 16 skills in this repo

Using Git Worktrees
julianromli/opencode-template
A skill your agent uses when starting feature work that needs isolation from current workspace or before executing implementation plans - creates isolated git worktrees with smart directory…
144 GitHub starsUsed in 27 repos~1.4k tokens
Auto-check passed
Ralph
julianromli/opencode-template
Autonomous agent loop for completing features. An agent skill from julianromli/opencode-template.
144 GitHub starsUsed in 1 repo~1.1k tokens
Auto-check passed
Rsc Data Optimizer
julianromli/opencode-template
Optimize Next.js App Router data fetching by converting slow client-side fetching to fast server-side fetching using React Server Components (RSC).
144 GitHub starsUsed in 1 repo~805 tokens
Auto-check passed
Shadcn Management
julianromli/opencode-template
Manage shadcn/ui components using MCP tools. An agent skill from julianromli/opencode-template.
144 GitHub starsUsed in 1 repo~733 tokens
Auto-check passed
Frontend UI Animator
julianromli/opencode-template
Analyze and implement purposeful UI animations for Next.js + Tailwind + React projects.
144 GitHub stars~1.2k tokensUpdated 8 mo ago
Auto-check passed
Agents Md Generator
julianromli/opencode-template
Generate hierarchical AGENTS.md structures for codebases. An agent skill from julianromli/opencode-template.
144 GitHub starsUsed in 1 repo~1.4k tokens
Auto-check: notes

Works with

Questions about Javascript Typescript

What does Javascript Typescript do?

JavaScript and TypeScript development with ES6+, Node.js, React, and modern web frameworks. Javascript Typescript is an agent skill from julianromli/opencode-template.js, React, and modern web frameworks.

When should I use Javascript Typescript?

Javascript Typescript fits situations like: full-stack JavaScript/TypeScript projects.

How do I install Javascript Typescript in Claude Code?

Run `npx skills add julianromli/opencode-template --skill javascript-typescript -a claude-code`. Or copy the skill folder (skill/javascript-typescript in julianromli/opencode-template) into .claude/skills/javascript-typescript in your project. Claude Code loads it when a task matches its description.

How do I install Javascript Typescript in Codex?

Run `npx skills add julianromli/opencode-template --skill javascript-typescript -a codex`. Or copy the skill folder (skill/javascript-typescript in julianromli/opencode-template) into .agents/skills/javascript-typescript in your project. Codex loads it when a task matches its description.

Can I use Javascript Typescript in Cursor, Gemini CLI or GitHub Copilot?

Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add julianromli/opencode-template --skill javascript-typescript -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/javascript-typescript, .gemini/skills/javascript-typescript, .github/skills/javascript-typescript and .opencode/skills/javascript-typescript in your project.

What does Javascript Typescript need to run?

SKILL.md names no scripts, command-line tools or credentials: Javascript Typescript is instructions for the agent only. Our summary lists: Node.js.

Does Javascript Typescript access the network?

SKILL.md contains no URLs. Any network use would come from the scripts or tools the agent runs. This is read from the text; nothing was executed.

Is Javascript Typescript safe to install?

Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.

What licence does Javascript Typescript use?

Javascript Typescript is published under the MIT licence (declared in SKILL.md). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does Javascript Typescript use?

About 783 tokens (SKILL.md is roughly 3.1k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full.

What are the alternatives to Javascript Typescript?

Skills that share tags, products or a category with Javascript Typescript: Frontend UI (oomol-lab/open-flow, 223 stars), Iconify Icons (oomol-lab/open-flow, 223 stars), Bit CLI (teambit/bit, 18k stars) and Ink Tui Wizard (novuhq/novu, 40k stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Javascript Typescript?

julianromli (a GitHub user) maintains it in julianromli/opencode-template, which has 144 GitHub stars. The repository holds 16 skills in this directory. The repository was last updated on February 3, 2026.

Source: julianromli/opencode-template on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.

Install Javascript Typescript

Facts

At a glance

What it does

When your agent uses it

Example prompts

Requirements

What it can do on your machine

Tool permissions

Runs code

Network

Credentials

Context cost

Safety

SKILL.md

JavaScript/TypeScript Development

TypeScript Configuration

Type Patterns

Utility Types

Discriminated Unions

Generic Constraints

Modern JavaScript

Destructuring & Spread

Optional Chaining & Nullish Coalescing

Array Methods

React Patterns

Node.js Patterns

Files

Compare with similar skills

Similar skills

More from julianromli/opencode-template

Related

Questions about Javascript Typescript