What’s your development workflow for Shopify 2.0?

[Ketan_Mistry]

With the arrival of Shopify 2.0, it’s now thrown my development workflow out of the window. The `config.yml` made development much more manageable when working on different store features because it linked directly to a particular theme and excluded any changes made to the `settings_data.json` file. But, the new CLI seems to add extra complications to the workflow by requiring frequent pulls and pushes.

Here’s my typical development workflow for version 1 themes:

1. Do `theme download` to get the latest changes from the live theme
2. Pull from main and checkout a new branch
3. Log into Shopify store admin
4. Duplicate the published theme
5. Rename the duplicated theme to the name of your branch
6. Click “Customize Theme” of your new branch theme
7. Note the theme ID in the URL (example: /admin/themes/9542224/settings)
8. Edit the theme_id in config.yml to point to your branched theme
9. theme watch and do your work
10. Preview your work by navigating to that theme in Shopify admin and clicking preview
11. Create Pull Request
12. Merge PR to the main repo
13. Delete your branch (local and server)
14. Delete your branched theme in Shopify Admin
15. And then for deployment:
1. Make sure to kill your local theme watcher
2. Remove your theme ID (to point it to the published theme)
3. Create a backup of the existing production theme (by duplicating it)
4. Use `theme deploy` to push master onto the primary theme.
5. Tag the release in Github.

As you can see, this was a simple workflow that allowed for features to be worked on by different devs using different theme instances. I frequently work on dev environments and then deploy the new features to production stores (i.e. they're both separate stores), so this workflow worked perfectly because of config.yml.

I’ve been working on a couple of 2.0 sites recently and am starting to find the push, pull and serve methods to be cumbersome. There have been occasions where I’ve accidentally reset some of the section settings data because I forgot to do a pull first or changed some code. This seems to be the main issue for me.

It would be good to get an idea of how other devs are managing their workflow. What is your development process for 2.0? Have you managed to get around the section settings data issue? And, how have you managed deployments between dev and live environments when they are two separate stores?

[eballeste1]

I haven't started using the new CLI/Github integrated workflow yet but I read somewhere that changes to the theme via the theme/code editors would automatically push said updates to your main branch in github. If this is true, shouldn't your git tool of preference have some way of telling you that your local main branch is behind the remote main branch? If working strictly from your CLI I guess you'll just have to make it a habit to always pull from remote main before pushing your dev branch to github.

[Ketan_Mistry]

So, I've linked both the live store and development store to Github, each with their own branch. So far it seems to be working okay with settings data being synced within their own branch, but it does produce some merge conflicts between the two branches which all seem to be caused by the section data within the json templates.

I think it'll be some trial and error, but the Github way seems to be the best method. It would be nice if the section data was stored in separate files so they could be ignored though.

[iambrianclark]

I've gotten to the point that I have a shop-dev git repo theme which I use for all dev.

1. Start by doing a shopify theme pull of the live theme before making any dev changes (I'm usually the only one making any changes, but this is helpful if anyone went in and made any theme customizations).
2. Make any changes I need via local dev theme (shopify theme serve)
3. Do another shopify theme pull of the local dev theme if I made any theme customizations.
4. Push changes to git repo to update my shop-dev repo
5. shopify theme push to the live theme

I started with a shop-dev and shop-production git branches, but like others have said the merge conflicts due to shopify's automatic pushes made it too annoying to manage, so I have an unlinked production theme as my live theme and use github for my dev theme only.

Hope that helps!

[Ketan_Mistry]

Hi @iambrianclark, yes that's what I have ended up doing too. Although, I connected Github to the live store so that I always get a fresh copy of any settings data before creating a new feature branch from it. Then I serve/push to the development store.

So far, so good!

[ed_meehan]

Are there any resources related to the work flow described here. Starting to work with a 2.0 theme and there must be a best practice for this.

[Ketan_Mistry]

It's best practice to link the store's theme up with GitHub which will make it much easier to work with. Then use the Shopify CLI to fire the store and theme up locally on your pc/mac without affecting the live store.

https://shopify.dev/docs/themes/tools/cli