Electron Fiddle - The easiest way to get started with Electron JavaScript desktop development

A few days ago, a new project called Electron Fiddle was introduced in an article on Medium. It's part of the official Electron project and is described as an Electron version of sites such as JSFiddle or CodePen, where you can quickly prototype JavaScript projects or share working code snippets with other programmers.

I've taken a look at it and I think it's actually more than that. Its tagline "The easiest way to get started with Electron" says it best. It's a lot like Lightmod, which I've written about a while ago and also wrote a small tutorial for here on Steemit. Lightmod makes it super easy for you to get into ClojureScript & Reagent development which is what I use for web development these days, without needing to install anything else. It's batteries included so you can focus on learning and when you want to take the next step and want to go beyond the learning evironment, you can export your project and use the "real" tools the ClojureScript world offers, like boot and leiningen and editors like Emacs or Atom with the ProtoREPL plugin.

Electron Fiddle is basically that, but for Electron to create desktop applications using JavaScript or languages that compile to it like TypeScript or ClojureScript. It's an app you install on Windows, Linux or Mac, which takes care of everything else so you don't need to install other dependencies or find a good text editor with a number of plugins that work well with Electron.

You are presented with an IDE specific for Electron development. It's split in three parts, on the left you've got an area with code for the Electron main process, and on the right you've got two areas with code, the top one for the renderer process code and the bottom one with HTML that renders that code.

When you start the app, those three areas are already filled with a hello world type example code, so even if you've never used Electron before, you can get started by just making changes to this example code and then clicking the run button to see the code in action.

It even comes with a very brief tutorial and quite a few example projects of how to use the different Electron APIs that you can open with one click, so makes for a great beginner learning tool. And just like with Lightmod, you can export your projects and work with other tools on the project when you go beyond the limits of Electron Fiddle.

You don't even need to use npm on the command line, just require a module and Electron Fiddle installs it automatically for you.

Beyond learning, the tool can also be used to share small Electron projects as snippets, to show someone a specific feature in example code for example, so it can be used as a teaching tool, or to show a problem when you make a bug report. The Electron project is uploaded as a Gist snippet to Github and anyone with Electron Fiddle installed can then just paste the gist URL into the app to load it, or look directly on Github at the code if they don't have it installed.

I highly suggest giving it a try if you are at all interested in Electron.

Now, any post talking about Electron cannot be complete without mentioning the all to familiar criticism of Electron. There are people who absolutely love it and people who absolutely hate it, because of all the bloat, apps are huge and use tons of RAM. I fall somewhere in the middle. I do believe for most desktop apps you should use something like Red instead to create a fully native desktop application, but I am also not completely against Electron. I've used its predecessor node-webkit extensively for two years on a commercial project and quite liked it aside from the bugs which are probably gone in Electron since it's a much bigger project with a by now giant community behind it.

I think when your app needs to display HTML anyhow, when you develop a very social app that integrates with other social APIs and embedded content from social networks, then Electron can be a great fit. Then, the bloat has an actual excuse for being there. So I'm not going to say Electron is great, use it! Nor am I going to say Electron is terrible and needs to die. Instead, I suggest to evaluate it on a case by case basis.