Devlog 3

I have expanded support from Wikipedia to more sources like Wired, BBC, The Verge, etc… It took a while because I had to learn how to use npm and the rss-parser library.

Bugs 🐛

• Confused between which variable to use for selecting the articles (i.e. sources vs feed vs article in article.js)

Changes

• I added rss links for each source
• Drafted a README file
• Learned how to use async functions to reduce load times
• Learned how to use Vercel CLI to test backend api code.
• Learned type module for Javascript.
• Also learned that I need to use `` instead of “” when using/embedding variables like response.status.
• Also spent a lot of time trying to make the category feature work where users can which categories they want for the random articles.
• Choosing which CSS selectors to use so that the category buttons have the proper hover and active transitions

Future Plans

• Add a link to the project’s github.
• More sources/categories!

Devlog #2

I added an open article button which opens the random article on click. I learned how to implement this through Javascript by using article.content_urls.desktop.page; to get the article url and then open the article on click using window.open(url, "_blank");, and an event listener on the open article button.

I also added the current date at the top of the title using date.toLocaleDateString.

I styled the buttons to slightly glow on hover and sink into the screen (inset box-shadow) on click.

Devlog #1

I started with Astro but after learning astro for about 1 hour, I realized that it was overkill for what I was trying to do. So instead I swapped to HTML, CSS, and JS (although, I’ll probably try programming it in Astro when I get the html/css/js version to work).

I spent around 15 minutes looking for colors, fonts, and a custom cursor icon for the site. I settled with the cute coffee bean icon which you can see in the image!

The rest of the time was spent adding the styles to styles.css, setting up the HTML to work with the Javascript code, and implementing API fetch functions. The Javascript kinda works, but I haven’t linked it with the button yet, so it only loads the article on page refresh. Also, the JS only works with Wikipedia API for now, but more sites are going to be added very soon.