Background

This is my background 🙂. It's mainly for Windows with Wallpaper Engine.

It uses the DWD open-data server to get weather data.

Images

Main Monitor

Second Monitor (yeah I'm still using a 4:3 one)

Setup

• To get the icons (I'm using the icons from Windy.com), run Get-Icons.ps1 in PowerShell (you might need PowerShell 7).

• Rename .env.example to .env and edit the station-id and optionally the icon set (windy or msn).

  Stations can be found on weatherapi.nerixyz.de/stations or dwd.de.

• Run pnpm i to install the dependencies (you need pnpm).

• Run pnpm build to build both backgrounds.

Setting up a local webserver

I'm using nginx to host the SPA. This tutorial is for Windows :)

• Download nginx.
• Unpack it somewhere.
• Download nssm.
• Unpack the .exe for your architecture (you only need the exe).
• Open a shell and run nssm install nginx.
• In the GUI, set the path to the nginx.exe (the directory should be automatically set)
• Navigate to the IO tab and set Input (stdin) to start nginx
• Click Install Service

Configuring Nginx

• In the nginx folder, open conf/nginx.conf
• Delete the default server block and create two new ones, each pointing to the dist folder.
• An example:

MAIN_PORT and SECOND_PORT should be different and have a high number (e.g. 54879 and 54880). MAIN_DIST_PATH and SECOND_DIST_PATH should be with forward slashes (e.g. C:/something/dist) and contain the path to the respective dist folder.

error_log logs/error.log warn;
http {
    include       mime.types;
    default_type  application/octet-stream;

    sendfile        on;
    keepalive_timeout  65;
    server {
        listen       MAIN_PORT;
        server_name  localhost;

        root MAIN_DIST_PATH;
    }
    server {
        listen       SECOND_PORT;
        server_name  localhost;

        root SECOND_DIST_PATH;
    }
}

• Open the TaskManager
• Go to the Services tab
• Start the nginx service (right click)

Setting up the Wallpaper

Wallpaper Engine supports websites as wallpapers through CEF, so we'll use that.

• Open the Wallpaper Engine GUI.
• For each monitor:
  • At the bottom click Open Wallpaper
  • Select Open from URL
  • Enter the URL http://localhost:MAIN_OR_SECOND_PORT (use the port you specified in the nginx.conf)
  • Select the Wallpaper