Under the Hood: Developing an Adventure Tracking App

If you haven’t already seen it, take a quick look at my previous post before jumping into this one. It introduces the blog series and tells some of the Pebbls origin story.

The draft of that post was much longer – it explored some technical details behind the app development process. Believe it or not, some people (like me), are interested in that kind of thing. However, I was advised by a couple of my trusty beta-testers that, despite having a fancy ‘Can You Read Geek‘ toggle that hid most of the technical content, if you’re not that way inclined it might be a bit too much 😲.

What you are about to read is an article about some of the technical development of the Pebbls journey tracking app. If you’re interested in technical talk, or if you aren’t but are having difficulty sleeping, read on – otherwise, it’s ok, you can skip this one – I’ll catch you next time with some tips on preparing for your next adventure.

If you’re really sure that you want to carry on I just need to check that you’ve definitely read the previous post? It will really help to make sense of the timeline.

The Evolution of the Pebbls Tracking App

At this point in the story it’s July 2017. There are only a few days before I head off on a 3 month cycle adventure through France and Spain, and a few less days until I get married.

As a self-taught freelance full-stack web developer, my background was mainly in designing and deploying database driven web applications. Mobile app development, however, was a different ball game. With time ticking and an extensive list of pre-trip to-dos (including ‘get married’), there wasn’t enough time for any upskilling.

Instead, I cobbled together a hybrid solution – it was a bit of a Rube Goldberg-esque setup with a third-party app running in the background to collect GPS data of the route and a basic PHP & JavaScript interface for creating the Pebbls (the location pins) and syncing the data online. This interface was being run on a web server on my Android phone.

The user experience was far from ideal. But what can you expect from something built in less than a couple of hours? Since I was the only one who needed to interact with that part of this makeshift system, I didn’t mind the rough edges. It was a bit clunky but it got the job done.

At this point in my post I’d like to be able to show you some rough-and-ready screenshots of the route in the original Pebbls web interface – clunky, non-responsive, and without lazy-loading – along with an embedded map showcasing that inaugural journey. After all, this was the genesis of Pebbls, the moment our honeymoon adventure was immortalized. I can’t though. The irony is that after countless iterations and code re-writes, the data from that journey, the one that Pebbls was created for, has become unreadable by the system. Even worse, it seems to have vanished into the digital ether. I’m fairly certain the data still exists, buried within terabytes of other data, on an unknown backup somewhere. A project for future me to look forward to.

In the few years between then and now I have developed something of an obsession (70+hrs /wk) for growing Pebbls from that makeshift, barely functional prototype into a robust platform for sharing adventure stories, being inspired, and making connections. The first thing I focussed on after returning from Gibraltar (I warned you, you need to have read the previous post) was getting to grips with mobile app development.

Choosing a Mobile App Framework

Given my background in web development and the fact that this is a solo project, I was really keen to find a coding framework that would make use of my existing skills. It was also important for me to be able to maintain a single codebase for both iOS and Android versions of the app. I explored a few options and then initially settled on Cordova. Cordova seemed like a pretty straightforward approach and its use of HTML, CSS, and JavaScript meant that we were largely speaking the same language. At the time this seemed like the most comfortable starting point for me. I spent some time familiarising myself with the nuts and bolts and using the ‘university of YouTube’ to get me up to speed. After a few weeks I had created the first standalone test version of the Pebbls tracking app. As a proof of concept it was a huge milestone.

Although the interface I had created using Cordova was ugly, I was finally able to begin some real world testing. However, it didn’t take long for me to realize that the same aspects which initially drew me to Cordova were also its Achilles’ heel. Cordova seemed to be ok for creating an app using actual HTML/JavaScript which could be wrapped in a container and deployed to mobile devices, but achieving true native functionality was another story. It felt disjointed and limiting, especially for features I considered non-negotiable: background location, running regular background tasks, filesystem interaction, among others. I can’t recall the specific issues now, but I decided to cut my losses and start again. I went through this same process with four frameworks in all; Cordova, Flutter, Ionic, and then React Native.

Selecting the right framework turned into a slow and frustrating process. I created some semblance of a tracking app prototype in each one. This took a lot of time (a couple of months) but in the end it paid off and making the final decision was really easy – the clear winner for me was React Native (with Expo and EAS) – I haven’t looked back.

React Native really stood out to me – not just as a capable modern framework, but also because of the energy and buzz surrounding it. There’s a very active community of developers, maintainers and module creators and the documentation and tutorials are extensive. The commitment to evolving the platform and seeing features that I was looking for being actively developed and implemented so quickly was very reassuring. I wasn’t disappointed.

Pebbls Tracking App Progression

Using React Native and the Expo managed workflow with EAS as a solo developer has been a game changer – now that I’ve got the hang of it I can develop and deploy with far fewer headaches. Moving away from a HTML and CSS based system, such as Cordova, to the React framework was not actually very painful. Even more impressive is how the EAS build pipeline effortlessly handles complex tasks like certificates and key signing that can otherwise consume hours of time when carried out manually by mere mortal developers such as myself who don’t do that kind of thing on a daily basis. On top of all of that one of the biggest advantages for me is how easy it is to spot bugs (using tools such as Logrocket), implement fixes, and roll out over-the-air updates to users. I can complete these updates in just a matter of minutes, from receiving a bug report to deploying the fix to user devices.

Testing, Testing, Testing

The journey of creating any software involves a rigorous testing program. The more scenarios we can explore, the better equipped we are to ensure a smooth user experience and the lower the chance of users stumbling across bugs in the wild. While simulators and location spoofing tools serve their purpose, there comes a point where you need to be brave, open the door, go outside, remind your body all about vitamin D, and do some testing in the big wide world. As the first fully functional version of the Pebbls tracking app approached readiness, I found myself carrying 2 or 3 devices wherever I went. These devices were tracking my every move and reporting it all back to the Pebbls server. Upon returning home, I had a treasure trove of data to delve into. This process was invaluable for identifying and eliminating bugs, as well as enhancing performance.

Testing the Pebbls Tracking App on the Road

The next stage of testing was to take the app out on another real-world adventure. There were already a few beta testers out and about doing just that but it was important for me to do this too – allowing me to experience the best and worst bits of the app for myself. So, after a Covid delay (see previous post) that’s exactly what I did. Lucy and I spent 6 months cycling across Europe and Turkey to Georgia. We tracked our route the entire way, stopping periodically, often on the side of a mountain or craggy shore, to fix bugs and to continue developing features. This real world test was crucial – it allowed me to gain insights into how the app would handle under various GPS and network conditions. This experience became an integral part of the app’s development, making it more robust and reliable for fellow adventurers.

Listening to User Feedback and Continuous Improvement

Pebbls isn’t just about tracking your journey, it’s about telling real stories and being inspired – it’s about the community of adventurers and explorers that use the platform. I actively reach out to users for feedback and comments on their experience. These insights and suggestions play a crucial role in shaping the app’s features and functionality. Many of the enhancements found in Pebbls today were born from user suggestions – integrating GPX and Strava support, adding new Pebbls icons, improving the user interface, or enhancing performance – your feedback is the driving force behind this continuous evolution. I regularly release updates based on your suggestions, ensuring that Pebbls grows to meet the needs of adventurers like you.

Get In Touch

Ready to shape the future of Pebbls? I would love to hear from you. Share your adventures, ideas, and feedback via the contact page or [email protected]