At Qusion, we recently started working with GraphQL on mobile. So, we did some research on what are the best practices and we decided on using the Apollo Android library. We also wanted to use that in a Kotlin "coroutine world", so in this article I'm going to share what we learned and how we structured our code.

Kotlin in Consuming GraphQL on Android (Part 1) 

Qusion

At Qusion, we recently started working with GraphQL on mobile. So, we did some research on what are the best practices and we decided on using the Apollo Android library. We also wanted to use that in a Kotlin "coroutine world", so in this article I'm going to share what we learned and how we structured our code.
 
<h2>Apollo - The Coroutine Way </h2>
Anyone who stumbes into Apollo's Getting Started guide is greeted with lots of Java Callbacks in the examples. But, deeper in their github documentation there is a small section on support for RxJava and Kotlin Coroutines. And we will stricly focus on the latter. Of course, Rx is a solid way, but I've found that coroutines are very powerful and easier to organize.&nbsp;
 
The apollo library has a very clean extension function on ApolloCall that creates a Deferred object and enqueues it in the Callback. This is what we are going to use in order to convert this callback-based system to a nice coroutine world.
<img src="https://storage.googleapis.com/qusion-cms-development/ck3u4nvj300010os60y4fhzct.png" alt="" style="height: ;width: "/>
 
This gives us a way to do one-shot calls to our back-end or local database since it only returns the first response. Now we can use that in a repository:
 
<img src="https://storage.googleapis.com/qusion-cms-development/ck3u4os0q00030os68vh34v06.png" alt="" style="height: ;width: "/>
 
Let's quickly unpack this code. The ApolloService is just a wrapper around the library's ApolloClient. The .await() keyword is suspending (waits for the result of the Deferred object). This is executed sequentually and that's the reason the function is a suspend function, i.e it will be called in some launched coroutine. 
The flaw here is that this is a very "simplistic" approach, i.e there is no network nor business error catching. And that logic is usually shared between all the queries/mutations, so it's way nicer to abstract it in a single place. That place would be our custom ApolloService class. We need to expose an interface with generic query/mutation functions. We also need a way to encapsulate state. This is where Kotlin's sealed classes come in play.&nbsp;
 
<img src="https://storage.googleapis.com/qusion-cms-development/ck3u4sh2900040os65b9vbsre.png" alt="" style="height: ;width: "/>
(Strongly recommend using sealed classes for any sort of "state representation") 
Now having this in mind, the ApolloServiceImpl looks like this:
 
<img src="https://storage.googleapis.com/qusion-cms-development/ck3u4t73000050os651euh1ih.png" alt="" style="height: ;width: "/>
We have a single place where all the errors of any query/mutation are caught. The repositories only knows how to build the actuall query data (the generated classes from apollo) and just passes it to this function. That way we don't put too much responsibility in a single layer.&nbsp;
 
The call side in the reposity looks much cleaner now:
 
<img src="https://storage.googleapis.com/qusion-cms-development/ck3u4tqq800060os6boi8hg44.png" alt="" style="height: ;width: "/>
Let's move closer to the UI and see how the ViewModels should behave. We need a scope to launch this coroutine and, when we get the result, we need some LiveData to update. We pass in an IO Dispatcher, to notify that this coroutine will be doing some "heavy" work. For the scope we use `viewModelScope`, which is tied to the lifecycle of the ViewModel, so when it gets destroyed, all the coroutines are cancelled and there are no leaks.
 
This is a simple usage in a ViewModel:
 
<img src="https://storage.googleapis.com/qusion-cms-development/ck3u4ulqp00070os66c6ygt24.png" alt="" style="height: ;width: "/>
With that, we wrap the whole flow. What we accomplished is the following: We can do a simple "fire and forget" query (to do some heavy work off the main thread), in which all the error are caught and the response is used to properly update the UI. All of that in a nice readable way with Kotlin coroutines.&nbsp;
 
