Learn 8 Developer Tools concepts for Frontend development, with definitions, aliases, and ready-to-use AI prompts.
Hosts a command-line session with output, prompt, history, and process state.
Create an accessible integrated terminal panel with a named session, scrollback, command prompt, process status, copy, clear and stop controls, keyboard-safe shortcuts, high-contrast selection and cursor, resize support, preserved output, and explicit warnings before pasting or running untrusted commands.Compares original and changed text using added, removed, and contextual lines.
Create an accessible code diff viewer with unified and side-by-side modes, file and hunk headers, line numbers, added and removed text marked with words and symbols as well as color, keyboard navigation between changes, whitespace controls, copy support, syntax highlighting, and a plain-text patch alternative.Browses nested project folders and files with selection and expansion states.
Create an accessible file tree using tree semantics, expandable folders, selected and focused states, Arrow-key navigation, Home and End behavior, type-ahead, file icons with text names, rename and context actions, lazy-loading feedback, path breadcrumbs, and preserved expansion state after refresh.Explores nested JSON values through expandable typed nodes.
Create an accessible JSON tree viewer with expandable objects and arrays, visible data types, quoted strings, property counts, copy path and value actions, keyboard tree navigation, search, long-value wrapping, circular-reference and error handling, virtualization for large payloads, and a raw-text alternative.Streams timestamped application events with levels, search, filtering, and pause controls.
Create an accessible log viewer with timestamp, level, source and message columns; level filters; search; pause and resume; follow-tail control; copy and download; bounded retention; wrapped or horizontal viewing; keyboard navigation; and live updates that do not steal focus or announce every line.Renders Markdown beside or instead of its editable source.
Create an accessible Markdown preview that renders semantic headings, lists, links, tables, images and code blocks from the editor source. Sanitize untrusted HTML and URLs, keep heading order valid, label the preview region, synchronize scroll only as an optional control, expose render errors, and preserve a source-only mode.Edits Markdown source with formatting helpers and a rendered preview.
Create an accessible Markdown editor with a labeled source textarea or editor, formatting toolbar, keyboard shortcuts with visible alternatives, syntax assistance, preview toggle or split view, autosave status, undo and redo, safe paste handling, character or word count, error recovery, and no dependency on syntax color alone.Edits source code with language-aware navigation, diagnostics, and commands.
Create an accessible code editor for JavaScript with a clear label, language and cursor status, line numbers that are not read as content, keyboard navigation, tab-key configuration, search, diagnostics linked to exact lines, autocomplete that follows combobox behavior, high-contrast themes, undo, autosave, and a plain textarea fallback.