/ react.js

React DadJoke

Welcome to the first in a (hopefully) long running series of posts I'm calling Code of the Week. Each week I'll be posting something like a tip, snippet, or example of something small and simple I've learned or created just for fun.

React DadJoke

Late last week, I create react-dadjoke. I forget how, but I came across icanhazdadjoke, a fun little site that displays random Dad Jokes. Each joke also has a permalink. There's even a Slack Integration, and...an API!

Just to play around, I made a simple react component to retrieve and display a joke. Sense the API allows for it, I also added in the options to display a specific joke (by ID) or display the joke as an image (.png).

The whole thing took about 3 hours, but that was largely because of creating the example page, and working on the build process. Now that I finally have a nice workflow for small, reusable components like this, I can start building more of them a lot faster. This one also got me using axios a little, which I need for some upcoming projects at work. So, even though it's small and simple, I actually learned quite a bit building this thing!