En lokal single-page værapp for norske steder. Du søker etter et sted, og appen viser
nåværende vær, en temperaturgraf time for time og et varsel for de neste 7 dagene.
Webapplikasjonen henter alle data via et lokalt ASP.NET Core Web API. Selve
værvarselet kommer fra Yr-grunnlaget til Meteorologisk institutt via api.met.no,
mens stedsøket går mot OpenStreetMap (Nominatim).
- Søk etter norske steder og hent værvarsel for beste treff.
- Nåværende vær: temperatur, koordinater, værsymbol, vind, nedbør neste time og datakilde.
- «Time for time» med SVG-basert temperaturgraf for de neste 12 timene.
- «7 dager» med daglig varsel, høyeste/laveste temperatur, nedbør og værsymbol.
- Værsymboler og norske beskrivelser av værtype.
- Hele grensesnittet er på norsk.
Forside med time-for-time-graf
7-dagersvisning
Utvidet dag
- .NET 10
- WeatherApi – ASP.NET Core Minimal API (backend / proxy mot eksterne tjenester)
- WeatherApp – Blazor WebAssembly (frontend)
- WeatherShared – delt klassebibliotek med felles datamodeller
- Single-page webapplikasjon:
WeatherApper en Blazor WebAssembly-app med én hovedside for søk og værvisning. - Valgt lokasjon: Brukeren søker etter et sted, og appen henter vær for beste treff automatisk.
- Web API:
WeatherApier et ASP.NET Core Minimal API som frontend-en bruker for både stedsøk og værdata. Værvarselet hentes fraapi.met.no, Meteorologisk institutt sitt offisielle API for dataene som brukes av Yr. - Mulig å bytte datakilde: Værintegrasjonen ligger bak
IWeatherProvider, slik at backend kan få en ny leverandør uten at frontend-en må endres. - Lokal kjøring: Backend og frontend kjøres lokalt på hver sin port.
- .NET 10 SDK
- Internettilgang (appen henter data fra
api.met.noognominatim.openstreetmap.org)
Backend og frontend kjøres som to separate prosesser. Start API-et først.
1. Start API-et (i én terminal):
cd WeatherApi
dotnet runAPI-et lytter på http://localhost:5078.
2. Start frontend-en (i en annen terminal):
cd WeatherApp
dotnet runAppen lytter på http://localhost:5208 (og https://localhost:7208).
3. Åpne appen i nettleseren på http://localhost:5208.
Merk: Med standard lokal konfigurasjon må frontend-en kjøre på port 5208/7208. Andre adresser må legges til via
AllowedOrigins.
Adressen til API-et settes i WeatherApp/wwwroot/appsettings.json:
{
"ApiBaseAddress": "http://localhost:5078"
}Endrer du porten API-et kjører på, må du oppdatere denne verdien. Endrer du hvor
frontend-en kjører, må den nye adressen legges til i AllowedOrigins.
For publisert frontend brukes WeatherApp/wwwroot/appsettings.Production.json.
Se DEPLOY.md for deploy-oppsett med Vercel og en .NET-hostet API-tjeneste.
| Metode | Rute | Beskrivelse |
|---|---|---|
GET |
/api/locations/search?query={tekst} |
Søker etter norske steder (minst 2 tegn). |
GET |
/api/weather?name={navn}&lat={lat}&lon={lon}&periods={n} |
Henter værvarsel for gitte koordinater. |
Eksempelforespørsler ligger i WeatherApi/WeatherApi.http.
WeatherSolution.slnx Løsningsfil (samler de tre prosjektene)
DEPLOY.md Publiseringsguide for frontend og API
Dockerfile Container-oppsett for WeatherApi
vercel.json Vercel-oppsett for WeatherApp
vercel-build.sh Byggeskript for Blazor WebAssembly på Vercel
│
├── WeatherApi/ Backend – ASP.NET Core Minimal API
│ ├── Endpoints/ Definisjon av HTTP-endepunktene
│ ├── Services/ Meteorologisk institutt/Yr (vær) og Nominatim (stedsøk)
│ └── Program.cs Oppsett av tjenester, CORS og HttpClient
│
├── WeatherApp/ Frontend – Blazor WebAssembly
│ ├── Pages/ Hovedsiden (Home.razor) med graf og varselvisninger
│ ├── Services/ WeatherApiClient – kaller backend-en
│ ├── Layout/ Felles layout
│ └── wwwroot/ Statiske filer og konfigurasjon
│
└── WeatherShared/ Delt klassebibliotek
└── Models/ LocationOption, WeatherForecastResponse
Se ARCHITECTURE.md for en nærmere beskrivelse av dataflyten.
- Værvarsel: Meteorologisk institutt / Yr (Locationforecast 2.0)
- Stedsøk: Nominatim / OpenStreetMap
Begge tjenestene krever en identifiserbar User-Agent. Denne settes i
WeatherApi/Program.cs og bør tilpasses før eventuell produksjonsbruk, i tråd med
tjenestenes vilkår for bruk.
For å bruke en annen værtjeneste uten å endre frontend-en kan man:
- Lage en ny klasse i
WeatherApi/Servicessom implementererIWeatherProvider. - Mappe svaret fra den nye tjenesten til
WeatherForecastResponseogWeatherForecastPeriod. - Bytte registreringen i
WeatherApi/Program.csfra dagens leverandør til den nye.
Så lenge API-endepunktet returnerer samme delte modeller, fortsetter Blazor-appen å fungere uten endringer.


