Diet Site for a Healthy Intestine

Description

A comprehensive website designed to assist in intestinal health care, featuring editing capabilities, personalized schedules, food lists, and daily routines.

Features

🏠 Home Page

• Introduction to the site and its features
• Informative cards about the benefits
• Responsive and modern design

🍎 Food List

• Recommended Foods: Organized by categories (Fruits, Vegetables, Cereals, Proteins, Probiotics)
• Foods to Avoid: List of foods that may harm intestinal health
• Visual interface with colored badges

📅 Editable Schedule

• Complete weekly schedule (Monday to Sunday)
• 4 meals per day (Breakfast, Lunch, Snack, Dinner)
• Editing Functionality: Click "Edit" to modify meals
• Local Saving: Data is automatically saved in the browser
• Intuitive interface with editable text fields

⏰ Daily Routines

• 8 essential routines for intestinal health
• Checklist System: Mark routines as completed
• Data Persistence: Progress is saved automatically
• Visual feedback with strikethrough text for completed items

💡 Tips and Information

• Important tips on hydration, fiber, exercise, and stress
• Signs of improvement in intestinal health
• Educational and practical information

Technologies Used

• React 18 - JavaScript framework
• Tailwind CSS - Styling
• shadcn/ui - UI components
• Lucide React - Icons
• Local Storage - Data persistence
• Vite - Build tool

How to Use

Installation and Running

# Navigate to the directory
cd dieta-intestinal

# Install dependencies
npm install

# Run in development mode
npm run dev

# Access in browser
http://localhost:5173

Main Features

Editing the Schedule

1. Go to the "Schedule" tab
2. Click the "Edit" button
3. Fill in the text fields with your meals
4. Click "Save" to persist the changes
5. Use "Cancel" to discard changes

Managing Routines

1. Go to the "Routines" tab
2. Check the boxes for completed routines
3. Progress is saved automatically
4. Checked items are visually struck through

Checking Foods

1. Go to the "Foods" tab
2. Consult the recommended foods list by category
3. Review foods to avoid
4. Use the information to plan your meals

Technical Characteristics

• Responsive: Works on desktop, tablet, and mobile
• Persistence: Data saved locally in the browser
• Performance: Fast loading and smooth interface
• Accessibility: Intuitive and easy-to-use interface
• Modern: Current design with smooth animations

Project Structure

dieta-intestinal/
├── src/
│   ├── components/ui/     # shadcn/ui components
│   ├── App.jsx           # Main component
│   ├── App.css           # Custom styles
│   └── main.jsx          # Entry point
├── public/               # Static files
├── package.json          # Dependencies
└── README.md             # This documentation

Site Benefits

• Organization: Keep your meals and routines organized
• Education: Learn about foods beneficial to the intestine
• Tracking: Monitor your daily progress
• Personalization: Customize the schedule to your needs
• Convenience: Access from any device

Support

For intestinal health concerns, always consult a qualified healthcare professional.

---

© 2025 Diet for a Healthy Intestine