Fetching Data with async/await in a React Component

Fetching data from a resource, such as a JSON API is a common thing these days, and so is the use of asynchronous (async) functions that avoid locking up applications.

In React components, async functions have some additional caveats to keep in mind that –if left unchecked– can introduce memory leaks or race conditions.

In this article, we’ll be covering a small app that fetches articles from an API and lists them out. We’ll take a look at async functions in a React component, address caveats, and checkout making our function reusable as a custom React hook.

This article will cover:
💚 Async/Await use in a React component
💚 Writing cleaner code with custom hooks
💚 Testing async/await in Jest 👩‍🔬

✔ Familiar with functional React component basics
✔ Basic understanding of async/await

August: Week 1

The first week of August has come and gone. This week went by in a blur; I actually can’t remember where the bulk of my time went, but I know it wasn’t idling.

It’s a reminder to slow down a bit and take inventory. Being busy isn’t the same as being productive. (And to me, “being productive” means making cool stuff happen)

This week there are some noteworthy happenings. I reached phase 1 of my blog redesign, my next technical post is just about ready, and I have some topics lined up to write about.

For today, I have the redesign to share and an interesting article on software debt.

Redesign Soft-Launch 🚀

Over the last month, I’ve redesigned my website, which includes adding a newsletter and feedback form. I launched that this weekend and plan on improving it as time goes on. It will be a web garden of sorts.

Designing the site myself has been a nice experience. It’s rebuilt some of my confidence in putting a site together from scratch. Spacing, font sizing, and color pallets give me a bit of stress.

There’s a bit going on behind the forms too. They have some extra measures put in place in an attempt to make them fault-tolerant. We’ll see how that works out.

If you can’t tell, I have a fondness for a certain shade of green. I use something similar for my Diablo III flag.

I’ll change up the homepage sometime soon so that it’s easier to find relative content. As it is right now, there’s a lot of scrolling involved in seeing what content is available.

July in Retrospect 🎆

This has been a busy month full of learning and renewing my efforts with this blog and my content creation pursuit.

With learning, I’ll actually break that out over the upcoming weeks to cover some different topics.

Test Driven Development

Testing automation and continuous delivery have been a big theme. They’re something I want to integrate into the SDLC at work with my teams. Ultimately it’s about streamlining deployments so developers can spend their time on what they like to do.

There are many hurdles to get over, many of those being related to knowledge in the quality control space.

International TDD Conf

 July 10 was the first International Test Driven Development Conference. The speakers did a great job at covering different aspects of testing.

I thought I knew what TDD was. You write tests first and then the implementation. Right?

I discovered that description doesn’t really do it justice. The TDD demonstrated in the conference integrated testing into development every step through a cycle known as Red, Green, Refactor.

The talk by Jov Mit does a good job at covering what Red, Green, Refactor is, different styles of TDD, and a live demo walking through TDD.

May/June 2021 – Month(s) in Review

We’re now half way through 2021. This has been a weird one. With this milestone, it does have me thinking about how I can plan out my time better to make the most out of this second half.

I’ve been keeping busy these last couple months, there is actually a lot I would like to share, but it’s all over the place. So I’ll split up those topics through July (hopefully I make good on this).

In my free time, there’s been a lot of Diablo play (I and III), and researching/learning some new technical concepts. I’ve been checking out Apollo GraphQL for API considerations. I’ve also been spending some time getting familiar with Ansible for server configuration.

Diablo III – Season 23

Season 23 began for Diablo 3 and I’ve been playing through it on PC and Switch. This is actually the first season I’ve played on PC in a while, I really like playing on the Switch because it’s portable.

I decided this time around I wanted to complete the season as a whole, and I was able to accomplish that on PC. I’m pretty close on Switch

I discovered some helpful resources to figure out good builds. Icy Veins has a section for Diablo 3 and there’s also Maxroll (I really like their UI). I’ve also been catching info from the Rhykker YouTube channel.

I started with a Wizard meteor build on Switch, unfortunately that build is retired. I didn’t know that until later (I’ve moved over to Firebird Mirror Image). Spectral blade is one of my favorite skills ❤.

April 2021 – Month in Review

The Jamstack

This month I’ve been checking out TravisCI and Netlify. I was able to get my portfolio app and Spotify app (pet projects) deployed to Netlify.

TravisCI is a continuous integration service. It will build an web application and run tests. This helps confirm there have been no changes that break the software.

Netlify is hosting service, more specifically Jamstack websites and serverless functions.

Both Netlify and TravisCI have been free to try. Their limits for the free tier have been more then enough for me to deploy a couple of my projects and push up updates. They also fit into the Github ecosystem very well.

The life cycle from development to deployment looks like this:
Push changes to Github → TravisCI builds app and runs tests → Netlify pulls new code and deploys

Stay Awhile and Listen

Go is a language that has always perked my interest a bit. I was watching a developer on Twitch working on with feature flags, and after looking into Go a little saw that it’s use is still growing. So I decided to finally try it out.

Go feels unique to me, in that a lot of how its used/coded is very opinionated. You have the freedom to do whatever you want of course, but there is a “Go way” of developing programs and mods. For example, it’s common to have all Go projects live under a single Go workspace.

I built a simple app that displays the Diablo III ladder rankings for any of the ladders this season. (Github Source)

Music Pick

Lately I’ve been listening to a lot of Call of the Wild, a weekly music show that has a mix of different electronic music. Episode 341 features Koven’s new album. Here’s a particular song I really like.

Link Picks

Casidoo – Make Jest Faster (Casidoo’s Newsletter)
C# learning this month (dot.net/videos)