Next.jsGemini AISystem Integration

CalorEase

A unified health ecosystem that integrates multiple external services into a single platform. It combines calorie tracking with real-time recipe fetching, a healthy product marketplace, and an intelligent AI assistant.

Source Code

The Challenge

Health enthusiasts often face a fragmented experience, switching between calorie trackers, recipe websites, and e-commerce platforms. Integrating these disparate data sources (recipes, products, user data) into a cohesive, responsive system without performance bottlenecks is a major challenge in system integration.

The Solution

I engineered a monolithic Next.js application that acts as a central hub. The system aggregates data from third-party Recipe and Marketplace APIs, normalizing inconsistent data structures into a unified UI. A Gemini-powered AI chatbot was integrated to act as a personalized health consultant, bridging the gap between data and user guidance.

Key Features

Smart Recipe Finder (Integrated Public API)

Healthy Marketplace (Integrated Public API)

AI Health Consultant (Gemini AI)

Unified Monolithic Architecture

Technology Stack

Next.js

Fullstack framework handling both Frontend UI and Backend logic.

Gemini API

Generative AI for interactive user assistance.

REST API

Integration with external Recipe & Marketplace services.

Tailwind

Rapid, responsive UI development.

Development Process

Research & Analysis

Analyzed available public APIs for recipes and products to define system requirements.

UI/UX Design

Designed a cohesive interface to display diverse data types seamlessly.

Slicing & UI Dev

Implemented the design into code using Tailwind CSS and React components.

Logic & Integration

Developed the core logic and integrated external APIs with error handling.

Finishing & QA

Refining the AI prompts and ensuring data consistency across the app.

Final Presentation

Demonstrated the system architecture and integration flow.

Engineering Challenges

Data Normalization

External APIs returned inconsistent JSON structures. I implemented an adapter layer in Next.js to standardize data before it reached the frontend.

AI Hallucination

The chatbot sometimes gave generic advice. I improved this by tuning the system prompt to act specifically as a nutritionist context-aware assistant.

"Submitted as the Final Project for the 'System Integration Technology' course, achieving a perfect score (Grade A). The project successfully demonstrated complex API aggregation and AI implementation."