A modern web application that helps users explore historical weather patterns and plan outdoor activities using real-time and historical weather data from Meteomatics API.

• Location Search: Search for any location worldwide using OpenStreetMap's Nominatim API
• Real-time Weather Data: Access current weather conditions via Meteomatics API
• Historical Weather Data: Historical weather patterns for better planning
• Weather Metrics: View temperature, humidity, rainfall, and wind speed averages
• Risk Assessment: Get probabilities for extreme weather conditions
• Activity Recommendations: Smart suggestions based on weather patterns
• User Accounts: Save favorite locations with Supabase authentication
• Interactive Charts: Visualize weather data with responsive charts
• Mobile Responsive: Works seamlessly on desktop and mobile devices

• React 18 with TypeScript
• Tailwind CSS for styling
• Shadcn/ui component library
• Recharts for data visualization
• Lucide React for icons

• Supabase for database, authentication, and edge functions
• PostgreSQL database with Row Level Security
• Meteomatics API for real-time and historical weather data

• Vite for fast development and building
• ESLint for code linting
• TypeScript for type safety

• Node.js 18+
• npm or yarn
• Supabase account

1. Clone the repository

   git clone <repository-url>
   cd metry1

2. Install dependencies

   npm install

3. Set up environment variables

   cp .env.example .env

   Fill in your Supabase credentials:

   VITE_SUPABASE_URL=your_supabase_project_url
   VITE_SUPABASE_ANON_KEY=your_supabase_anon_key
   VITE_SUPABASE_PUBLISHABLE_KEY=your_supabase_anon_key

4. Set up Supabase

   Run the database migrations:

   npx supabase db push

   Deploy the edge function:

   npx supabase functions deploy get-nasa-weather

5. Start the development server

   npm run dev

src/
├── components/
│   ├── ui/                 # Shadcn/ui components
│   ├── AuthModal.tsx       # Authentication modal
│   ├── LocationSearch.tsx  # Location search component
│   ├── NasaWeatherDashboard.tsx # Main dashboard
│   ├── SavedLocations.tsx  # Saved locations management
│   └── WeatherChart.tsx    # Weather data visualization
├── hooks/
│   └── use-toast.ts        # Toast notifications hook
├── integrations/
│   └── supabase/           # Supabase client and types
├── lib/
│   └── utils.ts            # Utility functions
└── App.tsx                 # Main app component

supabase/
├── functions/
│   └── get-nasa-weather/   # Edge function for NASA API
└── migrations/             # Database migrations

The main dashboard component that orchestrates the entire application:

• Location selection and search
• Date picker for historical data
• Weather data display and visualization
• User authentication integration

Provides location search functionality using OpenStreetMap's Nominatim API:

• Real-time search suggestions
• Geographic coordinate resolution
• Location name formatting

Visualizes weather data using Recharts:

• Bar charts for weather metrics
• Risk probability displays
• Responsive design

Handles user authentication:

• Sign up and sign in forms
• Supabase Auth integration
• Error handling and validation

Manages user's favorite locations:

• CRUD operations for saved locations
• Integration with Supabase database
• User-specific data with RLS

The application uses Meteomatics professional weather API:

• Endpoint: https://api.meteomatics.com/
• Parameters: Temperature (t_2m:C), Humidity (relative_humidity_2m:p), Precipitation (precip_1h:mm), Wind Speed (wind_speed_10m:ms)
• Data: Real-time and historical weather data
• Processing: Current conditions and historical averages for planning

The weather edge functions:

• get-nasa-weather: Fetches historical data from Meteomatics API
• get-weather-forecast: Provides real-time weather forecasts
• Processes weather data for specific dates and locations
• Calculates averages and probabilities
• Returns formatted weather data

CREATE TABLE saved_locations (
  id UUID DEFAULT gen_random_uuid() PRIMARY KEY,
  user_id UUID REFERENCES auth.users(id) ON DELETE CASCADE,
  name TEXT NOT NULL,
  latitude DECIMAL(10, 8) NOT NULL,
  longitude DECIMAL(11, 8) NOT NULL,
  created_at TIMESTAMP WITH TIME ZONE DEFAULT NOW()
);

The app can be deployed to any static hosting service:

npm run build

1. Create a new Supabase project
2. Run the migrations to set up the database
3. Deploy the edge functions
4. Configure authentication settings

1. Fork the repository
2. Create a feature branch
3. Make your changes
4. Add tests if applicable
5. Submit a pull request

This project is licensed under the MIT License.

• Meteomatics API for providing professional weather data
• Supabase for backend infrastructure
• OpenStreetMap for location search capabilities
• Shadcn/ui for beautiful UI components