Last week we announced the release of Rodeo v1.0. The big deal was that we’d taken Rodeo from a command line, python app built using Flask, to a more legitimate looking desktop app.
There were comments on reddit and twitter mentioning that it seemed like Rodeo was running it’s own browser behind the scenes–and these comments were 100% correct! That’s because Rodeo 1.0 is built with Electron, a cross-platform framework for building desktop apps with good ‘ole javascript and HTML. (check out the code on GitHub)
To put it simply, you can build great looking windows and osx applications without mastering C# or Objective-C…with a single codebase. Sounds pretty nice, right? Want to learn more about how we did it? Keep reading!
Our latest creation, Rodeo, is built with Electron.
Taking Rodeo to the desktop
The first version of Rodeo ran as a Flask web app with a command line client. This worked well enough, but we found that by requiring Rodeo to be used via the command line, we were instantly decreasing our addressable user-base. Not so surprising.
As a result, we decided that we needed a desktop version of Rodeo.
Say “Hello” to Electron
We really didn’t want to get into the business of building a native app– especially since our users are split fairly evenly between Mac and Windows. This led us to Electron. Electron really fit the bill:
- ✓ ships with windows and mac installers
- ✓ runs on the desktop
- ✓ no OS specific code required
But the real kicker is that you can write your entire application using node.js! For Rodeo, this meant that 80% of the code from the Flask app was reusable.
Under the hood, it’s our old friends HTML, CSS, and Javascript.
What Electron does
Aside from distribution, Electron is doing some pretty nifty stuff. By far my favorite thing it does is that it binds node.js to the native UI. You can use things like windows, file dialogs, and Finder/Explorer all from the comfort of javascript.
In addition to native UI components, Electron acts as your “server”. In actuality it’s a Chromium window with some magic fairy dust sprinkled on top of it. It has built in support for websocket-esque messages (ipc) so it feels a lot like building a “regular” app.
Lastly, and possibly most importantly, you can use node modules from within your “front-end”. So for example, if you’re adding an DOM event that will create a file, you can just use fs.writeFile instead of having to make an AJAX request to your server. In other words, you’re going to write a lot less code, and accomplish just as much!
Do more by doing less.
Great, easy to use packages
Another great part about Electron, without a doubt, is the packages that come with it. Even though it’s a relatively new project, there are already some very helpful 3rd party libraries. For instance, we’re using electron-packager to distribute OS specific executables, electron-builder to build OS specific installers, and Nuts for distribution/download management.
There are tons of other great resources for getting started.
We’re using electron-builder to build windows and osx installers.
Finishing up
Interested in Rodeo? Click on the link below to learn more about it and to download it for free. You can checkout the code on github. If you’re interested in working on products like Rodeo, checkout our jobs page. We’re hiring!
Want to read more about Electron? Check out these resources: