Medly | Medication and Mood Tracker - React

Live Demo: Medly | Medication and Mood Tracker - React Live Demo

Medly | Medication and Mood Tracker - React is a comprehensive, production-ready medication tracking application built with React and wrapped in a native iOS shell using Capacitor. Designed for both personal and professional use, Medly empowers users to meticulously track their daily and as-needed (PRN) medications, conduct timed mood check-ins, and gain valuable insights into how their medication regimen influences their well-being.

Product Overview

Medly provides a user-friendly interface that guides users through a 14-step onboarding process, collecting essential demographic information, medication categories, goals, and preferences. This personalized approach ensures the app caters to individual needs and promotes effective medication management.

Modern Design and User Experience

Medly boasts a sleek and intuitive design based on React, Tailwind CSS, and shadcn/ui components. The warm dark theme with terracotta accents creates a calming and visually appealing experience. The app seamlessly integrates Framer Motion animations throughout, enhancing user engagement and providing a smooth navigation flow.

Main Features and Capabilities

Medly offers a wide range of features to streamline medication tracking and mood monitoring:

• Daily Medication Tracking: Users can effortlessly log their daily doses with a simple checkbox-style interface. The app supports multiple scheduled times per day and allows for easy undo functionality.
• PRN Medication Logging: Medly facilitates quick and efficient logging of as-needed (PRN) medications, allowing users to record custom doses and times.
• Post-PRN Check-In Reminders: Automatic reminders, configurable to 30, 45, or 60 minutes after a PRN dose, ensure timely feedback on medication effectiveness.
• Mood Check-Ins: A 5-step daily mood check-in process allows users to rate their mood, anxiety, focus, mental clarity, and stress levels using sliders. Users can also add notes for a more comprehensive understanding of their emotional state.
• Post-PRN Check-Ins: Following PRN medication use, users can assess their emotional response through an emotion picker, compare the PRN effect (better, same, worse), and add personalized notes.
• Medication Wizard: A guided, multi-step wizard simplifies the process of adding new medications, allowing users to set doses, units, schedule times, reminder offsets, and start dates.
• Medication Management: Users can edit, deactivate, and delete medications with access to full dose history.

Home Dashboard

The Home dashboard provides a snapshot of user progress with a 15-day streak counter, weekly adherence tracking, and a calendar strip displaying logged days for the current week.

Trends Screen

The Trends screen presents weekly area charts for mood, anxiety, focus, mental clarity, and stress levels. Users can identify trends, observe improvements or declines, and gain insights into the impact of their medication regimen.

Insights Screen

The Insights screen offers a week-over-week navigation system with mood charts and medication dose overlay bars, providing a comprehensive view of medication effectiveness and mood fluctuations.

Effect Curve Screen

Medly features an Effect Curve screen that visualizes the onset, peak, and wear-off timeline for fast-acting medications, aiding users in understanding medication duration and potential interactions.

Timeline Screen

The Timeline screen displays a chronological feed of medication logs and mood check-ins, allowing users to track their progress over time and filter entries by type.

Local Notifications

Medly utilizes local notifications to remind users about daily medication doses, scheduled check-in times (up to 5 per day), and more.

In-App Subscriptions

Medly offers a 3-day free trial followed by weekly and annual subscription plans. Users can manage subscriptions through StoreKit 2 and restore previous purchases seamlessly.

Settings

The Settings menu allows users to toggle notifications, edit check-in times, manage subscriptions, export data, sign out, delete their account, and access crisis resources.

Additional Features

Medly incorporates streaks, empty states with blurred chart previews, loading states, toasts, and Framer Motion animations to enhance the user experience.

Technology

Medly is built on a robust technology stack:

• React 18 + Vite: The web application core is powered by React 18 and Vite for fast development and performance.
• Capacitor 8: Capacitor 8 enables the creation of a native iOS shell, ensuring a smooth and optimized user experience on iOS devices.
• Firebase Auth + Cloud Firestore: Firebase provides secure authentication and a scalable backend using Cloud Firestore for data storage.
• TanStack Query v5: TanStack Query v5 handles data fetching and caching, ensuring efficient data retrieval and management.
• React Router v6: React Router v6 manages navigation within the app, providing a seamless user experience.
• Tailwind CSS + shadcn/ui components: Tailwind CSS and shadcn/ui components contribute to the app's modern design and responsiveness.
• Recharts: Recharts is used for creating interactive and informative trend charts.

