MealDex

Name: MealDex
Brand: Liveezy Studios

$6.00

MealDex is a dynamic, browser-based recipe management and visualization tool developed by Liveezy Studios.
It lets users create, store, edit, and visually browse their personal recipe collections through a unique cover flow interface that flips between recipe images and detailed instructions.

The app operates fully client-side with all data saved in the browser via LocalStorage, ensuring privacy and offline access.
MealDex integrates with TheMealDB API for fetching real-world recipes and automatically populating ingredients, steps, and images.

About
Third-Party Data Sources and Attribution
Legal Notice and License

Core Features

Recipe Management

Add, edit, and delete recipes directly within the interface.
Built-in form for manual recipe input (title, image URL, ingredients, and steps).
Save and load all data locally using LocalStorage for instant offline persistence.
Export and import recipe collections as .json files.
One-click Reset to restore default sample recipes.

Interactive Cover Flow Interface

3D animated card system for browsing recipes.
Flip cards to reveal full step-by-step cooking instructions.
Dual flow system showing All Recipes and Favorites sections.
Dynamic scaling and smooth transitions for visual browsing.
Adjustable layout that separates or merges favorites and main recipes based on count.

Favorites and Filters

One-click “⭐” toggle to mark recipes as favorites.
Separate favorites flow for easy browsing.
Real-time search filtering by title, ingredients, or steps.
Live result counter and total recipe count display.

Ingredients and Steps

Popup modal for quick ingredient list view.
Editable fields directly on recipe cards.
Ingredient parsing from text or comma-separated values.

Online Recipe Fetching

Integrated TheMealDB API for fetching random meals.
Automatically imports recipe title, image, ingredients, and cooking instructions.
Supports up to 20 ingredients per meal, including measures and details.

Offline & Local Control

Works entirely offline once loaded.
Uses browser LocalStorage for all user data and recipe persistence.
No account, login, or external database required.

Interface & Design

Futuristic neon-themed dark interface inspired by the Liveezy Studios design language.
Soft glass-like cards with animated transitions.
Clean top bar with search, export/import, reset, and fetch controls.
Responsive layout suitable for desktop and tablet browsers.

Technologies Used

HTML5, CSS3, Vanilla JavaScript — fully standalone, no external libraries.
LocalStorage — for persistent offline recipe saving.
Fetch API — for data retrieval from TheMealDB.
Dynamic DOM Rendering — for real-time updates and smooth transitions.
3D CSS Transforms — for cover flow animations and flipping cards.