Integrating GitHub with Your Shopify Store

In the short falls of complexity faced in Shopify theme management and version control, if you also find it annoying to use the basic version control given in Shopify to keep the track of changes or

duplicate the theme for development purpose or making more than one copy of theme because both you and your fellow developer need to work simultaneously.

Integration of Shopify with GitHub provides unparalleled benefits, for version control and collaboration. Connecting Shopify stores with GitHub repository allows us to leverage Git-based version control system which allows developers to track changes and collaboration. Multiple developers can work on different features or fixes simultaneously, and Git helps merge their changes together without conflicts, one can also ensure code quality before deploying changes to the live store. By following these easy steps, you integrate your Shopify Store with GitHub –

Create a new repository on GitHub 

Create a GitHub Repository for your Shopify Project

Download theme file from your store

Shopify allows you to download your store's theme files as a ZIP.

In your Online Store, click on the action icons and Select the download them file, this will send a zip file to your mail.

Download the zip file from your mail address, then extract it to a folder. Push the files to your repository. Make sure to follow the proper file structure of theme i.e 

In your Online store, navigate to Add theme button and select the option ‘connect from GitHub’ –

On clicking on the Add theme button, you’ll get options whether to visit Theme Store or Upload Zip file, the third option would be that of connect from GitHub.

Click on Log in to GitHub Next, and choose your account to continue with Shopify-GitHub Integration

After choosing the account, the next step would be to choose whether to give Shopify access of all the repositories or selected repositories only, it’s totally up to your store requirements whether you want to give access to a few selected repositories or all. 

After Selecting repositories, click on the install button. After completion, you will be able to see on the side window your GitHub Account being displayed along with the option of selecting the repository.

Select the repository that has your theme files and the branch that has your latest code and click on the connect button. After clicking, it will show you a tick mark and in the Theme library section, you can see your theme file being uploaded to your store.

And now you finally have your Shopify Store Integrated with your GitHub account

On clicking on view logs, one can see recent theme logs

Also on GitHub, in your repo you’ll see a Shopify Bot section on heading, clicking upon which you can see all the recent changes on your theme –

Now, lets look at a scenario where different developers are working on different feature and they pushed their codes to their respective branches,

Here we can, make pull request to merge the branches to the master branch(i.e. the one which is integrated with shopify)

Based on the changes, github will either automatically merge or in some cases, notify us that there are conflicts that need to be resolved manually. which one can resolve by reviewing the conflicting lines of code and deciding how to reconcile them with the changes in the pull request.

After successful merging one can see the code that has been implemented now in the master branch itself and now automatically reflecting in our shopify theme.

Conclusion

Connecting your Shopify store with GitHub allows you to leverage version control system, It makes it easy for multiple developers to work on different features or fixes simultaneously say in separate branches, and then Github helps in merging or rebasing their changes to the master branch (i.e the branch that is integrated with shopify) making the development and edits on a theme a hassle free task. By following the above given steps you can easily integrate your Shopify store with GitHub.