Electron Fiddle: build and play with small Electron experiments locally

Electron Fiddle: build and play with small Electron experiments locally

Tired of downloading by yourself the electron-quick-start repository and modify it according to your needs for quick tests? Because i am, and a lot of developers as well, that's why the Electron team developed a new tool that will help you to quickly execute live tests in Electron, making your life easier.

We are talking about Electron Fiddle, a tool that allows you to create and play with small Electron experiments. It greets you with a quick-start template after opening, just change a few things, choose the version of Electron you want to run your snippet with, and check the results in a live Electron Project. As if this weren't enough, this tool allows you to save the Fiddle as a Github Gist or saving it into a local folder. Once you push the result to GitHub, anyone will be able to test your fiddle by just accesing its URL on the desktop tool.

How to get started

The tool by itself doesn't offer a binary that you can download for your platform, so you will need to download the project and build it with Node.js and NPM. Basically what you need to do is to clone the fiddle repository, install dependencies and run the start script (you need obviously Node.js installed):

REM Download the fiddle project
git clone https://github.com/electron/fiddle.git

REM Get inside the fiddle directory
cd fiddle

REM Install dependencies and start the Fiddle Desktop Tool
npm install && npm start

This will start the desktop application of Electron Fiddle where you can get started with the tests! For more information about this project, please visit the official repository at Github here.

Features

One of the most awesome features of this application is the integration with the succesful HTML/CSS/JS Microsoft Monaco Code Editor. This editor offers support for types, so will always work with an IDE feeling, although Electron Fiddle isn't an IDE at all. It also installs the type definitions for the currently selected version of Electron automatically, ensuring that you always have all Electron APIs only a few keystrokes away:

Monaco Editor Electron Fiddle

You will be able as well to turn your experiment into binaries (build) that you can share with your friends, coworkers, or grandparents. It does so thanks to electron-forge, allowing you to package your fiddle as an app for Windows, macOS, or Linux.

Become a more social person