2 min read

Another “code playground” Electron Fiddle comes into the market for enabling developers create, share, and play with small Electron experiments. Electron Fiddle attempts to bring this “fiddling effect” to Electron, a framework for creating cross-platform native applications with web technologies like JavaScript, HTML, and CSS.

It provides you with a quick-start template – just change few things, choose the Electron version you want to run it with, and play around. It also gives you an option of saving it as GitHub Gist or to a local folder and anyone can try your Fiddle by just entering it in the address bar.

How Electron Fiddle works?

1. Each Fiddle has three files:

  • A Main script
  • A renderer script
  • An HTML file

Electron Fiddle

Source: GitHub

2. Choose an Electron Version:

Electron Fiddle knows about all released Electron versions. Open the Preferences window to see all available versions, download them and delete the ones which you don’t need.

Electron Fiddle Preferences

Source: GitHub

3. Run your Fiddle:

Hit the RUN button to give your Fiddle a try and start it.

Electron Fiddle Run Button

Source: GitHub

4. Share your Fiddle:

Save your Fiddle as a public GitHub Gist – this will allow other users to load it by pasting the URL into the address bar. If they don’t have Electron Fiddle, they can see and download your code directly from GitHub.

Electron Fiddle Share

Source: GitHub

You can also package your Fiddle as a standalone binary or as an installer from the Tasks menu:

Electron Fiddle Tasks tab

Source: GitHub

What are the features it comes with?

A good coding experience

It uses Monaco Editor by Microsoft, which also powers VS Code, giving users the common benefits of a modern code editor:

  • Code highlighting
  • Basic JavaScript error checking
  • Refactoring
  • Auto-completion

Share your work with the community

If you are eager to share your work or a bug with the Electron community, you can do that just with a click of a button. To make your Fiddle accessible to those who do not have Electron Fiddle installed, you can share it as a GitHub Gist.

Compile and package your Fiddle as an app  

With the help of Electron Forge, a command line interface for Electron applications, you can turn your Fiddles into binaries and share it as a app for Windows, macOS, or Linux.

A good starting point, continue anywhere you like

If you have just started using Electron, Electron Fiddle provides you with a basic introduction of the Fiddle and usage examples for every single Electron APIs. You can export your project with or without electron-forge and then use your favorite editor for further development.

With an easy installation process you can start using and experimenting with Electron Fiddle now! You can download it from its GitHub repository.

To know more, refer to the announcement on Medium by Felix Rieseberg.

Read Next

HTML5 and the rise of modern JavaScript browser APIs [Tutorial]

How to build a weather app using Kotlin for JavaScript

Firefox 60 arrives with exciting updates for web developers: Quantum CSS engine, new Web APIs and more

LEAVE A REPLY

Please enter your comment!
Please enter your name here