Developing an app for elementary OS 5 Juno with Vala - My first experience and helpful resources

A week before elementary OS 5 "Juno" was released I installed the beta version and liked the operating system and its fast native apps (all written in Vala, which compiles to C) so much that I started writing my own, to see how it works, learn more about Linux development and to maybe make a few bucks in their app store (called App Center) which is trying to enable Open Source developers to monetize their work by offering a "pay what you want (or nothing at all)" model.

I've written about the elementary OS 5 Juno release here, including a visual tour of the operating system and apps.

I've played around with the Vala programming language a decade or so ago, back when Puppy Linux used it for apps, and a few years before that I played around with Ruby and GTK 2, but since that was so long ago and I didn't create any big projects using the technologies I basically started from scratch to write an elementary OS app. It was a lot easier than I thought, a bit complex so there is a lot of work to be done, but still has a very nice learning curve and GTK is one of the nicer GUI toolkits to work with in my opinion and GTK3 apps just look really nice.

Back when Mac OS X was new and brought Unix apps to Mac users for the first time, it was very popular to write shell wrappers for these command line Unix tools. A shell wrapper is just a fancy term for a graphical frontend for an application that out of the box doesn't have one. Remembering that gave me the idea to do the same for my first elementary app, the command line application youtube-dl is a very popular tool to download videos from YouTube and hundreds of other video websites, but since it has to be used from the command line it's not something most people will be able to use, so this was a perfect target for my first elementary app.

I started going through elementary's Get Started developer documentation, which is a super easy to follow tutorial to get started with developing your first elementary application using Vala and GTK3.

Vala was as far as I can tell abandoned by its developers, it never gained much popularity, but the elementary developers and community have picked it up again and are now for example taking care of the developer documentation called Valadoc and it looks like Gnome (Vala is a Gnome project, specifically made to make working with Gnome's GObject system easier, which is object orientation put on top of C, like Objective-C) is now promoting it again as well.

The lack of popularity is a problem because it means there aren't many tutorials, screencasts and other documentation available, but the cool thing is that Vala code, despite being C-level code, is still really easy to read and since all of the elementary apps are Open Source, you can learn by just reading their source code. There is even an alternative syntax called Genie which closely resembles Python, Vala resembles C# instead. It's just a different syntax, both languages use the valac compiler.

There is actually a very new screencast series that specifically teaches Vala programming for elementary OS, the first episode was uploaded today. Since there is only one episode I cannot say if this will be a good series or not, but It's done by Alessandro Castellani who creates the Akira and Sequeler elementary OS apps, so it might turn into a really cool video series that teaches a lot of tricks from an experienced elementary developer. You can watch it here:

Checking out the source code of the elementary OS apps that come with the operating system helped me a lot, because the Get Started tutorial from elementary covers really just the basic project setup, it doesn't teach you Vala and it doesn't even tell you everything you need to know to setup your project for distribution in elementary's App Center. Also, the reference documentation for Vala is... How can I say that politely... Ah, it takes a very special mind to like it, let's say. There is however a tutorial on the Gnome Vala website which is a very good overview of the Vala language.

I also recommend installing quickDocs and LookBook from the elementary OS App Center. The former is a desktop app to show you the Valadoc API documentation for all the different libraries you can use with Vala, including the standard library GLib, and the latter is an application that gives you a nice overview of all the icons included with elementary that you can use for your own apps in toolbars for example, it even shows you code you can copy and paste into your app.

I started my youtube-dl shell wrapper project (called simply Copy Paste Grab, because I'm terrible at coming up with names) on October 12th according to my version control system and now, just under two weeks later the application I developed is fully working and looks like this:

There are two buttons in the top left that lets you add new videos to download. The first opens up a little popup that shows a text field where you can enter a link to a video, the second button directly grabs a link you've stored in your clipboard.

When you add a new video, a thumbnail and information about the video is downloaded using youtube-dl and then it's shown in a list with a play button to start (or stop) the actual download. Or if the URL isn't supported, an error is shown as a notification at the top and also reflected in the list of downloads. youtube-dl can resume downloads, so you can press the start button again after pressing the stop button to continue the download at any time.

When you start the download for a video, it shows a progress bar with the information youtube-dl provides, which is the percentage downloaded, the current download speed and the estimated time the download will finish. You can also press the play button in the header bar at the top to start all downloads after you've added a few to the list, then multiple videos are downloaded at the same time, which is great if the site you're downloading from is slow.

The broom button in the header bar clears all completed and failed downloads from the list and the gear icon opens a little settings popup which right now just lets you select the folder where videos should be downloaded to. By default it downloads to ~/Videos. I had to learn how GSettings works for that, a curious application settings system used on Linux that at first horrified me because it looked so complex but when you actually understand it it's really neat and easy to use! To understand it I just looked at other elementary apps and then it was easy.

All in all it's not even that much code, this is the stats cloc puts out:

Language	files	blank	comment	code
Vala	7	134	147	632

So just 632 lines of Vala code, without blank lines and comments.

There is of course not that much functionality yet but still quite a lot for so few lines of code, I'm quite happy with it and the development process so far. I've got lots of features planned, for example showing playlists and letting you either download all videos from that playlist or channel or pick and choose, and then also adding some of the advanced youtube-dl functions like extracting just the audio portion of videos which is useful for podcasts for example. I also want to add the ability to download newer versions of youtube-dl automatically (optional) since the youtube-dl that comes with elementary is outdated so some websites won't work with it. But for now I just want to get the bare minimum to work reliably and release the first version :)

I've uploaded the source code to Github so you can check it out if you like, you can install the app from there too, but only do that if you know what you're doing, normal users (read: people who aren't developers) should wait until the app is in the elementary OS App Center, at that point it will be polished enough for general use and will also have gone through the App Center review process which is a combination of automated tests and an actual human looking at your app to see if everything works fine.

Speaking of, let's talk about the App Center submission process! elementary uses a tool for the continuous integration system Travis-CI called Houston to test apps and updates you submit. To make it easier for developers you can install it onto your Github repository yourself, so that you can verify everything works before you submit your app. I did that and... My build failed! And I had no idea why. Then I saw that apparantly this was a known issue, something in Travic-CI changed so the elementary devs had to update Houston which took them two days, so I had to do a bit of waiting. I just have the perfect timing! :)

When it finally did work, Houston via Travis-CI told me what I still needed to do, like adding a few dependencies to the debian/control file. I had to go through this process two times and then my app's build finally passed all the App Center requirements, at least the automated ones.

Now I can send my app in for review by the elementary developers, which since a human will look at it will take a few days. Since that is such an involved process I'll make extra sure I took care of all bugs I can find and polish everything up as much as I can, so hopefully the app will land in the App Center some time next week.

I will also look into providing a .AppImage file for other Linux distributions in the future when I've learned how that works, but for now and probably for the first few months after release it's elementary OS only. Not because I have anything against other Linux distributions, I really love Arch Linux for example (especially the Manjaro derivative), but since I'm just starting to learn Linux development, focusing on just elementary is going to make things much easier for me while I learn ;)