An example Flutter weather app using the OpenWeatherMap API.

• Flutter App Architecture: The Repository Pattern

• Current weather (condition and temperature)
• 5-day weather forecast
• Search by city

The app is composed by three main layers.

The data layer contains a single HttpWeatherRepository that is used to fetch weather data from the OpenWeatherMap API.

The data is then parsed (using Freezed) and returned using type-safe entity classes (Weather and Forecast).

For more info about this, read this tutorial:

• Flutter App Architecture: The Repository Pattern

For more info about the project structure, read this:

• Flutter Project Structure: Feature-first or Layer-first?

This contains some providers that are used to fetch and cache the data from the HttpWeatherRepository.

// current city stored in the search box in the UI
final cityProvider = StateProvider<String>((ref) {
  return 'London';
});

// provider to fetch the current weather
final currentWeatherProvider =
    FutureProvider.autoDispose<WeatherData>((ref) async {
  final city = ref.watch(cityProvider);
  final weather =
      await ref.watch(weatherRepositoryProvider).getWeather(city: city);
  return WeatherData.from(weather);
});

// provider to fetch the hourly weather
final hourlyWeatherProvider =
    FutureProvider.autoDispose<ForecastData>((ref) async {
  final city = ref.watch(cityProvider);
  final forecast =
      await ref.watch(weatherRepositoryProvider).getForecast(city: city);
  return ForecastData.from(forecast);
});

This layer holds all the widgets, which fetch the data from the FutureProviders above and map the resulting AsyncValue objects to the appropriate UI states (data, loading, error).

• riverpod for state management
• freezed for code generation
• http for talking to the REST API
• cached_network_image for caching images
• mocktail for testing

The app shows data from the following endpoints:

• Current Weather Data
• Weather Fields in API Response
• 5 day weather forecast
• Weather Conditions

Note: to use the API you'll need to register an account and obtain your own API key. This can be set via --dart-define or inside lib/src/api/api_keys.dart.