Weight tracking mobile app

user profile photouser profile photouser profile photo130 developers have joined this project.

What you will practice

You’ll practice building data visualization UI and data structure for CRUD operations for an entity.

Introduction

You'll be creating a mobile app for users to track and monitor their weight. By building an offline supported weight tracking app, you will learn how to build an offline supported mobile app with React Native, how to structure data for a real-life entity, and how to perform CRUD operations for your data.

Requirements

  • Allow the user to record their weight as a number and select a specific date and time for the weight entry.
  • Save stored data on user's device. The data should be available without an Internet connection.
  • Display the recorded weights on a graph of your choice instead of showing it in traditional text based list items.

For an extra challenge

  • Allow the user to export their data to csv format and import it back.
  • Allow the user to schedule periodic reminder notifications to log their weight (i.e. every day at 8pm).
  • Allow the user to filter the data to a specific date range to see their weight gain/loss over a specific period (e.g. last week, last month).

Suggested Implementation

  • Use battle-tested offline database tech with easy query capability (e.g. sqlite, watermelondb, etc.)
  • To utilize the power of third-party packages, use an existing data visualization library from npm that supports React Native such as react-native-chart-kit, victory-native etc.
  • To practice quick UI development with existing tools, use an existing React Native UI kits such as Magnus UI, UI Kitten, or NativeBase.

If you're completely new to React Native, you can follow this tutorial I wrote to build this project. If you're already familiar with it and want to take on the more challenging features, you could kick it off from this repo and build features on top of it.

Whether you're following the tutorial or not, feel free to experiment with various libraries and tools, and pick the one that you feel most comfortable with.

References

You can use Expo for a more streamlined and smoother development experience since the project doesn't necessarily require features that are not available via Expo.

Hit a programming wall?
Get help from our mentors

  • Post request free
  • First 15 mins free

Suggested languages and frameworks

React NativeExpo

Difficulty

medium

Contributed by

Lead Engineer @pathable with a decade of development experience.

Interested in this project?

Shorten your learning curve with on-demand programming help

The awesome set of verified mentors will provide guidance and mentoring help when you are stuck.

Suresh Atta

  • Post request free
  • First 15 mins free
Shorten your learning curve with on-demand programming help

Browse more projects

More coming soon...