<h2>A New Hope - Channels </h2>
There is one "catch" in our previous approach. On mobile we sometimes need to show cached data first while we try to fetch the latest from the network. And we can't do that elegantly with our initial one-shot query approach. 
Luckily, Kotlin has Channel and Flow that work perfectly in this use-case. Channel is a Kotlin primitive used to communicate between coroutines and Flow is a cold (asyncronous) stream of data that can emit values, to be later consumed.&nbsp;
There is of course much more to it that what I just mentioned, but it's enough to help us tackle this specific use-case. It's definetly worth knowing more about Flows and Channels tho. 
The idea is to feed a Channel (offer/send data to it) wherever we get a response from an enqueued apollo callback. Then send a NetworkResult of that reponse to a Flow that is consumed somewhere in the ViewModel. 
So let's create a nice ApolloCall extension function to give us the mentioned Flow.&nbsp;
 
<div style="text-align:left;"><img src="https://storage.googleapis.com/qusion-cms-development/ck3u4vr9r00080os68nbf68pa.png" alt="" style="height: ;width: "/></div>
The `flow` keyword creates a Flow (who would've guessed right?) and allows us to emit values inside the builder block function. That's where we enqueue an ApolloCallback with out Channel, i.e. the ChannelCallback class, which has a very strightforward implementation. (forwarded straight from apollo's source code).
 
<img src="https://storage.googleapis.com/qusion-cms-development/ck3u4x1r300090os6cygmeeit.png" alt="" style="height: ;width: "/>
So now our ApolloService implementation is very clean. We changed the return type to Flow and called the created extension function.
 
<img src="https://storage.googleapis.com/qusion-cms-development/ck3u4xe7a000a0os66hbzd0kg.png" alt="" style="height: ;width: "/>
 
The way to consume it near the UI is still in a ViewModel, using a liveData builder. That way when the live data becomes active we create the coroutine and enqueue the call, thus we start recieveing values to our exposed Flow.&nbsp;
 
<img src="https://storage.googleapis.com/qusion-cms-development/ck3u4yhsl000b0os6ay4w2hvq.png" alt="" style="height: ;width: "/>
 
<h2>Final Notes</h2>
 
I know that the code snippets require some prior knowledge of Apollo and Coroutines to fully unpack every bit. But the goal of this article is to show (or "expose") a way to nicely use Apollo in conjunction with Kotlin coroutines. It's a single idea, a way of thinking and approaching Apollo, that I hope will be useful to the readers. I hope it inspires better and more fleshed out solutions!
 
I also talked in depth about this recently in a Kotlin/Everywhere event. There will be public recording soon (I hope), which I will link here.&nbsp;

Kotlin in Consuming GraphQL on Android (Part 1)

Web Summit is the biggest technology conference in the world held in Lisbon, Portugal and every year it brings together some of the best people from different business and tech areas. Our team couldn't miss the opportunity to come there too and to breathe in some inspiration from leads of the most successful companies in the world. By the way, did you know that Web Summit was originally held in Dublin, Ireland until 2016 before it was permanently moved to the capital of Portugal.

Qusion at Web Summit 2019

Web Summit is the biggest technology conference in the world held in Lisbon, Portugal and every year it brings together some of the best people from different business and tech areas. Our team couldn't miss the opportunity to come there too and to breathe in some inspiration from leads of the most successful companies in the world. By the way, did you know that Web Summit was originally held in Dublin, Ireland until 2016 before it was permanently moved to the capital of Portugal.
 

The main reason we decided to come was mainly to inspire ourselves but also for networking and creating new opportunities and clients. During our 5-day stay, we had many important meetings one of which was also the one with European Commissioner Věra Jourová. It was a huge pleasure and a great experience to meet her in person so we took a chance and asked her many questions about the current situation of startups in the EU and her opinion about their future. Apart from that we also had a chance to visit the Czech embassy in Portugal where we could pitch Qusion along with other Czech startups and tell others about our work and upcoming plans.&nbsp;
 

<h2>Top leads of well-known companies</h2>
Web Summit always presents many leads to some of the most famous companies in the world. This year visitors had a chance to hear many inspirational talks, one of which was the one from CTO of Amazon Werner Vogels or Revolut CEO Nikolay Storonsky. And it wasn't only about male leads this year, we also heard many female leaders talking. The top one for me was an interview with Kate Brandt from Google about how important is the role of every stakeholder in building a more sustainable world. 

<h2>My key takeaways?&nbsp;</h2>
One of the things I had a chance to experience at this year's Web Summit is definitely the fact that if you're starting your own company, this is an amazing opportunity for you to find an investor to start with. Also, I must say that in my opinion, the conference is much more business-oriented than I expected. If I was to advise to anybody from the tech field planning to go there, it may not be the right thing for you. I would recommend it mainly for people interested in business.&nbsp;
 

<figure><img src="https://storage.googleapis.com/qusion-cms-development/ck3k7dxxq00080os6f2hx3n9i.jpeg" alt="" height="100%" width="100%">&nbsp;</img>&nbsp;</figure>
 
Otherwise it is by all means a very important way to meet new interesting people and a great opportunity to start your new project and find the right people who'll help you.&nbsp;
I must also mention huge Web Summit parties following every day full of truly inspirational keynote speakers which is a great networking opportunity. The parties are well-known thanks to the fact that they take place in different parts of the city each day and also in different streets. Every night there's a street full of bars and clubs open for Web Summit visitors where they can have a good drink and network with others. 

<figure><img src="https://storage.googleapis.com/qusion-cms-development/ck3k7eetp00090os63eyd92tp.jpeg" alt="" height="100%" width="100%">&nbsp;</img>&nbsp;</figure>

This week we organized a development-oriented event called KOTLIN/Everywhere which has been happening in many cities all over the world this year. It was created especially for purposes of enriching the comunity of developers in one city so they can help each other to share their experience working with this favourite Android programming language. This event can visit anybody and it helps them to learn both the essentials and best practices and tricks of Kotlin and multi-platform development. 

We organized KOTLIN/Everywhere in Prague

This week we organized a development-oriented event called KOTLIN/Everywhere which has been happening in many cities all over the world this year. It was created especially for purposes of enriching the community of developers in one city so they can help each other to share their experience working with this favorite Android programming language. This event can visit anybody and it helps them to learn both the essentials and best practices and tricks of Kotlin and multi-platform development. &nbsp;
 

Since one of our goals is also to bring together a community of skilled people and help them be even better at what they do, we decided to organize this event on our own. So we brought it to the capital of the Czech Republic, Prague. The happening was at Prague Startup Market in Holešovice where many other educational events take place every month and we picked a space that seemed to be perfect for our needs.
 

<figure><img src="https://storage.googleapis.com/qusion-cms-development/ck3k7x62t000d0os61hw9aums.jpeg" alt="" height="100%" width="100%">&nbsp;</img>&nbsp;</figure>
We wanted the event to be quite small so there is enough space and time for everybody to join and ask any questions rather than making a conference-like happening. We tried our best to make the event as good as possible so we invited three amazing speakers with years of experience working with Kotlin who shared some of their best practices and tips with the audience. First, we heard an interesting talk from Miki Mitevski, Qusion Android developer who decided to tell the audience about Kotlin in consuming GraphQL on Android.
&nbsp; 

<figure><img src="https://storage.googleapis.com/qusion-cms-development/ck3k6qt0900040os6bsc2h3fw.jpeg" alt="" height="100%" width="100%">&nbsp;</img>&nbsp;</figure>
The second speaker was a software engineer from Czech startup Supernova, Artem Ufimtcev. He was talking about Creating cross-platform apps with Supernova and Kotlin. Last but not least Vladimir Valouch, a principal software engineer at SAP Concur gave a speech about his own experience with Kotlin and he decided to compare it with other tools he had a chance to try.
 

<figure><img src="https://storage.googleapis.com/qusion-cms-development/ck3k7zo8g000e0os64xx75wnf.jpeg" alt="" height="100%" width="100%">&nbsp;</img>&nbsp;</figure>
We are grateful for such a great Prague community and its members who decided to come to our event and learn some new skills they may have not even known. Thank you to everybody who decided to spend an evening with us and we hope we’ll see you soon at another event we are going to organize. Which will be really soon!&nbsp;

Today’s development and design markets are very rich in toolkits. In this article we talk about why in Qusion we switched from Sketch to Figma recently. 

Why we switched from Sketch to Figma

Today’s development and design markets are very rich in toolkits. In this article, I would like to briefly introduce you to the differences and similarities of the two most popular tools right now, Sketch and Figma and explain why in Qusion we switched to Figma.&nbsp;
<h2 style="text-align: justify">Uncertain prospects for Sketch&nbsp;</h2>
As for Sketch, we can definitely mention how it revolutionized how we do UI design, however, it is Figma which, by being free and platform-agnostic, occupies a more significant part of the market now. On the other hand, Sketch’s huge advantage is the possibility to work offline, without being forced to be connected to the internet. (Figma can do it too but you have to open the file beforehand which can be a burden for some people). It is way more comfortable and acceptable especially for digital nomads, freelancers, and frequent travelers. Until recently, the biggest plus of Sketch was the vast range of third-party plugins but Figma drew level with it by coming up with a huge update several months ago. The update enables the use of plugins built by Figma community accessible for everyone. Besides, you can also build your own plugins tailored to the workflow.
 

<figure><img src="https://storage.googleapis.com/qusion-cms-development/ck2g4e9f4000a0os61b8k4at1.jpeg" alt="" height="100%" width="100%">&nbsp;</img>&nbsp;</figure>
<h2>Figma = New market leader? &nbsp;</h2>
Concerning Figma, probably the most noteworthy feature of all is a collaborative real-time design tool that puts emphasis on an easier and better way to design straight from the beginning up to the successful end. The tool simplifies communication and collaboration throughout software development. In practice, it means no more need to communicate edits back-and-forth together with the end of files reforwarding between designers themselves and other parties involved such as product people, clients or devs. Also giving feedback and leaving comments amongst all the parties involved is as simple and fast as never before. &nbsp;
 

You also do not have to install the app if you want a user to see your design. In order to see the relevant project immediately, you just need to share a link (browser-based idea). Figma is the first who brings all-in-one — designing, prototyping, communicating with devs, getting the design assets, etc. Moreover, the tool, without any doubt, appeals to users because of its free pricing plan for an indefinite period of time, including the possibility of creating teams up to 2 users. And another important point, you don't have to buy laptops with macOS since the tool is platform-agnostic, available for every device.&nbsp;
 

<figure><img src="https://storage.googleapis.com/qusion-cms-development/ck2g85fq600080os6hmap7po0.jpeg" alt="" height="100%" width="100%">&nbsp;</img>&nbsp;</figure>
<h2>Smart Animate: A bull’s eye&nbsp;</h2>
Another feature worth noticing is Smart Animate. It was launched quite recently and designers expect nothing but better performance and new transition possibilities in the tool. If everything goes well, it definitely has the potential to beat another design competitor Principle (for more info click <a target="" href="https://www.figma.com/blog/announcing-smart-animate-and-advanced-transitions/">HERE</a>). Figma is a type of community whose tech support is fast, creative and always in time. Besides, its developers provide great updates. If you opt for this tool, you will not make a mistake at any cost. &nbsp;
<h2 style="text-align: justify">Head-to-head&nbsp;</h2>
To compare the 2 tools above-mentioned, both of them are vector-based. They have endless canvas and their interface is quite similar, more or less the same. It means that if you are planning to switch from one to another, you will not get in trouble with new shortcuts or flows. If you intend to use the tool as a team, Figma seems to fit better your needs. For an individual, both possibilities are convenient and except for a few things they are very similar. Using Sketch could be considered as a step back if you want to keep up with the times. Nevertheless, when you have a knack for developing and designing the apps or websites, you can master any of the available tools without the merest problem. And who knows what the future holds. &nbsp;&nbsp;

Why we switched from Sketch to Figma 

Come to next Qusion event: KOTLIN/Everywhere Prague

Since the modern world is working very fast and the trends in every area tend to be really progressive, sometimes we find ourselves stuck in the field we mainly focus on. When it comes to product development, it is one of the fastest forward-moving areas of all. 
 
That is the main reason why many companies, communities and also individuals trying to bring new inspiration and ideas for the tools people working in development need. And that is also the reason why KOTLIN/Everywhere was originally created by Google. Thanks to this event anyone can come and learn both the essentials and best practices of Kotlin in Android and multi-platform development. KOTLIN/Everywhere is taking place all around the world. And we decided to bring it to Prague. 

<figure><img src="https://storage.googleapis.com/qusion-cms-development/ck2xbxs3e00000os659qvhz8p.png" alt="" height="100%" width="100%">&nbsp;</img>&nbsp;</figure>
<h2>Different ways to use Kotlin&nbsp;</h2>
Since we want the tech community to grow and we aspire to connect the people from the same area of interest, we are organizing our very own event in the beautiful capital city. Come and listen to three amazing speakers with years of experience working with Kotlin programming language and learn how to boost your productivity while using it. You'll enjoy a talk from our amazing Android developer Miki Mitevski who will tell you about Kotlin in consuming GraphQL on Android and how he uses it in Qusion. We are also pleased to welcome two external speakers. One of them is Artem Ufimtcev, Android lead from Czech startup Supernova who will talk about creating cross-platform apps with Supernova and Kotlin. Third speaker, Vladimir Valouch, will talk about using Kotlin in Czech company SAP which provides travel and expense management services to businesses.&nbsp;
 

Does it sound interesting to you? We'll be happy to see you on the 26th of November in Prague Startup Market located in Holešovice. You can get your free tickets <a target="_self" href="https://www.eventbrite.com/e/77802171389">HERE</a> or see who else is coming in the <a target="_self" href="https://www.facebook.com/events/2831800773546046/">Facebook event</a>. Except for great talks, there will also be some snacks and drinks for the whole evening.&nbsp;

Sometimes you just feel like giving the users of your product something extra. This was the case with letting the users know about the current name day. Unfortunately, there are not many public APIs that would provide the desired functionality, even less with the support of your country. Luckily though, there is a guy named Vojtěch Nekvapil who had also felt that this API is missing and so he built one.

How I built my first NPM package

Sometimes you just feel like giving the users of your product something extra. This was the case with letting the users know about the current name day. Unfortunately, there are not many public APIs that would provide the desired functionality, even less with the support of your country. Luckily though, there is a guy named Vojtěch Nekvapil who had also felt that this API is missing and so he built one. It is called International nameday API and it’s available <a target="_blank" href="https://api.abalin.net/documentation">here</a>.
 

I used his API in my code and it worked perfectly. Another day, as it happens in programming, there was an issue indirectly related to the nameday API. I felt helpless that day so I tried to contact Vojtěch. To my surprise, he replied within hours and we started to talk (in the meantime, I fixed the issue on my own). A bit later, he asked me to build a wrapper written in JavaScript around his API to make it easier to use for JavaScript developers as he was a PHP developer and had no or little knowledge of JavaScript.&nbsp;
 

<figure><img src="https://storage.googleapis.com/qusion-cms-development/ck2j05val00010os6hzl4dvxu.png" alt="" height="100%" width="100%">&nbsp;</img>&nbsp;</figure>
Up until then, I’ve never built any JavaScript library nor written any other open-source software and I thought of this to be a good opportunity to enter the open-source world because the library didn’t seem that difficult to build. I started by learning how to build an NPM package as this is the biggest code package ecosystem in the world. Since the beginning, I also wanted to incorporate TypeScript support because I know how much it helps developers to use a third-party library.&nbsp;
 

<figure><img src="https://storage.googleapis.com/qusion-cms-development/ck2j0a90800020os60hhy70iq.jpeg" alt="" height="100%" width="100%">&nbsp;</img>&nbsp;</figure>
In essence, I created some methods that internally call the nameday API and then return the results to developers directly. It saves developers some writing because they don’t need to manually fetch data from different endpoints anymore. 

The documentation of how to use the library is available <a target="_blank" href="https://www.npmjs.com/package/nameday-api">here</a>. Contributing to the open source is only beneficial. You can be listed as a <a target="_blank" href="https://api.abalin.net/libraries">contributor like so</a> and you get to write articles like this. Highly recommended!

The design thinking and mission never ends with the delivery of our products or with writing it into our brand book. The aim of Qusion lab is to go further and not only inside the company. We want to offer something much more to both the digital and design world. 

Czech Creative Review Night/Prague

The design thinking and mission never ends with the delivery of our products or with writing it into our brand book. The aim of Qusion lab is to go further and not only inside the company. We want to offer something much more to both the digital and design world.&nbsp;
 

The initial idea to create something extra came up one day during late-night chatting in the office after a long working day. We came to the conclusion that we wanted to talk about design with others and create something for the community of people who think and live the same way as we do so it brings them together. In the end, the outcome was absolutely clear - we were going to organize a dedicated design event.&nbsp;
 
<figure><img src="https://storage.googleapis.com/qusion-cms-development/ck2kf6mnf00080os64oww67f5.jpeg" alt="" height="100%" width="100%">&nbsp;</img>&nbsp;</figure>
<h2>Inspiration and networking</h2>
So we could bring even more ideas and experience to the community we decided to connect with a Czech design studio <a target="_self" href="https://sdmk.design/">SDMK Design</a>. A few weeks later everything was set up and we could finally share the very first Czech Creative Review Night with others. The event took place in an amazing coworking house <a target="_self" href="https://opero.cz/cs">Opero</a> in the Prague city center which is perfectly suited for this kind of event. The event wouldn't end up so well without three awesome speakers who helped us to create an enriching evening for everyone attending. Thanks to many years of their experience in the design area they were able to share some very interesting ideas.&nbsp;
 
<figure><img src="https://storage.googleapis.com/qusion-cms-development/ck2k8eu0v00050os6eyorgski.jpeg" alt="" height="100%" width="100%">&nbsp;</img>&nbsp;</figure>
<h2>Design, architecture and visual effects</h2>
The first speaker was <a target="_self" href="https://www.youtube.com/watch?v=k2YoboaF-Pg">Luboš Volkov</a> who spoke about his career path in digital design from the very beginning. Although it was a long journey, today he crafts designs for different companies from all over the world.&nbsp;
After the story about digital design, we moved to something more related to everyday life - architecture. This topic was presented by Ondřej Chybík, a co-founder of the architecture design studio <a target="_self" href="https://www.youtube.com/watch?v=gu8OzVVttF0">CHYBIK+KRISTOF</a> which can now be proud of many prizes and certificates in this area.&nbsp;
 
<figure><img src="https://storage.googleapis.com/qusion-cms-development/ck2g7vywp00020os67gy74ebp.jpeg" alt="" height="100%" width="100%">&nbsp;</img>&nbsp;</figure>
 
Finally we moved to the US for a bit with <a target="_self" href="https://www.youtube.com/watch?v=ZQWjFHfpSbc">Pavel Kacerle </a>who spoke about his amazing career in the creative field while working for giant movie studios like Marvel, Lucasfilm or Disney. Pavel has already tried several areas in both the digital and design world. Through creating visual effects for Hollywood he recently decided to found his own start-up Live Penalty connecting the digital and real world together.&nbsp;
 
<figure><img src="https://storage.googleapis.com/qusion-cms-development/ck2j1rb6g00070os60v0keuee.jpeg" alt="" height="100%" width="100%">&nbsp;</img>&nbsp;</figure>
<h2>Another event coming up!&nbsp;</h2>
Thanks to the fact that the last event was a great success we knew it wasn't going to be the last one. Currently, we are working on plans for another Czech Creative Review Night which will take place already in December. Save the date for the next evening full of design and inspiration - 11/12/2019 and check out soon where in Prague we're going to meet this time.&nbsp;