منصة Healthy in: دليلك المتكامل للتغذية وحساب السعرات الحرارية بدقة.

for english scroll down تم تصميم وتطوير منصة Healthy in لتكون الوجهة المثالية لكل من يبحث عن تنظيم نمط حياته الصحي. المشروع ليس مجرد واجهة عرض، بل هو تطبيق ويب تفاعلي يركز على تقديم تجربة مستخدم (UX) فائقة السرعة والاستجابة. تم الاعتماد بشكل أساسي على React.js لضمان تدفق البيانات بسلاسة وإدارة حالة التطبيق (State Management) بذكاء. أبرز مميزات المشروع: متجر المنتجات الصحية: عرض قائمة من الوجبات الصحية (مثل سلطة الكينوا والأرجولا) مع توضيح المكونات وحالة التوفر، بتصميم كروت (Cards) عصري ومنظم. حاسبة السعرات الحرارية (Core Logic): برمجة منطقية متكاملة تتيح للمستخدم إدخال بياناته الحيوية (الوزن والطول) للحصول على تحليل دقيق للاحتياجات اليومية من بروتين، دهون، وكربوهيدرات بشكل فوري. قسم نصائح التغذية: واجهة تعليمية جذابة تقدم إرشادات حول الوجبات المتوازنة وأهمية شرب الماء، مدعومة بصور توضيحية عالية الجودة. تصميم متجاوب بالكامل: الواجهة متوافقة تمامًا مع كافة الشاشات (Mobile & Desktop) باستخدام Tailwind CSS، مما يضمن وصول المستخدم لبياناته في أي وقت ومن أي مكان. -------------------------------------------- Healthy in is a high-performance web application designed to empower users on their wellness journey. Built with a focus on modern React.js architecture, the platform blends informative content with powerful interactive tools to provide a seamless user experience. The project showcases a sophisticated "Programming Logic" implementation, particularly in the custom-built Calorie & Macro Calculator. By processing user inputs (weight and height) in real-time, the app provides a detailed breakdown of daily nutritional requirements, demonstrating precision in front-end state management. Key Technical Features: Interactive Storefront: A clean, card-based UI displaying healthy meal options with ingredient lists and real-time "Stock Status" indicators. Advanced Macro Calculator: Custom logic to calculate calories, protein, fats, and carbohydrates based on user-specific metrics. Nutritional Knowledge Base: A dedicated module for health tips, optimized for readability and visual engagement. Performance-First UI: Fully responsive design using Tailwind CSS, ensuring lightning-fast load times and a premium "app-like" feel on both mobile and desktop browsers. Skills Used: React.js / Next.js JavaScript (ES6+) Tailwind CSS Responsive Web Design State Management Frontend Logic & Calculations UI/UX Optimization