SymTrack

• 

  SymTrack's Homepage

Inspiration

Many people struggle to connect daily health changes with overall well-being. Symptoms can feel random, and without a clear record, it’s hard to understand triggers, patterns, or progress. Symtrack was inspired by the idea that tracking your health shouldn’t be complicated. By making symptom logging simple, visual, and actionable, the app empowers users to see trends, understand their bodies, and take control of their health, turning scattered feelings into clear insights.

What it does

Symtrack is designed to make understanding your health simple and actionable. With the app, users can log symptoms quickly and consistently, capturing how they feel each day without any hassle. Beyond simple logging, Symtrack visualizes patterns over time, helping users see connections between symptoms, lifestyle habits, and environmental factors. By tracking symptoms longitudinally, the app allows users to identify triggers, monitor improvements, and recognize flare-ups, empowering them to take proactive steps for their well-being.

The app also supports tracking progress, generating summaries and charts that provide a clear view of health trends. Users can share insights with healthcare providers to support better-informed medical decisions. Symtrack’s design prioritizes clarity, consistency, and user empowerment, turning scattered daily health observations into meaningful insights that help users take control of their health journey.

How we built it

Symtrack is built to be fast, reliable, and easy to maintain. The app is developed using React with TypeScript, providing a type-safe and scalable codebase that ensures a smooth user experience. We chose Vite as our build tool for its lightning-fast development server and efficient bundling, allowing us to iterate quickly and deploy updates seamlessly.

All symptom logging, visualization, and interactive features are implemented directly in the frontend, keeping the app lightweight and responsive. Charts and trends are created using React-compatible libraries, making it easy to visualize patterns and track progress in real time.

By focusing on a modern React + TypeScript + Vite stack, we ensured that Symtrack is performant, maintainable, and ready to scale, while keeping the user experience clean, intuitive, and responsive.

Challenges we ran into

We struggled with synchronizing symptom logs and trend data across components in React, which caused occasional delays in chart updates. Implementing interactive charts that clearly show daily patterns and triggers was tricky without overloading the UI. We also had to optimize rendering so months of data wouldn’t slow down the app, all while keeping the TypeScript types consistent to prevent bugs.

Accomplishments that we're proud of

We’re proud that Symtrack is multilingual, supporting English, Spanish, and French, and that we built it entirely using React, TypeScript, and Vite, mastering new technologies along the way. The app makes symptom logging simple and intuitive, while interactive charts help users see patterns and take control of their health

What we learned

Through building Symtrack, we learned how to design a user-friendly, multilingual app that balances functionality with simplicity. We gained hands-on experience with React, TypeScript, and Vite, deepening our understanding of component-based architecture, state management, and performance optimization. We also learned the importance of iterating on user experience, testing features, and adapting designs to meet the needs of diverse users.

What's next for SymTrack

We plan to let users securely export their symptom data to healthcare providers and sync across devices through a secure cloud database. Additionally, we’ll introduce reminders and notifications so healthcare providers can help users stay on track with medications, physical therapy, and follow-ups.

Built With

• react
• typescript
• vite