electron/fiddle

★ 7,731TypeScriptAudience · developerComplexity · 2/5Setup · easy

Mindmap

mindmap
  root((Electron Fiddle))
    What it does
      Electron playground
      Version switcher
    Key Features
      Built-in examples
      GitHub Gist sharing
      VS Code editor
    Output Options
      Run in app
      Package distributable
      Export as project
    Audience
      Electron learners
      App prototypers
    Maintained by
      Electron core team

mindmap root((Electron Fiddle)) What it does Electron playground Version switcher Key Features Built-in examples GitHub Gist sharing VS Code editor Output Options Run in app Package distributable Export as project Audience Electron learners App prototypers Maintained by Electron core team

Click or tap to explore — scroll the page freely

Things people build with this

USE CASE 1

Quickly test whether a specific Electron API works the way you expect by loading a built-in example and running it in seconds.

USE CASE 2

Share a reproducible Electron bug or experiment with others by saving it as a GitHub Gist and sending the link.

USE CASE 3

Try your idea against multiple Electron versions to find when a behavior changed or broke.

USE CASE 4

Package a working experiment into a distributable desktop app for Windows, macOS, or Linux directly from Fiddle.

Tech stack

TypeScriptElectronReact

Getting it running

Difficulty · easy Time to first run · 5min

Download and open the app, a starter template loads automatically, no configuration required.

License terms not specified in the description.

In plain English

Electron Fiddle is a desktop application that lets you experiment with Electron, the framework used to build desktop apps with web technologies. Think of it as a playground: you open it, a starter template is already loaded, you make changes, pick which version of Electron to run it with, and hit play. No complicated setup is needed to get started. When you want to share an experiment, you can save it as a GitHub Gist, which is a simple way to publish a small piece of code online. Anyone who has the link can load your experiment directly into their own copy of Fiddle by pasting the address into the app's address bar. Fiddle includes a full code editor from Microsoft, the same one that powers Visual Studio Code, so the editing experience is familiar and polished. It also includes built-in examples for every feature that Electron exposes, so you can quickly try out anything from taking screenshots of the screen to managing browser windows. Once your experiment is ready to become a real application, Fiddle can package it into a distributable app for Windows, macOS, or Linux. It can also export the code as a proper project folder that you can continue developing in any code editor you prefer. It is intended as a starting point and learning tool, not a full development environment.

Copy-paste prompts

Prompt 1

Using Electron Fiddle, write the main process and renderer code to open a native file-picker dialog and display the selected file path in the window.

Prompt 2

I want to test the Electron shell.openExternal API in Fiddle. Write the minimal main.js and index.html that adds a button which opens a URL in the default browser.

Prompt 3

Show me how to use Electron Fiddle's GitHub Gist feature to save and share my experiment, including what files get published and how someone else loads them.

Prompt 4

I built something in Electron Fiddle and want to turn it into a real app. Walk me through the export-to-project step and what folder structure I'll get.

Open on GitHub → Explain another repo

← electron on gitmyhub — every repo by this author, as a profile.

Verify against the repo before relying on details.