FreeAgent’s talented mobile app engineers work within their own specialised technology stack. Unlike the developers for the desktop version of FreeAgent, we don’t use HTML, JavaScript, or Ruby. Instead, we work with Kotlin for Android development, and Swift for iOS. The FreeAgent mobile app developers work to keep feature parity with the desktop version, whilst juggling unique mobile-specific considerations. These considerations are vital to empowering mobile customers and their businesses. As such, our apps go through constant improvements; developers aren’t just making improvements to the code itself, but also how the code is written in the first place. Transitioning from the old Extensible Markup Language (XML) approach towards Android’s Jetpack Compose is one of the most impactful upgrades you can make to your Android development. During my summer internship, I worked with the Android developers where my user interface (UI) coding skills were completely revamped by mastering Jetpack Compose!

The OG – XML

Before I started my FreeAgent internship, I already had some Android development experience under my belt. This was by no means a thorough foundation, but more of a DIY, self-taught introduction to Kotlin and using XML for UI design. This crude foundation in Kotlin did thankfully relieve some of my pre-internship nerves.

In my previous experience with Android development, I was using Android’s XML vocabulary to design Android UI pages in the same way as you would design regular web pages. XML is very human readable and has been the established choice for Android developers for many years. As a result, some developers are just far more comfortable writing in XML, and the comfort of the team may come as a top priority in making your development practices successful.

While XML layouts excel in separating functional logic from presentation, there are some unfortunate drawbacks. XML adopts an imperative approach where layouts are static, meaning there’s a greater degree of control over fine details, but there won’t be a clean way to reuse components you’ve already built. Building up a library of reusable common components not only improves the efficiency of writing code, but also reduces opportunity for errors. The quirks of an imperative approach are only exacerbated when working with complex projects because of the sheer volume of XML code. XML code can be much too verbose particularly when you’re trying to build both a stylish and functional UI layout. These are issues our Android developers are currently phasing out in favour of a better approach with Jetpack Compose.

The new(-ish) kid on the block

Android’s Jetpack Compose is a new(-ish, stable release debuted 2021) toolkit for constructing native UI. I started my internship with no Jetpack Compose experience and so learned it on the job. Luckily for me, there isn’t much of a change in thinking at all. Instead of writing in XML, we just write in Kotlin! Jetpack Compose is a declarative Application Programming Interface (API) where we focus on what we want the UI to look like, rather than how we are going to get there. Jetpack Compose can then condense numerous XML files into a single Kotlin file. By taking advantage of Kotlin syntax and not having to deal with XML files, our code is more succinct and easier to maintain.

Compose has the flexibility to use small stateless components that aren’t tied to any specific fragment, where states are passed directly into the composable itself. This separation allows us to reuse composables across entire projects and potentially across platforms. I can’t overstate how much I love these reusable and reactive composables!

But perhaps the most useful feature is that Compose and XML can be used in tandem. This is great for older XML projects because you can safely integrate composables without having to overhaul the entire thing. While the process of transitioning a fully XML project into Compose may take some time, it is fully doable with a gradual approach. This compatibility should remove any worries you may have about first learning Compose. It’s super easy to play around with smaller sections of your app and see how they could be created with Jetpack Compose.

Give it a go

Learning the tricks of Jetpack Compose has done wonders for my Android development. I find it much easier and more satisfying to create UI now. Spending this time with Kotlin and Jetpack Compose has given me greater insight to modern app design and a genuine curiosity towards learning how some of my favourite apps work. If you are even mildly interested in Android development, jump right into Android’s Jetpack Compose. My personal journey learning Compose has been a joy under the direction of the experienced FreeAgent engineers. Fortunately there are tons of super helpful tutorials online for even the most “simple” of UI setups. There’s no reason not to give it a go!