Bird of the day

[cgillinger]

My daughter is really interested in birds, so I thought it would be fun to create something bird-related for her. I came across a great API that provides bird facts and images, and decided to make a simple “Bird of the Day” module for MagicMirror². 🐦

The module displays a random bird at a set interval using the Nuthatch API (https://nuthatch.lastelm.software/). The API is free, and you just need an API key to get started.

Here’s an example of how it looks:

You can customize the interval (weekly, daily, or hourly) and choose which bird facts to display, such as name, region, conservation status, or scientific name.

If this sounds like something you’d enjoy, you can find the project on GitHub:
👉 https://github.com/cgillinger/MMM-BirdOfTheDay/

[KristjanESPERANTO]

Nice! Don’t forget to add it to the module list: https://github.com/MagicMirrorOrg/MagicMirror/wiki/3rd-party-modules 🦤

[cgillinger]

@KristjanESPERANTO Ah, didn’t know there was a list! Will do asap, thnx!

[cgillinger]

And now cleaned the Github repo up a bit, also updated the module with some minor tweaks that I wanted to have (eg, position of text) and also added screenshots, the proper way.

[tomdabom]

@cgillinger

We are really enjoying the Bird of the Day on the MagicMirror!

Not sure if this was just a problem for me, but we were finding the same birds were being displayed and they were almost all ducks. I think the nuthatch API was always using the “Default value : 1” for page and “Default value : 25” for pageSize, so there were only 25 possible birds.

With the pageSize of 25 I think there are a maximum of 15 pages in their database. I fudged my .js file like this, but there is probably a better was to do this, I’m not a developer. Something to consider for future updates

getBird: function () {
    
    const randPage = Math.floor(Math.random() * 15) + 1;
    const endpoint = this.config.endpoint + "&page=" + randPage;

    fetch(endpoint, {
        headers: { "api-key": this.config.apiKey },
    })