Skip to content

Shortish

Fri Oct 01 2021 00:00:00 GMT+0000 (Coordinated Universal Time)

    In mid 2021, I wanted to learn how to build a native app for phones and tablets, but at the time I didn’t have any experience using Swift or Kotlin for making apps. Wanting to cover as many bases as possible, I looked into React Native and Flutter for creating cross platform apps. I ended up choosing Flutter as it claimed to have more supported platforms including Web and Desktop.

    The goal was to create a cross platform (iOS, Android, Web) link shortening app that supported services like tinyurl.com, is.gd, yourls.org, and shlink.io. Shlink and Yourls are both self hosted, and the idea was that Shortish would support any self hosted service so long as it had a standard REST api. Shlink had some extra features like click analytics that were also supported.

    The problem I always had with these services is that either they never saved a log of your shortened URLs or, if they did, the UI was terrible. I wanted something that would be easy to use on mobile with share hooks and other OS specific features that a web app couldn’t implement. The other major feature that I wanted Shortish to have was the ability to support multiple shortening services and domains. This feature would make it incredibly useful for social media managers managing multiple brands to easily create links without having to manage multiple logins or websites.

    I teamed up with my friend Amaka to create a design that would work cross platform and look good. While her design was never fully realized, it was an incredibly valuable learning experience to work with someone else and learn how to effectively collaborate on design.

    Phase 1 of Shortish is complete. It’s not everything I would like to do with the app, but it does accomplish the following: • Create short links from multiple different services and add custom slugs (not delete or edit) • View link statistics from supported services • View statistics on a map • iOS, Android, and Web • Live beta version available at shortish.app


Image of the homepage of Shortish Image of the homepage of Shortish


    Working with Dart (the language Flutter uses) taught me to think in a different way. Coming from a JavaScript background, I found Dart to be familiar and easy to learn. However, it was so similar to JavaScript, I initially tried using some JavaScript assumptions when writing my code. (for instance JSON trees). Because Dart likes to use Generators for certain features (like enabling JSON support with classes), you have to write your code and data structures in such a way that the Generator will support it. Nesting JSON objects is particularly clunky and tedious.

    Another issue I kept having was how Flutter itself manages its UI types. On the web, I was used to being able to bend the rules slightly to make the UI look the way that I want. Because all of Flutter’s UI objects are just Dart classes and can only be inserted into the UI when explicitly allowed and in a way that has been explicitly defined by the parent class, it makes it much harder to design your UI outside of the normal structure.

    All this to say, Dart and Flutter are very different from the web, but it was a great learning experience to adapt my development habits to a new way of thinking. I hope to continue working on Shortish and add more features to it in the future.

Live Beta Version GitHub