Home / Shopify / The best Structure for Shopify Projects
1 February 2022
The best Structure for Shopify Projects
ThemeKit is a cross-platform command-line tool that you can use to build Shopify themes.
Initially, after we start creating the project in Shopify, we create an API that allows us to communicate the project file locally. We do this through the Themekit platform.
ThemeKit is a cross-platform command-line tool that you can use to build Shopify themes. Through this platform, we take the project locally and connect it to the API that we create in the project’s Private app.
To download a specific theme, and create the config.yml file that connects this theme with a local version in the directory you just created, run the following command:
theme get --password=[your-password] --store="[your-store.myshopify.com]" --themeid=[your-theme-id]
Once the project is downloaded in the local version, we create a Repository on Github and also link it to the previous project. The reason we do this is that Github enables us to back up Files for any changes we have made. The advantage of this is that through Github, more than two people at a time can work, where there can be no file conflict and where the work of each can be easily managed.
Once we have installed the NPM platform, we continue with The theme watch command instructs ThemeKit, to check for any changes made to your local files. This procedure automatically pushes changes to your theme in the connected Shopify store.
theme watch –allow-live
After we have created the project in Shopify and also connected it to Github, we start installing some frameworks that we use in many projects which enables us to work easier and with professionalism. Additionally, these frameworks enable you to best facilitate your work, which will surely affect your time-saving. Some of them are:
· Tailwind CSS
· Alpine JS
· Swiper JS.
All these frameworks are installed with a very simple command by adding only the word “npm install”, prior to the things we want to install, e.g.:
npm install tailwindcss
npm install alpinejs
npm install swiper
Examples: in the mix.styles section we have decided that all CSS files ex: application.css, custom.css, and swiper-bundles.min.css be processed into a single file called “main.css”.
If you want to know more about e-commerce development platforms or apps, read our blog posts for Shopify and Shopware. Our dedicated outsourcing team can be your collaborator in ecommerce.