Macroflows

https://macroflows.vercel.app

A modular, high-performance nutrition tracking platform built with SolidJS, strong typing, and clean architecture principles.

---

Screenshots

Click on the thumbnails to open/close each image individually — this way you don't have to scroll the page to see the content.

Diet Page

Food Search

Weight Tracking

Macro Profile

Overview

Macroflows is a nutrition tracking system focused on strong typing, reactive UI, and modular domain-driven design. It follows clean architecture principles and integrates with modern backend and frontend tools.

For now, it is focused on being a personal project to track my own nutrition, but maybe in the future it will be a SaaS product.

---

Features

Nutrition & Progress

• Macro tracking (carbs, protein, fat)
• Real-time calorie and macro calculations
• Personalized macro profiles (g/kg)
• Daily progress visualization with charts

Body Data

• Body fat estimation (U.S. Navy method)
• Weight logging with trend visualization

Food Management

• EAN barcode scanning
• Searchable food database
• User recent searches, favorites, and history
• Custom recipe builder with automatic macro calculation
• Meal planning and reusable templates

User Interface

• Responsive design
• Fine-grained real-time updates (SolidJS signals)
• Simple, fast navigation optimized for daily use

---

Architecture

src/
└── modules/                
    ├── diet/               # Diet tracking module
    │   ├── application/    # Use cases and business logic
    │   ├── domain/         # Core domain entities and types
    │   ├── infrastructure/ # Data sources (API, DB)
    │   └── ui/             # UI components specific to diet module
    ├── body/               # Body data module
    │   ├── ...             # Similar structure as diet module
    ├── clipboard/          # Clipboard management module
    │   ├── ...             # Similar structure as diet module
    └── ...                 # Other modules (auth, recipes, food search, etc.)

---

Tech Stack

• Frontend: SolidJS, TypeScript, TailwindCSS
• Backend: Supabase (PostgreSQL, Realtime)
  • Note: for simplicity, the backend is tightly coupled with the frontend in this project.
• Validation & Charts: Zod, ApexCharts
• Dev Tools: ESLint, Prettier, html5-qrcode

---

Getting Started

Requirements

• Node.js 20+
• Supabase account

Setup

Environment Variables: Copy .env.example to .env.local and fill in the required values. This file lists all environment variables needed to run the project. Do not commit secrets to version control.

git clone https://github.com/marcuscastelo/macroflows.git
cd macroflows
npm install

cp .env.example .env.local  # Add your Supabase credentials
npm run dev

---

Roadmap

• OpenTelemetry integration
• PWA support
• ML-based food recognition
• Social features (sharing, collaboration)

---

License

MIT — see LICENSE for details.