Shopify’s CLI is one of the most powerful tools to build Shopify apps.
Shopify CLI assists Shopify Partners with a variety of app-building tasks. It includes the creation of Node.js, PHP and Ruby on Rails apps as well as developing app extensions, themes and Shopify Scripts (currently beta).
Shopify CLI automates many of these tasks, which simplifies and shortens the process of app-building.
This guide will cover the Shopify CLI tasks and the benefits for app developers.
Shopify’s CLI is one of the most powerful tools to build Shopify apps.
Shopify CLI assists Shopify Partners with a variety of app-building tasks. It includes the creation of Node.js, PHP and Ruby on Rails apps as well as developing app extensions, themes and Shopify Scripts (currently beta).
Shopify CLI automates many of these tasks, which simplifies and shortens the process of app-building.
This guide will cover the Shopify CLI tasks and the benefits for app developers.
How to use Shopify CLI
Shopify CLI is an intuitive tool for app developers. Shopify and GitHub offer detailed tutorials at every stage of the process.
1. Installation
Shopify CLI is available for installation on many different operating systems. This can be done via your computer’s command line. This list contains all the software requirements.
2. Create a project
You will need to enter some information about yourself when you create an app in Shopify. Shopify will create your app via the Shopify Partners Dashboard.
This model is available on the Shopify website.
Shopify CLI will then create a tunnel with “shopify service” for you. Your app will now be accessible via the Internet via an “https” port. This is required for Shopify to authenticate. This will tunnel your app with ngrok and also run your local development server.
3. Testing App Population
How do you tell if it is working?
Shopify CLI includes a test function that allows you to populate your app only for testing purposes. You can select to populate your app using the Shopify CLI command “shopify populate”.
4. Deployment
The “shopify deploy command” deploys your app on external platforms. Heroku is currently the only external platform that’s available, but there are many others in development.
Shopify’s Shopify CLI for Apps: How Shopify Built It
Shopify has many tools that allow its partners to create apps for the Shopify App Store. This is just one reason we recently stated that it’s better to create apps for Shopify than WooCommerce.
Shopify has used Ruby, Go, Node and Go in some of its command-line tools. Shopify chose Ruby because of the following reasons.
- Ruby is easier to use than Go.
- Even though Node-based tools have great libraries for writing CLIs (yargs and ink), it can be hard to manage paths or install them.
- Shopify Partners would find it harder to contribute to the tool over the long-term if they were to go.
- The Shopify developers are familiar with Ruby and have created the CLI–kit framework and CLI–UI collection of command-line UI patterns using Ruby.
Shopify CLI to create themes
Shopify Partners now have access to Shopify CLI for apps that can safely download, develop, preview and test changes in development themes. You can instantly see the changes as they are made, and you can even preview them. Once you have the theme ready, you can push it and publish it directly from your command line.
CLI can be used in conjunction with Shopify GitHub integration for version control of any themes you are developing. This tutorial explains how it works.
What Shopify CLI commands are available?
Let’s look at some of the functions available in Shopify CLI. The following commands will be available once you have created a Node.js application:
- Connect: This connects an existing project with a Shopify Partner organization or store. It will update or create the.env file, and the.shopify.yml file.
- Use: Shopify Connect
- Create: This will create an entirely new project.
- rails ]
- Logout: This will log you out of an authenticated Shopify Partner store / organization, or remove invalid credentials
- Use: Shopify Login
- Version: This will print version number.
- Use: Shopify Version
- deploy: This will move the current Node project onto a hosting server. Shopify will add more options in the future.
- Usage: shopify deploy [ heroku ]
- generate: This will create code in your Node projects. This allows you to generate new billing API calls, pages, and webhooks.
- Usage: shopify generate [ billing | page | webhook ]
- open: This will open the local development app in your default browser.
- Use: shopify open
- populate: This will populate Shopify’s development store with examples of customers, orders, and products.
- draftorders
- Serve: This will create a local development server for your project, and a public tunnel to your localhost.
- Use: shopify serve
- tunnel: This will either start or stop an http Tunnel to your local development application using ngrok.
- start
Shopify CLI allows you to create Shopify themes and apps from a command line interface. It generates Node.js and Ruby on Rails apps as well as app extensions and Shopify themes. It can also be used to automate common development tasks.
This document explains how Shopify CLI can be used for theme development.
Shopify CLI or Theme Kit: Which one should you choose?
Shopify CLI is the replacement for Theme Kit in most Shopify theme development tasks. If you are working on Online Store2.0 themes, Shopify CLI is the best option. If you are working with older themes, Shopify CLI should be replaced by Theme Kit.
Features
Shopify CLI speeds up your theme development process by providing the following features:
- You can preview, test and share your changes to themes with development themes
- When previewing a theme, hot reload CSS or section changes. Or automatically refresh a webpage on file change.
- Start a new theme with Dawn.
- Push and publish themes directly from the command line
- Run Themecheck on your theme
- Test data can be created for your theme. This includes customers, products, and draft orders.
Themes for development
The Shopify development theme is a temporary hidden theme that can be connected to the Shopify store you are using for development. You can connect your theme with a store to use the data from that store for local testing.
A theme serve command can be used to create a theme for development.
Shopify stores and development stores can both use development themes. The store will remove development themes after seven days without any activity. They don’t count towards your limit.
When you run shopify logout, your development theme will be deleted. If you would like a preview link to the theme that you can access after you logout, push your theme to an unpublished theme in your store.
These tasks can be performed by your development theme:
- You can see the changes happening in real-time to a local theme you are developing
- Shopify admin theme editor allows you to customize and interact with your theme.
- With other developers, share a password-protected preview version of the theme
Installation
Install Shopify CLI explains how to install Shopify CLI for Windows, macOS and Linux.
Getting started
To learn more about topics such as:
- Shopify CLI Requirements
- Connecting to a Store
- Create a new theme
- A preview of a theme
- For errors, check a theme
Directory structure
Certain theme commands can only be run, such as shopify theme serve. This is because the directory you are using must match the default Shopify theme directory. This structure is a “buildless” theme. It means that the theme has been through all necessary file conversions. You might have to execute commands in the directory that contains the generated theme files if you are using build tools to create them.
Shopify CLI files excluded
You can add files to the .shopifyignore to the root theme if you don’t want them to interact with Shopify CLI.
.shopifyignore allows you to refer to files in these formats:
- Simple file names:
templates/product.temp.json - Wildcards:
config/*_secret.json,*.jpg - Regular expressions: code >/\. (txt|gif|bat)$/
You can also exclude certain files or patterns from a push, pull by using the -ignore flag. .shopifyignore can be used to exclude files. Both the .shopifyignore content and the --ignore flag will be respected.
