In this episode of Running in Production, Junaid Kabani goes over how he built and deploys Openship which is a Shopify app that was written in Koa. The front-end uses React.

We covered a lot of ground in this episode, such as how Prisma, Apollo, Next.js and React all come together to build an app that uses Shopify’s API. There’s also quite a lot of details on the value of testing and how CI helps keep open source projects well tested.

Topics Include

• 1:02 – Junaid was running his own online store before making this app
• 1:38 – Zapier and Google Sheets worked for a while but it wasn’t sustainable
• 2:12 – Shopify’s API has extensive documentation
• 2:47 – Drop shipping is a great way to test items before holding your own inventory
• 4:24 – A lot of these services are trying to compete with Amazon’s fulfillment service
• 4:37 – Openship lets you transition from drop shipping to having your own inventory
• 5:24 – Drop shipping and testing items is almost like pre-selling an app idea
• 5:28 – Junaid hired a contractor early on to help with anything he gets stuck on
• 5:41 – He didn’t have much luck with StackOverflow early on (I’m not surprised!)
• 6:19 – He paid about $500 to $1,000 while developing his project and it was worth it
• 7:03 – Motivation for using Koa and Node
• 8:13 – Shopify has official packages for Koa
• 8:41 – Shopify lets you write custom apps in a lot of different web frameworks
• 9:26 – There’s an Apollo server and a React front-end with Prisma handling the data layer
• 9:53 – The back-end and front-end are in their own separate git repos
• 10:11 – Trade offs between working with a mono repo and multi-repo set up
• 11:32 – Going into a bit more details about the back-end / front-end set up
• 12:36 – Websockets might be used later when an upcoming messaging system is in place
• 12:57 – The work flow for adding Openship to your Shopify app
• 13:10 – Dealing with returns is cumbersome with drop shipping
• 15:24 – High level recap of the work flow as a shop owner
• 15:42 – End customers who purchase items see the usual Shopify checkout work flow
• 16:39 – The marketplace aspect of Openship is very powerful and it’s competitively priced
• 18:25 – Private labeling is another feature that’s coming soon
• 18:53 – The marketplace is a separate Shopify shop that uses Shopify’s API
• 19:06 – The Shopify app is hosted on DigitalOcean using CapRover (self hosted PaaS)
• 20:04 – Prisma runs on its own server which contains the MySQL database
• 20:12 – The 2nd server hosts the back-end (web server) and front-end (React app)
• 20:32 – It was all hosted on 1 server initially but it kept crashing
• 21:19 – Prisma is an open source CMS for a bunch of popular databases
• 22:54 – You typically use tools like Apollo to limit access to Prisma
• 23:19 – The Apollo server prevents anyone from accessing your database
• 23:50 – What exactly is the Apollo server? It’s a GraphQL implementation
• 24:34 – Breaking down the layers of your database, Prisma, Apollo and your client
• 26:22 – Apollo helps deal with multi-tenancy concerns by letting you isolate users
• 27:06 – Openship doesn’t store any confidential info in their own database
• 27:55 – Access control between Shopify and Openship is handled with OAuth
• 28:34 – CapRover handles setting up a reverse proxy and setting up HTTPS
• 29:31 – Openship isn’t running in Docker but Prisma provided its own Dockerfile
• 30:35 – CapRover has a bunch of 1 click installers, one of which is for Sentry
• 30:54 – CapRover is only being used in production
• 31:42 – Postmark is being used to send transactional emails (free tier)
• 32:08 – Junaid pays about $10 to $20 a month for Zapier
• 32:33 – Zapier helps you glue together APIs from external services
• 34:28 – CapRover uses Let’s Encrypt under the hood for managing SSL certificates
• 34:37 – CapRover has a 1 click app on DigitalOcean so it’s easy to install
• 35:36 – DigitalOcean’s monitoring / alerts aren’t being used at the moment
• 35:59 – On the horizon Junaid may switch to using now.sh
• 36:20 – Should you go Serverless or stick with a more traditional app?
• 37:12 – Dealing with secrets and sensitive values when using CapRover
• 37:58 – The full break down of how code gets from development to production
• 38:34 – Running automated tests and the value of CI / CD
• 40:04 – Get a test suite up and running and then worry about CI
• 40:52 – TDD vs writing tests after you write your implementation
• 41:40 – Having a test suite really helps you refactor and improve your code later on
• 42:06 – The difference between testing locally vs using a continuous integration server
• 44:27 – The benefits of CI in an open source project for testing pull requests
• 45:14 – There’s no database backups in place because Shopify is the source of truth
• 45:58 – No health check services are being used but Junaid is using Openship all the time
• 46:42 – Uptime Robot’s free tier is very generous and it pings your site every 5min
• 47:53 – Best tips? Jump into the code, there’s a lot to take in but it’s manageable
• 48:25 – A bad decision beats indecision because you can fix bad decisions
• 49:08 – Junaid got this far with 1 year’s worth of experience which is very impressive
• 52:00 – Check out openship.org and its open source repo on GitHub

Links

• https://www.shopify.com/
• https://en.wikipedia.org/wiki/Drop_shipping
• https://www.shipbob.com/
• https://www.shipmonk.com/
• https://en.wikipedia.org/wiki/HMAC
• https://github.com/zeit/micro
• https://github.com/lerna/lerna
• https://en.wikipedia.org/wiki/Third-party_logistics (3PL)
• https://github.com/prisma-labs/graphql-yoga
• https://ifttt.com/
• https://zeit.co/home
• https://www.cypress.io/
• https://airbnb.io/enzyme/

• koa →
• node →
• react →
• apollo →
• prisma →
• caprover →
• digitalocean →
• mysql →
• nextjs →
• open-source →
• postmark →
• sentry →
• zapier →

• https://github.com/Shopify/quilt

Support the Show

This episode does not have a sponsor and this podcast is a labor of love. If you want to support the show, the best way to do it is to purchase one of my courses or suggest one to a friend.

• Dive into Docker is a video course that takes you from not knowing what Docker is to being able to confidently use Docker and Docker Compose for your own apps. Long gone are the days of "but it works on my machine!". A bunch of follow along labs are included.

• Build a SAAS App with Flask is a video course where we build a real world SAAS app that accepts payments, has a custom admin, includes high test coverage and goes over how to implement and apply 50+ common web app features. There's over 20+ hours of video.