How I Build a Powerful Gym Notes App Using React Native: A Developer Story

I have created the best workout note-taking app for the gym, and yes, with React Native, and it's not a joke.

I belong to the new generation of app creators, those who don't have to reflect their learning in Java. I consider myself part of a purely conventional new generation since I don't have a computer science degree, and I don't have any Java courses. However, I have been able to create a practical application to record your workouts without it falling apart. On the contrary, it's quite useful and practical.

I chose React Native simply for its convenience, its small learning curve, compatibility with IOS and Android with a single code, and because of its great popularity.

Why use React Native for a workout notes app? React JS is the reason, we're talking about a much simpler and automatic JavaScript. It's a joy to create variables that can update their value with just one action, without having to create other variables or create code that is more than one line long. To create a workout app, the most important thing will be to update values to show our progress, save it, and move it between pages. With React Native, all of this is a simple task that anyone without knowledge could do in just 3 months.

Key features of the GymNote app

You may be thinking of creating your workout note-taking app as a first project or perhaps out of a desire. In my case, my app GymNotes was not my first project; it was the second, so I already had more or less control over the frontend, the problem was the backend, which is something entirely new.

Whenever you want to create an app, there will be a kind of skeleton that every app must have, but each application has different code. It's clear that in some cases, we can reuse code. I wish it were always like this! But normally, it will be new code that will imply learning, failing, and executing.

I want to share from my humble experience as the sole developer of my workout notes app the challenges I had to face to have a fully functional app:

Save the data of weights, repetitions, exercises, and texts in a customized way.

How do we access each object of a list of workouts without the data being the same? It's not that simple at first, our goal with Asyncstorage will be to generate a string with special variables of the object itself. That is, if the object is located at index 0, has specific text and an image, we can use these variables to generate a unique string that will access the data in a customized way.

For example: "0InclinedPress9", now every time you access this page or container, it will always have personalized data and not generic data. This way, we achieve that the user has total freedom when creating a page with their training, and this training can only be accessed through the personalized string, "0InclinedPress9". Similarly, this is not a simple task of 3 variables, on other occasions, we will need to create more, and sometimes errors will arise. The important thing is to think about creating a network that connects everything without failures.

What if the user has the option to delete the container? Only by deleting the container, in addition to that, we should delete the container that stores the data, easy.

With everything explained, we can save routines, exercises, weights, repetitions, and everything that constitutes a personalized and attractive training log for users in our training app.

GymNotes Track Workouts

Using Data in Routes for App Functionality

In my workout notes app, I have some automatic functionalities such as weekly and daily missions that require:

  • Moving data between pages.

  • Resetting the value of variables according to the day or week.

These two properties require a basic to intermediate knowledge of using React Native and imagining a logic to make everything work without crashing.

In addition, when we move data, the performance of our app decreases, so it's best to minimize the transfer of variables between pages or components.

When it comes to saving and deleting any kind of information, it's important to ask yourself whether you need to update the information on a specific page or on the page where the code resides. I won't get too technical with this topic.

For example, the Home page is the ideal place to reset all values since it is the most essential page for users to access other pages. If we've already updated the values through the Home page, we don't need to do it on other pages.

More specifically, I'm talking about my daily and weekly missions functionality. The app resets the variables every time you open it on the Home page, so if you want to go to the page where you can see your missions, there won't be a re-render or an update of the values. This tip will be very useful to you.

Benefits of Using My GymNotes App

Since I know you're interested in the topic of workout notes applications, I'm aware of an app that is particularly good - mine! (Let's not pretend that nobody downloads my app).

If you want an app that will reduce the time it takes to write down your workout information in a notebook or a simple notes app, GymNotes can offer you that and much more.

My workout notes app is not your average app of this kind - it has a competitive mode in which you can earn points by completing missions that support your workout routine (we're working on how to do this according to the type of training you do).

I want to enhance the entertainment aspect of working out - stop going to the gym out of habit. GymNotes gives you a reality check and offers you challenging goals because we don't come to the gym to take it easy.

GymNotes aims to be your essential pocket app for the gym, which is why it has these great features that we'll separate into basic features and GymNotes features:

Basic Features of My Workout Notes App:

  • Customizable tracking of weight, repetitions, one-rep max, sets, and routines.

  • Routine planning based on the day of the week, with scheduled rest days.

  • Data analysis and tracking (currently in progress).

  • Cloud saving and data export to Excel (future update).

GymNotes Properties, Enhance Your Workouts:

  • Daily and Weekly Missions with a competitive point system, train better than your friends and show them who's boss.

  • Share your workout logs, with the message customized based on how you performed that day, so it's never the same.

These are just a few of the GymNotes properties, but I promise you that there are many great ideas in store. Stay tuned for some exciting innovations in the workout notes app market. To learn more and check out the app, visit the GymNotes Google Play page.

This is the story of my journey as a React Native developer, and my passion project GymNotes (I only have two projects, after all!). I hope you enjoyed reading this article, and if you share the same goal as me, then I'm confident that you'll find it useful. Perhaps it's not a good idea to share knowledge with competitors, but I believe the workout notes app market is in dire need of a refresh. Maybe you and I can be the ones to lead the way.

By the way, I'm currently looking for a team of non-professional developers who enjoy programming as a hobby and are interested in creating innovative projects. If you want to join me (it's just me for now, but we can be more!), please contact me at: imadiorapo@gmail.com