ByteforByte

// A real project we built together
import { useState } from 'react';

export function WeatherApp() {
  const [location, setLocation] = useState('');
  const [weather, setWeather] = useState(null);
  
  async function fetchWeather() {
    // Implementation details...
  }
  
  return (
    <div className="weather-container">
      <h1>Weather Forecast App</h1>
      <input 
        value={location}
        onChange={(e) => setLocation(e.target.value)}
        placeholder="Enter city name"
      />
      <button onClick={fetchWeather}>
        Get Weather
      </button>
      
      {weather && (
        <div className="weather-display">
          {/* Weather display UI */}
        </div>
      )}
    </div>
  );
}