Ideal Use Cases

Medly is ideal for:

• Individuals seeking to track their medication regimens and monitor their well-being.
• Healthcare professionals who need a convenient tool for patient medication management and progress tracking.
• Researchers conducting studies on medication effectiveness and its impact on mood and behavior.

Who Should Use This Product?

Medly is designed for anyone who wants to:

• Effectively track their daily and as-needed medications.
• Monitor their mood and identify patterns and trends.
• Gain valuable insights into how their medication affects their well-being.
• Simplify medication management and improve adherence.

Installation and Setup Guide

Medly comes with a comprehensive installation and setup guide:

• Create a free Firebase project at firebase.google.com.
• Enable Email/Password authentication and Cloud Firestore.
• Paste your Firebase config into one file: src/lib/firebase.js.
• Run npm install, npm run build, then npx cap sync ios - full steps are in documentation.html.

Important Product Information

• External Service Costs: Medly relies on Firebase (a third-party Google service). While Firebase's free Spark plan is sufficient for development and small-scale use, if your usage grows or you enable paid features, Firebase may incur additional charges. These potential external costs are not covered by the purchase price of this item and are the buyer's responsibility.
• Apple Developer Program: Publishing the app and managing its in-app subscriptions requires a paid Apple Developer Program membership (US$99/year). This annual fee is not covered by the purchase price and is the buyer's responsibility.

Final Conclusion

Medly is a powerful and comprehensive medication and mood tracker that empowers users to take control of their well-being. With its user-friendly interface, intuitive design, and advanced features, Medly provides a valuable tool for individuals, healthcare professionals, and researchers alike.

Category: Mobile App

(Only For Premium Category Products !)

1. All digital products are the most recent version, with no possibility of free updates. After payment, you can request an update to the most recent version for 5 days if a new version is released. We free support within 5 days.

2. If a license is required (Excludes WHMCS license , we provide only method not license), please contact us via email or ticket for assistance with activation. Our license is only valid for activation and does not include support.

3. We provide Mobile, PHP script installation services for $19.90 / ₹1700. Please create a backup after installation as we do not support re-installation. For mobile app source code, we do not offer installation services.

4. If you have any questions, please contact us by email [email protected] or create a ticket on this page

5. Please note that any digital products presented on the website do not contain malicious code, viruses or advertising. You will receive the original files from the developers. We do not sell any products that have been downloaded from other websites.

6. The response time can last up to 6 hours.

(Only For Membership Category Products !)

Benefits of our Membership Plans

• Instant access to all plugins and all themes including all future releases
• Unlimited domain usage
• Regular Updates as of when available. Usually, updates are released daily.
• Before purchasing, please read the Terms and Conditions & Refund Policy.
• If you have any questions, please first read the FAQs.
• If you haven’t found the answer to your question, please contact us, and we will respond ASAP.
• Please note that any digital products on the website do not contain malicious code, viruses, or advertising. We buy the original files from the developers. We do not sell any products downloaded from other sites.
• Buy or download for FREE by subscribing to our VIP Membership Plan. Join the club of more than 1100+ happy members. This is the same theme as sold by the developer.

Updates:

• We offer frequent updates for one year from the date of purchase. After this period, you have to purchase the item again to receive further updates, we also offer lifetime updates as a second option.
• We regularly update products as soon as we are notified about an update, we go and download it from the author and update it on our site, but In case the current version of the product is not the latest, You can request an update for the product by contact form.
• We send regular emails advising when products have been updated so please be sure to provide an active email address when you sign up.

Support:

• Our support team is available 24/7, if you have any questions or need help in installing or configuring digital products purchased on the website, please don’t hesitate to contact form.
• Please note that we are not developers of the provided products, so our technical support capabilities are limited. We do not change product functionality and do not fix developer bugs.

For more information please read FAQs & About Us.

(Only For WHMCS Category Products !)

• We Only provide WHMCS Module, how you can  nulled any module step only !
• Instant access to all plugins and all themes 
• Unlimited domain usage
• Regular Updates as of when available. Usually, updates are released daily.
• Before purchasing, please read the Terms and Conditions & Refund Policy.
• If you have any questions, please first read the FAQs.
• If you haven’t found the answer to your question, please contact us, and we will respond ASAP.
• Please note that any digital products on the website do not contain malicious code, viruses, or advertising. We buy the original files from the developers. We do not sell any products downloaded from other sites.