UrbanWellnessApp
Val Town is a collaborative website to build and scale JavaScript apps.
Deploy APIs, crons, & store data – all from the browser, and deployed in milliseconds.
A friendly AI wellness guru designed to help busy urbanites find balance between productivity and personal well-being in the fast-paced city environment.
- Personalized Wellness Tips: Work-life balance, healthy eating, and mindfulness advice
- Urban Nature Discovery: Recommendations for nearby parks, walking routes, and nature retreats
- Daily Wellness Challenges: Quick 30-second to 2-minute wellness activities
- Motivational Content: Inspiring quotes and calming ambient sound suggestions
- Soothing AI Personality: Part life coach, part friend - always supportive and understanding
├── backend/
│ ├── index.ts # Main Hono server
│ └── routes/
│ ├── wellness.ts # Wellness advice and tips
│ └── challenges.ts # Daily wellness challenges
├── frontend/
│ ├── index.html # Main app interface
│ ├── index.tsx # React frontend
│ ├── components/
│ │ ├── App.tsx # Main app component
│ │ ├── WellnessCard.tsx
│ │ └── ChallengeCard.tsx
│ └── style.css # Custom styling
└── shared/
└── types.ts # Shared TypeScript types
The Sage provides:
- Personalized Wellness Advice: Chat with the Sage about your stress, work-life balance, or wellness needs
- Daily Wellness Challenges: Get quick, actionable wellness activities (30 seconds to 5 minutes)
- Urban Nature Discovery: Find parks, walking routes, and nature spots in your city
- Customizable Preferences: Set your stress level, available time, and work environment
- Motivational Support: Receive inspiring quotes and ambient sound suggestions
- 🌿 Sage Chat Interface: Natural conversation with AI wellness guide
- 🌱 Quick Action Buttons: Instant access to challenges and nature recommendations
- ⚙️ Preference Settings: Customize experience based on your needs
- 🎯 Step-by-Step Challenges: Interactive wellness activities with progress tracking
- 💫 Ambient Sound Suggestions: Recommendations for calming background audio
- Backend: Hono.js with TypeScript
- Frontend: React with TypeScript
- Styling: TailwindCSS with custom glass-morphism effects
- AI: OpenAI GPT-4o-mini for personalized wellness advice
- Fonts: Inter + Crimson Text for modern + sage-like typography
- Animations: CSS keyframes for floating and fade-in effects
POST /api/sage/advice
- Get personalized wellness advicePOST /api/sage/challenge
- Receive a daily wellness challengePOST /api/sage/nature
- Find urban nature spots and walking routes