We’ve enjoyed building a Shopify application for our client https://imageengine.io/ for which you can find more details here if you have
The problem?
Create an application that would override the “https://cdn.shopify.com/” with a custom “ImageEngine” proxy cdn.
The implementation
PHP 8.1
MySQL
Symfony 6.2
Shopify API
Bootstrap
Docker
Have a look over the resulting application
Shopify application when in guest mode
Shopify application useful pages (uninstall and About ImageEngine)
After you install the application from Shopify store
- You have to create an account on the ImageEngine website.
- You have to get the new ImageEngine origin and save it in the main address input.
- Once that is saved you will get to the next step.
You can see in the “select the theme you’d like ImageEngine to be installed on” – all the owner’s store themes are retrieved from the admin. That’s happening at any time. The app will be aware of any changes made.
The magic is under the hood of course
How does it work, you would ask? Well, the application uses the Shopify Admin API in order to retrieve the store themes, published and unpublished, and update it files, in a short sentence.
In detail, things are a bit more complex. First of all, we need to know that a store theme can have 2 files or can have 300 files. Depending on how big the store is. This requires a special implementation on the backend side. So each file is checked if it has assets that need to have the CDN changed then we add them to a queue and process them asynchronously one by one.
Finally, we display the status to the user that the theme is “INPROGRESS” of being overwritten then it will display “DONE”.
