Developing Your First Shopify App: 4 Mistakes to Avoid

Developing your first Shopify app is exciting and you’ll definitely learn a lot in the process. That said, you are probably going to make some mistakes and experience some setbacks along the way. But what if you had a cheat code that would help speed up the time from your first code commit to getting your app accepted and launched on the Shopify app store? Check out today’s article where Shopify Partner, Beacons, shares the four mistakes they made while developing their first Shopify app, and what you can learn from them to get your app reviewed and approved faster.

Eleanor Roosevelt once said: “Learn from the mistakes of others. You can’t live long enough to make them all yourself.”

Luckily for all you first-time app developers out there, we made many mistakes as we developed our first Shopify app. To save you some time and frustration, we’re sharing what we learned so you can build your own app more efficiently, and launch it sooner.

This was our first time building a Shopify app, and it took us about two months to go from our first code commit to getting our app accepted. Even if you’re a first-timer like we were, we think you can do this in half the time.

Here are the four mistakes we made (and learned from) as we developed our first Shopify app.

1. Keep it simple: build a MVP

Everyone knows this one already, but somehow it still tripped us up. Build a minimum viable product (MVP) and ship it.

"Build a minimum viable product (MVP) and ship it."

Your first submission to the Shopify app store doesn’t need to deliver 100 percent of your product vision. It doesn’t even need to deliver 50 percent of the value you’ll be providing to merchants a month from now. The most important thing is to build a MVP that is at least somewhat useful to merchants, get it accepted, and then rapidly improve it.

What we did

Our first submission contained a bunch of cool but half-baked features that weren’t strictly necessary. And, more importantly, they didn’t completely work. In each subsequent submission, we stripped out more unnecessary features. These extra features were barriers to us getting accepted quickly and ultimately slowed us down.

For example, our initial submission had an extra tab called "Analytics" that wasn’t immediately relevant to the core value of our app. Instead of spending time to debug it, we ended up removing it so that we could keep moving forward. In the end, we submitted the app a total of six times (including some automated rejections) before we were accepted!

In the weeks after our app was accepted, we re-added a couple of features that we stripped out, but there are several other features we haven’t re-added and maybe never will. The time and effort we spent developing those features clearly could have been better spent elsewhere.

What you should do

Be super careful to avoid feature creep. Keep in mind that your app doesn’t need to go through the review process again after it’s accepted (except in rare cases). You can make changes to your app and app listing at any time, and unless something goes really wrong, your Shopify app reviewer will do everything they can to support you along the way. They’re there to help you!

Just get something moderately useful accepted, then improve it quickly with feedback from early users. 

Pro tip: Be sure to talk to real merchants from the beginning—you’ll quickly discover much better ideas than you’re able to brainstorm within your team.

You might also like: Using Shopify App Bridge to Build Faster, More Functional Apps.

2. Test your app—and not in production!

A lot of early-stage startups and app developers get in the habit of pushing code directly to production and fixing bugs on the fly. After all, your app probably isn’t that critical and, even if it is, you probably don’t have a ton of users yet anyway.

This “YOLO” (you only live once) approach doesn’t work so well when you’re building on someone else’s platform. Before you can get your code in front of real users (who currently do your QA for you), you’ll have to get it approved by a professional app tester!

What we did

Before building our Shopify app, we had some experience building the Beacons web app, and we did about the same level of testing for our Shopify app submission that we were used to doing for our own app. As we developed our Beacons app, we would implement and test new functionality in parallel, write some unit tests and make sure that they passed inspection, and then push the new features out to all of our users. If anything broke, we would fix problems on the fly. Usually, we could fix things before too many people noticed.

With our Shopify app, no real merchants noticed our mistakes, because they never had a chance to—any mistakes were caught by our Shopify app reviewer, and our submission was rejected before it ever reached any users.

What you should do

After our third rejection, we sat down as a team and tried to reverse engineer the process that our Shopify app tester was going through to test our app—surely they weren’t just going about it randomly.

As you develop your app, put together and continually add to a rigorous checklist for fully testing all of the app’s functionality. At a minimum, this checklist should include all of the relevant requirements for public apps. If anything is unclear, try checking the Shopify forums—we used the APIs & SDKs forum to get answers to several of our questions.

Create and follow a testing checklist

Creating a testing checklist is important because it helps to flag any missed steps in your testing process and it highlights areas in your app that need revising. We created a checklist that included how-to videos so it was easy to follow the instructions.

Here’s a sample checklist that you can use as a guide when creating your own testing checklist and the testing instructions that you send to the Shopify app reviewer. Make sure you modify it for your own app!

1. Install your Shopify app on a store that you can control. Make sure that the store has some products enabled.
2. Enable payments for the app and approve the charges.
3. Upon entering the app, go to the Products tab and try toggling a product to enable it. (Our app is a sales channel, so any products that we enable will become available to this sales channel.)
4. Next, go to the Settings tab and make sure that the publishing status shows that one product is enabled.
5. Check to see if there are any product errors, they will also appear in the Settings tab.

Make sure you thoroughly test installing, uninstalling, and reinstalling your app, as this tripped us up several times. Below is a screenshot from our second-to-last rejection, where our app reviewer caught a bug when installing it on a new store but with the same email:

Required changes

