NPVB app on a smartphone

When you are a member of a sport club or an association, you take advantage of it to practice your favorite sport or hobby. But sometimes, you like so much your club that you want to get more implicated in its life and bring something to your community. So I decided to use some of my professional skills and work on our internal mobile applications.

Technologies:
Cross-Platform, iOS, Android,
React Native, TypeScript/JavaScript,
Objective-C, Swift,
PHP, SQL Services: Code Porting,
Code Refactoring,
Cross-Platform App Development, Bug Fixing,
Backend Updates

Quick Story

Nantes Plaisir du Volley-Ball is a sport club which is now 20 years old. Founded by a few dynamic members, it has nowadays more than 120 members who are enjoying playing volley-ball together and in local championships. Despite of being a competitive club with teams playing in a wide range of categories, one of its motto is about friendliness and most of the members are spending as much time outside playgrounds having drinks as practicing and competing together. That makes that club locally famous and attracts dozens of new candidates every year.

But managing such a big number of players, a dozen of teams, three different gymnasiums, scheduling practices, matches or club events is complicated. That is why some members created a website and two native apps in the past to let people browsing the events calendars and registering for our number-limited training sessions or matches.

The Project

Sometimes, it could be handy to avoid starting from scratch! What is great is that the club had already something that worked well and used weekly by a significant number of users. That is a great start!

The existing technologies

Previous native apps

Each mobile app has been created some years ago by a unique developer in the dedicated native technology. The iOS one was coded in Objective-C and the code versioned. But the person who made the Android one left the club and we lost the whole source code and credentials.

The database is a common one used by both the website and the apps with a different access strategy. Whereas the Android app was directly querying it through SQL, the iOS app was using a simple PHP backend to forward all the requests to the hosted database.

Over the years, the iOS developer kept on doing some little maintenance on the app to allow it running on modern phones but the Android app had to be removed from the store when Google started requiring some code changes to comply with its new rules.

The new architecture decision

Going cross-platform sounds like an evidence to me. That means that, instead of having to maintain two different native apps, we could get the benefit of a single source code and having the same app running in both Android and iOS platform at a time. Every bug fix or new feature would then automatically be applied to both versions. Easier to maintain, not to code!

At that time, I was benchmarking the most recent cross-platform technologies and two players were standing out of the crowd : React Native and Flutter. React Native, created by Facebook, was Javascript-based and widely used in the app development field. Flutter, created by Google, was quite new and introducing a new immature programming language named Dart. Taking advantage of one of my previous experience with another project, I decided to use React Native and its TypeScript programming language (type-safe Javascript) as the architecture stack.

I also decided to start with a strict code porting of the existing iOS app to the new technologies because we didn’t have any UI/UX designer in the club and most of the people were already happy with the existing app. Once done, it would be easier to modify/add new features by taking the best of the old Android app too and collect the members needs and wishes.

Let’s do it!

The first part of the project was to setup the common productivity tools like code versioning, test environment, app architecture. Then the code porting started, screen by screen, class by class. After the first pass, my main concern has been to fix the small bugs I found by reading the code and to refactor the parts where I found redundancy or ways to optimize the performance.

From then, I was satisfied that the app was working well but nothing was noticeable from a user point-of-view as they had the same visual aspect and features as the old iOS app! So it was time to bring some novelties and I began adding new cool features in the app and sharing the first beta versions with my club buddies to get their first bug reports or feature requests. I also had to update a bit the backend PHP code in order to implement them without ever changing the database schema to maintain the compatibility with our old website.

In the mean time, without any sport activity since a year because of the pandemic, the club organized a creativity contest and decided to update its logo and main colors. That was the best opportunity for me to apply this new style to the apps and give them a new look.

After a couple of test versions, I spent some time configuring everything in the Google Play Store and the Apple App Store and got the apps reviewed and approved by both Google and Apple. And the final recent step has been to push the red button and then releasing the apps publicly.

I am looking forward to read the first reviews of my club mates and probably implement some cool new features in the future. Proud of my small contribution to Nantes Plaisir du Volley-Ball!

Nantes Plaisir du Volley-Ball
Nantes Plaisir du Volley-Ball
www.nantespvb.free.fr