WeatherForecast Project Overview

Get a basic overview of the project we will build in this chapter.

We'll cover the following

WeatherForecast app

In this chapter, we will build a Blazor WebAssembly app to display a local 5-day weather forecast and then convert it into a PWA.

The web app we will build uses JavaScript's Geolocation API to determine the current latitude and longitude of the device. It uses the OpenWeather One Call API to obtain the local weather forecast and uses a variety of Razor components to display the weather forecast to the user. After we have completed the web app, we will convert it into a PWA by adding a logo, a manifest file, and a service worker. Finally, we will install, run, and uninstall the PWA.

Note: If you do not want to create an OpenWeather account, you can use the weather.json file that we have provided in the wwwroot folder.

This is a screenshot of the completed application:

Get hands-on with 1200+ tech skills courses.

Introduction to Blazor WebAssembly

Building Your First Blazor WebAssembly Application

Counter App

Building a Modal Dialog Using Templated Components

Task Tracking System

Building Local Storage Service Using JavaScript Interoperability

Building a Weather App as a Progressive Web App (PWA)

Building a Shopping Cart Using Application State

Building a Kanban Board Using Events

Completing the Kanban Board Project

Building a Task Manager Using ASP.NET Web API

Building an Expense Tracker Using the EditForm Component

Completing TaskManager Project

Conclusion

Local Installations

WeatherForecast Project Overview