1. When testing the features of your app I encountered a functionality error. Please view this screenshot for additional details. In this video you can see that I installed your app to store "testystuff66" this install and your app is only pulling data for my last review install to store "testystuff16". Both stores have the same email address, but are different stores with different staff and products. Please address. As a result of this error I wasn't able to finish the full review of the app as I couldn't follow the order back to my store. Please resubmit, again this is a great product.
2. Approval or rejection is communicated to merchants via a green or red banner component. Keep in mind that merchants have a very wide variety of product, you will want to add this for specific product types should they not meet your requirements.
3. As of March 2020, all sales channels (with the exception of mobile app builders) must have the "read_only_own_orders" scope applied. The "read_only_own_orders" scope is added by the review team during the approval process and ensures that a channel can only read the orders it created. Please let us know if your app is ready to have this flag added or if you need more time. This flag will be added at the end of the review process right before going live.

Depending on your team’s existing habits, this might require a mindset shift and will feel like you’re slowing down at first. Be patient: go slow now so you can go fast later.

"Be patient: go slow now so you can go fast later."

3. Get to a human app reviewer as soon as possible

The early stages of the app review process can seem opaque and feel demoralizing. It can feel very stop-and-go: a couple days of working hard and feeling like you’re making progress quickly, followed by a couple days of waiting, and then getting rejected with only a few bits of feedback. Often, the feedback might not even be about the core functionality of your app, but instead some small but critical bug that prevented payments from working or pages from loading.

What we did

For us, the early stages of the app review process were a repeated loop of: 

• Submit our app
• Wait a week
• Get rejected with a couple sentences of feedback
• Implement the feedback
• Resubmit our updated app

Each time we were rejected and received feedback, we would immediately meet with the whole team, figure out a game plan for responding to the feedback, and then get to work implementing it. As mentioned in the previous section, our process for fixing, testing, and resubmitting became more rigorous as we learned with each rejection.

"Each time we were rejected and received feedback, we would immediately meet with the whole team, figure out a game plan for responding to the feedback, and then get to work implementing it."

Near the end we started including Loom videos that walked through our app with each submission to make it easy on the reviewer—I would highly recommend doing this!

You might also like: How to Choose the Right Pricing Model for Your App.

What you should do

When you get close to approval, your rejection comes with more detailed feedback, and you’re given the option to email your reviewer directly. This is motivating, and it tightens the feedback loop. Try to get to this point as soon as you can by following the advice in the first two steps of this article! This is where you’ll get the most valuable, in-depth feedback in the review process.

Huge shout out to our reviewer Ivana—she was super encouraging (once we could talk to her), and worked hard to help us get across the finish line. Even after our app got accepted to the Shopify App Store, she’s been more than willing to offer feedback, and makes it feel like we have our own guardian angel at Shopify.

You might also like: How to Get More App Downloads in the Shopify App Store.

4. Separate staging and production

Every time you submit your app for review, Shopify will warn you not to make changes to the version that’s under review. This is to make sure you don’t break anything that a Shopify app reviewer is currently looking at. 

Review periods are basically out of your control, and there are probably parts of your app that still need work. So, how do you keep making progress?

What we did

We eventually solved this problem by setting up a separate staging environment where we could continue to make improvements while the production app was under review. We did this by hosting two separate apps—one in staging, and one in production.

While our app reviewer was reviewing the production version of our app, we were able to fix small bugs and continue refining existing features by working on the staging app. 

What you should do

There might be more sophisticated ways to keep making progress by using feature flags or other techniques. We’d love to learn how more experienced dev teams do this, so please leave a comment and share your knowledge!

Pro tip: Stick mostly with the tools that you know. Our team was most comfortable building using React and Python. Luckily, Shopify has a lot of support for React, including a design library: Polaris. Using Polaris saved us the effort of thinking about laying components out and making sure that they had visual synergy. 

Additionally, we could leverage several of the dev processes and tools we had already: code review, CI/CD (thank you GitLab), PostgreSQL, Firebase, and our own version of the Agile process, allowing us to stay in sync and build quickly.

Enjoy the process

🥳 Finally got our Shopify app accepted today after over a month of rejections and resubmissions! Reminded me of submitting papers during phd lol 😅

Here's a thread of some mistakes we made and things we learned that hopefully will be helpful to other @ShopifyDevs

— Neal Jean (@nealjean1) June 10, 2020

As first-time Shopify app developers, we went into the process excited, but feeling a lot of uncertainty. You’ve probably asked yourself many of the same questions that were running through our heads (or are asking yourself these questions right now): 

• How long is the app review going to take? 
• Are the reviewers going to be mean? 
• What if we make too much money and Shopify doesn’t like us? 
• How do we get Shopify to like us?

Looking back, we didn’t really need to worry about any of this. Unlike some other platforms (not naming any names), Shopify is very supportive of their ecosystem and actively works to make sure their partners and app developers are successful. 

Our Shopify app reviewer Ivana even spent time on video calls with us after our app was accepted to give advice on how we can improve the app.

All in all, the Shopify app submission process is relatively efficient, and there’s a lot that you can do to help yourself speed through the process—including following the advice above!

As for us, our app has been live on the Shopify app store for a couple weeks now and we’ve been busy improving the app for our early users. We’re making fewer mistakes now, and hope that you will too after reading this.

Remember: “Only a fool learns from his own mistakes. The wise man learns from the mistakes of others.”