"i only speak liquid" #10: Stay DRY: Don’t Repeat Yourself 🌵

Written by Erin Vaage 🧙

Author

Erin Vaage
October 12, 2022

Hey all 👋!

Welcome to 'i_only_speak_liquid' by Storetasker, where active Shopify developers like me (Erin) share learnings we face daily.

PS: I'm an expert on Storetasker and work with the best wellness, beauty, and food and beverage brands. Storetasker helps me to connect with awesome brands and work on projects I’m passionate about. Apply here if you want in.

What I’ve been thinking about:

A basic principle of software development is the DRY (Don’t Repeat Yourself) principle. The goal of DRY is to avoid the repetition of information. This principle isn’t just for programming languages, we can use the same concept when working with Liquid!

Let’s start with a simple example demonstrating the benefits of the DRY principle:

Click to see example or see below.

{% comment %} non DRY code {% endcomment %}

{% assign star_rating = section.settings.star_rating %}

{% case star_rating %}

{% when 1 %}

{% render 'icon', icon: 'star' %}

{% when 2 %}

{% render 'icon', icon: 'star' %}

{% render 'icon', icon: 'star' %}

{% when 3 %}

{% render 'icon', icon: 'star' %}

{% render 'icon', icon: 'star' %}

{% render 'icon', icon: 'star' %}

{% when 4 %}

{% render 'icon', icon: 'star' %}

{% render 'icon', icon: 'star' %}

{% render 'icon', icon: 'star' %}

{% render 'icon', icon: 'star' %}

{% when 5 %}

{% render 'icon', icon: 'star' %}

{% render 'icon', icon: 'star' %}

{% render 'icon', icon: 'star' %}

{% render 'icon', icon: 'star' %}

{% render 'icon', icon: 'star' %}

{% endcase %}

 

{% comment %} DRY code {% endcomment %}

{% assign star_rating = section.settings.star_rating %}

{% for i in (1..star_rating) %}

{% render 'icon', icon: 'star' %}

{% endfor %}

In this example, we are using a loop to execute repeated code. This saves time and effort, is easier to maintain, and reduces the chances of bugs.

Whenever you finish writing some code, it doesn’t hurt to look back to see if there is any way you can DRY it up, including using descriptive variable names and taking repetitive bits of code and refactoring them into a loop.

3 links you can’t miss:

  • Shopify POS Go - Shopify just released their first fully integrated mobile point-of-sale system that lets merchants accept payments and run their store from a single handheld device.

  • Koala Inspector - Ever wondered what theme or apps a Shopify store is using? This inspection tool can help you gain insight into how a store is built.

  • AniCollection - I’ve been playing around with adding fun animations to my designs. This collection is great for inspiration and I can easily add them using the AniJS library.

One app I like:

The days of dial-up internet are long gone. These days most people won’t wait for more than two seconds for a web page to load.

Unoptimized images are often the culprit behind a slow website.

The SEO, Speed & Image Optimizer app takes the hassle out of manually compressing and resizing your images by doing it for you automatically.

In addition, the app has other helpful features to improve SEO performance. You can edit Alt tags, optimize metada, fix broken links, and add JSON-LD to your store all in one place.

One learning as a freelancer:

We’ve all been there - Working on weekends, answering emails at all hours of the day, and having an unscheduled call interrupt our work. The solution? Setting boundaries around how and when you communicate.

I like to be upfront with my policies before any work begins. I let my client know my business hours, how quickly I will reply, and how they can contact me.

Whenever I struggle to set boundaries, I ask myself “What would another service provider do?” I wouldn’t expect a handyman I hired to be on-call 24/7 and drop their work with other clients to come and work on all the new projects I just thought up that day.

Why should it be any different for developers?

Setting boundaries not only gives you your time back but it also sets you apart as a professional.

Talk soon,