Now Page 2024

While looking at personal sites for inspiration I found the idea of a now page. So I decided to make one for myself. There are lots of examples of this on NowNowNow but my now page is located at /now.

For now it includes a personal, movie/TV, and music section. For the music section I’ve added a line about the latest song I listened to on Spotify via last.fm.

This was a good opportunity to implement api access on the site via a private key. Which is something I understood in practice but had never actually implemented myself. Just not something I had experimented with in the past.

First thing I did was go to last.fm and get an api key. From there I read the documentation they provided and reviewed samples I found just searching ye olde interweb. Using the most barebone page imaginable to use the key and retrieve the information I was looking for. I have to say there was more trial and error than I thought here which I think is largely due to the type of documentation provided in the api docs.

Anyway, with that done I knew I could pull the information I was looking for and format it as needed. Piecing together the song title, artist, and album of the latest song was complete.

Next, I needed to move that private key somewhere to actually keep it private. While the test had hard coded the key onto the page it needs to be stored as an environment variable and accessed in a way that does not expose it to a client.

Luckily for me, my host of choice Netlify has some good documentation and site configuration to make this easier. There is a section for Environment Variables within the site configuration which allowed me to specify the api key.

From there I would need a way to access that information at run time versus having the build of this Jekyll site pull it into the code of the site. This was achieved by the use of Netlify functions which allow for server side Javascript to be run to access environment variables.

Prior to this addition there was not much configuration in the setup of this site for the Netlify build. Now there are a few more requirements and I’m not sure if it could go back to GitHub Pages.

Unfortunately, my compuslive upgrading has delayed the launch of the page a bit as well as a few of the supporting tools to build the site had some cascading dependency issues tied to updating one piece or another.

After the api key was setup, kept private in environment variables, accessed via a server side function call, and used to pull song details, I was ready to build the rest of the /now page. I had originally just setup a HTML page but I went ahead and converted it to markdown to utilize the existing templates.

Then I had to decide what was even happening now which I kept pretty light as it is just a first pass. I think having the page out there and reviewing it periodically would be a good sanity check from time to time.


Comments

Comment on this blog post by publicly replying to this Mastodon post using a Mastodon or other ActivityPub/​Fediverse account. Known non-private replies are displayed below.

No known comments, yet. Reply to this Mastodon post to add your own!