Shortcuts app: inspired by Opera pinned chats

As I was enjoying the integrated chat feature of Opera, I thought I could create a dedicated desktop app.

Shortcuts App logo
Shortcuts App logo

Introduction

Shortcuts App is born from a completely stolen idea from the Opera browser: messengers. This feature allows to have messengers web apps running in the sidebar. They are different from normal tabs because they’re like “native” apps living in your sidebar. Pretty handy!

And I thought: “What if I coded this in a dedicated app?” and I did so. Looking back at it, it looks like a simplified browser running on a full Chromium instance…

Anyway, it did sound good to me and I implemented the following features:

  • Adding a shortcut
  • Removing a shortcut
  • Reordering shortcuts
  • Auto updating

I did everything by myself using the following techs:

Here is the repo.

Example screenshot of the app running
Example screenshot of the app running

Purpose and Goal

Well, I found the idea pretty wise (eggsy as well) and I also wanted to try out Electron.

My only goal was to produce the 4 features I mentioned above…and an app that just work.

I didn’t much planning as I had only been coding for 1 year as a self-taught.

Spotlight: app update

Delivering updates is a critical part of software development. It’s even more true on desktop where most apps don’t come from stores, which manage updates for you.

I’m not magician, I used a really cool library called electron-updater that uses GitHub releases to publish updates. The app then looks for new releases in the repository and fetches the new binary.

Current status

That was a quick project (1 week only) and I stopped there but I’m sure there is much to do with the idea!

Actually, I feel like Sidekick achieves the same, but much cleaner. But not open-source!

Lessons Learned

This project allowed me to learn Electron, but also to use Vue.js in a different environment (different from browser).

I also had a quick look at code signing and looks like it can’t be achieved for free for OSS.

Concerning the techs, I’m happy with my choices. I initially wanted to use Alpine.js but couldn’t get it to work. I lacked experience and just turned out to Vue as I used before, but I’ve used this tool since then without much issues.

Get in touch

Feel free to reach out if you're looking for a developer, have a question or just want to connect.