Phoenix Code Documentation

website·Indexed 34 days ago

https://docs.phcode.dev/

Developer documentation and API reference for Phoenix Code. Includes guides on creating plugins, managing panels, adding menus and status bar buttons, and using built-in features like Git and the terminal. Provides detailed API references for modules such as MainViewManager, NotificationUI, and various utility classes accessed via brackets.getModule.

Tokens
134K
Snippets
765
Records
1.5K
Agent score
64%

What's inside Phoenix Code

  1. Overview of HTML validation in Phoenix Code

    Phoenix Code includes an HTML Validator to detect errors such as duplicate IDs and unrecognized tags. It supports .html, .xhtml, and .htm files, as well as HTML fragments embedded within .php, .jsp, and .asp files. Linting is automatically triggered upon saving a file, and results are displayed in the problems panel.
  2. Overview of Phoenix Code AI Assistant capabilities

    Phoenix Code includes a built-in AI assistant powered by Claude Code that can write code, fix bugs, explain files, read and edit project files, run terminal commands, and take screenshots. The AI features live preview integration, allowing it to see a running app, interact with it, and verify its own work. AI functionality is available exclusively in desktop applications.
  3. Overview of Phoenix Code API Documentation

    The Phoenix Code API documentation is organized into several key functional areas to help developers build and customize the editor:

    • Creating Themes: Guidelines for building custom visual themes.
    • Creating Extensions: Instructions for writing functional extensions.
    • Node.js Integration: How to utilize Node.js within extensions.
    • Debugging: Guides for efficiently debugging extensions.
    • Publishing: Process for publishing themes and extensions to Phoenix Code.
    • Standard Libraries: A list of available libraries usable within the environment.
    • API Reference: Automatically generated technical documentation containing detailed descriptions of components, functions, modules, and parameters.
  4. Overview of Phoenix Code features vs Brackets

    Phoenix Code is the modern continuation of the Brackets editor, rebuilt to run in browsers and as a desktop app. It maintains the core web-first focus and Live Preview functionality of Brackets while adding several native capabilities. Key improvements include built-in Git integration, a browser-based edition (phcode.dev), visual CSS editing tools, and an active extension marketplace. It is open source under the AGPL-3.0 license.
  5. Overview of Phoenix Code

    Phoenix Code is a lightweight, web-first, open-source (AGPL-3.0) code editor designed for front-end development. Its primary focus is Live Preview, allowing developers to edit HTML and CSS and see real-time rendering. It includes built-in tools such as Git, Terminal, Emmet, Beautify, and code hints, as well as visual editing tools like color pickers and gradient editors.
  6. Overview of Phoenix Code features vs Brackets

    Phoenix Code is the modern continuation of the Brackets editor, rebuilt to run on a modern foundation (Electron/Tauri/Browser) instead of the aging CEF framework. It maintains the web-first focus and lightweight workflow of Brackets while adding several native capabilities.
  7. Overview of SelectionViewManager

    SelectionViewManager provides support for adding interactive preview popups over the main editor when a user selects text or hovers over a selected region. This is typically used to provide interactive editor controls for a selected element. It differs from QuickViewManager in that SelectionViews only appear upon text selection or hovering over a selection, whereas Quickviews appear on simple mouse hover.
    const SelectionViewManager = brackets.getModule("features/SelectionViewManager");
  8. Overview of Phoenix Code features and Brackets comparison

    Phoenix Code is a modern continuation of the Brackets editor, rebuilt to run in browsers and as a native desktop app. It maintains the web-first focus and lightweight workflow of Brackets while adding several native capabilities. Key improvements over Brackets include built-in Git integration, a browser-based edition (phcode.dev), visual CSS editing tools, and an active extension marketplace. It remains open source under the AGPL-3.0 license.
  9. Overview of Phoenix Code features and Brackets comparison

    Phoenix Code is a modern continuation of the Brackets editor, designed specifically for front-end development (HTML, CSS, JavaScript). It retains the core Live Preview and lightweight workflow of Brackets while introducing several modern enhancements. Key differences include built-in Git support, a browser-based edition, and an active extension marketplace.
  10. Overview of Node Extensions in Phoenix Code

    Node Extensions allow Phoenix Code extensions to access the Node.js runtime and the npm ecosystem. Unlike browser-based extensions, Node Extensions can perform system-level operations such as executing shell commands, accessing local files, and integrating with external applications. They are particularly useful for offloading computationally intensive tasks (e.g., image processing or code analysis) to separate processes to avoid freezing the editor's UI. For cross-platform compatibility with browser environments, developers should use Web Workers and bundle dependencies via webpack.
  11. Overview of NodeConnector communication

    The NodeConnector module acts as an intermediary for seamless communication between Node.js and Phoenix (phcode). It allows developers to execute functions on the opposite side using execPeer and trigger events using triggerPeer. The connector implements all APIs supported by the utils/EventDispatcher module.
  12. Overview of utils/EventDispatcher

    The utils/EventDispatcher implements a jQuery-like event dispatch pattern for non-DOM objects. It is compatible with web workers and Node.js. Key features include:

    • Listeners are attached via on()/one() and detached via off().
    • Support for namespaces for easy removal of listeners.
    • Ability to attach to multiple events using a space-separated list.
    • Events are fired via trigger().
    • Robustness: If a listener throws an exception, other listeners are still called and trigger() returns control to the caller.
    • Memory efficiency: Designed to avoid memory leaks associated with jQuery's non-DOM event mechanism.
    • Simplified API: Event handlers do not have this set to the dispatcher; the event object only contains type and target fields.