Code Quality Challenge - Week 4

Final week of the CQC lets see what it was in store for us...

Day 22 - Audit your DB schema

I can do full stack development and know the ins and outs of DB schemas but that's not something I deal with day to day with on this codebase.

The closest thing I have to a schema on the front end is the mapping of the backend data models to the frontend models. I like to check the 'shape' of the data coming from the backend to make sure there is nothing unexpected.

If you catch errors at the edge of the system they are much easier to identify than in some random component thats getting the wrong data.

To define these models I use the Codec module of the Purify library, well worth a look if you're interested in validating the the structure and format of your api data.

I spent my 20 minutes today verifying these models are up to date with the backend.

Day 23 - RTFM

Today's challenge: spend 20 minutes reading the docs for something you'd like to know a little better. ​

Like most developers I have an unexplainable dislike to "Reading The F*ing Manual". I'm not a fan of reading a manual but love keeping up to date on via blog posts. I keep a backlog of interesting posts to read using Pinboard.

I chose to read Complete Guide to React Rendering Behavior an epic post by Mark Erikson

Day 24 - Investigate high-churn files

(This challenge was created by guest contributor Giovanni Lodi. I recommend checking out his blog.)

Today, please spend ~20 minutes looking into the churn your project has experienced.

Perhaps a file changes often because it is unclear and therefore buggy. Perhaps it’s doing too many things.

Giovanni Lodi gives a git command we can use to find high churn files:

git log --all -M -C --name-only --format='format:' "$@" \ | sort \ | grep -v '^$' \ | uniq -c \ | sort -n \ | awk 'BEGIN {print "count\tfile"} {print $1 "\t" $2}'

Unfortunately this didn't work for me but a quick search found git-churn a script that did the same job.

Our top 10 high churn files where a mix of config files, css and a few components.

I dug deeper into the components and found a large component that was ripe to be broken down into smaller components.

This is a great way to find potential hot spots in the code base, I'll definitely be using the script again.

Day 25 - Create/update your snippets

(This challenge was again created by guest contributor Giovanni Lodi.)

Today’s challenge: spend 20 minutes getting snippets support configured in your editor.

I'm a little skeptical on this one, I've spent time before creating snippets and found I've not used them. Let's see how it goes this time.

I'm using Webstorm as my day to day editor, it has excellent support for snippets or live templates as they call them.

I think my previous issue with snippets is creating lots of snippets up front and then forgetting about them. To avoid that this time I'm only going to add a single snippet at a time until its committed to memory before adding another.

My first snippet?

test('$NAME$', () => {
    $END$
});

I'm doing a lot of testing at the moment 😀

Day 26 - Begin plugging a knowledge gap

Do you recall thinking something like "I really should know more about X"? ​

Today's your chance to do something about it. ​

Back to the Pinboard I talked about earlier in the week.

I spent 20 minutes reading a post by Dan Abramov about the use of React's useMemo hook.

It actually shows how you don't always need to use useMemo, well worth a read if you have a spare 20 minutes.

Week 4 done ✓

My favourite task this week turned out to be Day 25 - Create/update your snippets. I mentioned I was skeptical about creating snippets as its something I've tried before and I never really took to it.

This time I've been building the snippets up slowly, one or two a day and really using them. This slow burn technique is going to become part of my development flow, a very worthwhile challenge!

The end?

I thought today would be the end of the challenges but no mention in Ben Orenstein's email today, lets see what the weekend or maybe Monday brings.