Tips and tricks for keeping your test suites clean

A clean tabletop with a plant
A clean tabletop with a plant
Photo by Sarah Dorweiler on Unsplash.

Unit tests are important. They prevent regressions as you refactor code, serve as documentation, and save you hours of time not spent doing tedious manual testing. In short, tests enable change.

But how much attention to cleanliness do we give our tests? We refactor our app’s production code, give descriptive names to variables, extract methods for repeatable functionality, and make our code easy to reason about. But do we do the same for our tests?

Consider this quote from Robert C. Martin:


Build and deploy review apps for better code reviews

Heroku review apps and AutoIdle demo app
Heroku review apps and AutoIdle demo app
Heroku review apps and AutoIdle demo app. Photo by the author.

Nearly every software company uses different environments for various stages of their code — local, development, staging, review, and production, to name a few.

For example, you might use a staging environment to host the app you’re about to deploy to production as you do one last spot check or run your test suite against it. Or you might use review apps as part of your code review process so that reviewers can easily confirm the app is working properly with the changes contained in the pull request.

Staging and review environments differ from production environments in that they are…


A phrase I hope to never hear again

Photo by Bermix Studio on Unsplash

“We didn’t write tests because we wanted to get our code out faster.”

Those words were uttered by a coworker during a handoff call in which my team would be assuming ownership of a code repo from their team. I cringed.

Not writing tests leaves you open to bugs, makes refactoring more difficult, and actually makes you move slower in the long run.

That’s it. That’s the post. We can end this article here if you want.

(For confidentiality purposes, we won’t go into where this happened or how long ago this happened.)

Digging in a little deeper, let’s look…


Readit: The web app I made for a community of bookworms to discuss their favorite books

Readit subreddit page for the 1984 subreddit
Readit subreddit page for the 1984 subreddit
Readit subreddit page for the 1984 subreddit. Photo by the author.

Social media apps are perfect candidates for using graph databases and GraphQL APIs. The combinations of complex data queries and relationships are endless.

Take Reddit, for example. The app consists of subreddits (or topics). Users can create posts in these subreddits, which means that there is a many-to-one relationship between posts and subreddits. Each post belongs to exactly one subreddit, and each subreddit can contain many posts. Users can comment on posts, leading to another many-to-one relationship between posts and comments. Each comment belongs to exactly one post, and each post can have many comments. There is also a many-to-one…


And how to write good ones too

Photo by Chandler Cruttenden on Unsplash

When is the last time you’ve looked through your repo’s git history? Go ahead and do it right now using git log. What do you see? Meaningful commit messages? Or a tangled mess of unhelpful statements?

Code is read more frequently than it is written, and the same is true of commit messages. Engineers working on legacy code will rely on the commit messages from previous developers to gain much needed context on why the code was written the way it was.

Therefore, make your commit messages good.

In this article we’ll learn how to write good commit messages by…


Simple ways to write better and cleaner code

Teeth-whitening kit
Teeth-whitening kit
Photo by Candid on Unsplash.

Clean code is more than just working code. Clean code is easy to read, simple to understand, and neatly organized. In this article, we’ll look at eight ways we can write cleaner React code.

When going through these suggestions, it’s important to remember that’s exactly what they are: suggestions. If you disagree with any of them, that’s completely fine. However, these are practices that I’ve found helpful in writing my own React code.

Let’s dive in!

1. Conditional Rendering Only for One Condition

If you need to conditionally render something when a condition is true and not render anything when a condition is false, don’t use a…


How to help older browsers understand new objects, methods, and syntax

Photo by Nikki Jeffrey on Unsplash

When discussing new JavaScript features and syntax, it’s common to hear words like polyfill, transpile, and even ponyfill used. For example, someone might say, “In order to use this in older browsers, you’ll need to use Babel to transpile the code.” Or maybe, “Make sure to provide a polyfill for this functionality so that older browsers can use it.”

If you’re not familiar with these terms, you may be asking yourself, “What’s the difference? Are these all just interchangeable words that mean the same thing?”

In this article, we’ll define these terms and clear the air of any surrounding confusion.

Polyfill


Dad joke “dadabase” app
Dad joke “dadabase” app
Dad joke “dadabase” app

Where do you keep your dad jokes? In a dadabase of course! Let’s imagine that you are a site maintainer for the world’s best dad joke database. Your app communicates with the database using a REST API that allows you to retrieve jokes and post ratings for those jokes. Visitors to your site can rate each joke they see via a simple user interface.

Recently you heard of a fancy new technology called GraphQL that provides the flexibility to request only the data that you need using a single API endpoint. It sounds neat, and you’d like to start using…


Photo by UX Store on Unsplash

Your frontend application needs a design system. If you want to provide a consistent user experience (UX), ship features faster, make re-branding changes more easily, and free up your time to focus on hard UX problems, this article is for you.

First off, what is a design system?

A design system is a tool that enables you to build your application. It provides all the building blocks and guidance your team needs to design and develop a product. In simple terms, you can think of a design system as a component library. At the “atomic” level, you might have components for a button, or an avatar, or…


A PDF export showdown

Photo by Chris Chow on Unsplash

I recently published an article comparing HTML-to-PDF export libraries. In it, I explored options like the native browser print functionality, open-source libraries jsPDF and pdfmake, and the paid service DocRaptor. Here’s a quick recap of my findings:

If you want the simplest solution and don’t need a professional-looking document, the native browser print functionality should be just fine. If you need more control over the PDF output, then you’ll want to use a library.

jsPDF shines when it comes to single-page content generated based on HTML shown in the UI. pdfmake works best when generating PDF content from data rather…

Tyler Hawkins

Senior software engineer. Continuous learner. Educator. http://tylerhawkins.info

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store