How to Use Shopify CLI for Theme and App Development

|
A Shopify ecommerce store built with CLI.

Developers are continuously seeking new tools to keep up with and thrive in the robust Shopify ecosystem. A very powerful command-line tool that streamlines and accelerates Shopify theme and Shopify app development is Shopify CLI. 

If you are looking to create custom storefronts or create new apps to extend the Shopify ecosystem, Shopify CLI can do wonders for you. Shopify CLI commands are easy to learn, so it doesn’t matter if you are a seasoned pro or a beginner; it is your gateway for robust and efficient development.

In this blog, we will walk you through how you can effectively use Shopify CLI for the development of Shopify themes and Shopify apps. You will also get to see how it integrates with the Shopify ecosystem. We will see some essential Shopify CLI commands along with some professional tips to boost your development process.

Why Should You Use Shopify CLI?

To further enhance the Shopify ecosystem, Shopify CLI was designed by Shopify to enable engineers to develop and deploy Shopify themes and apps. Shopify CLI enables:

Rapid App Development: With live loading enabled, users can see their changes instantly and make necessary adjustments at run time.

Seamless App Scaffolding: With pre-configured templates, users can set up their Shopify app quickly.

Easier Authentication: Developed with our own Shopify tool, users can connect to a Shopify store instantly.

Automated Workflow: Developers can automate repetitive tasks directly from their terminal, from testing to deployment.

By simply using your command line, you can create Shopify themes and Shopify Apps faster by reducing manual operations.

Installing Shopify CLI

Here is the process of installing Shopify CLI for macOS/Linux and Windows.

macOS/Linux

bash
brew tap shopify/shopify
brew install shopify-cli

Windows

Access PowerShell or WSL on Windows and add the following commands.

bash
Npm install -g @shopify/cli
Verify Installation
bash
Shopify version

If your Shopify CLI was installed correctly, then you would get its version in return.

Authenticating with Shopify

After the installation, the next step is to authenticate your Shopify CLI with your Shopify store. You can do that with the following command.

bash
shopify login – store YOUR-STORE-NAME.myshopify.com

This command will open your default browser’s window, and you need to enter your login credentials here. After successful authentication, you can now manage your Shopify themes and Shopify apps right from your command line window.

Theme Development Using Shopify CLI

You can do a lot of stuff related to theme development from your Shopify CLI commands. Following is the breakdown of different theme development commands and what they do.

New Theme Creation

To create a new Shopify theme, enter the following command in your command line:

bash
shopify theme init [THEME-NAME]

Now you have started the theme, coupled with all the necessary files.

Opening Existing Theme

If you have some existing theme that you need to work on, then entering the following command will pull it.

bash
shopify theme pull

Now you have theme files downloaded right from your Shopify store.

Starting Development Server

Enter the following Shopify CLI command to launch a development server with live reloading.

bash
shopify theme deve—store YOUR-STORE-NAME.myshopify.com

The best thing about this is that you can see your changes in real time in your browser, which makes the development process fast and error-free.

Deploying Your Theme

Once you are satisfied with your Shopify theme, you can deploy it using the following Shopify CLI command:

bash
shopify theme push

To make your theme live, enter the following command:

bash
shopify theme publish

Useful Shopify CLI commands for Shopify Themes

Shopify theme init: To create a new theme

Shopify theme pull: To download the existing theme

Shopify theme dev: To start the development server

Shopify theme push: To upload all the changes to Shopify

Shopify theme publish: To make your themes live

App Development Using Shopify CLI

The Shopify CLI is also a great tool for Shopify app development. Shopify CLI commands for app development are given below.

New Shopify App Creation

The following command creates a new Shopify app that has a default structure.

bash
Shopify App init [APP-NAME]

Running your Shopify App locally

You can start your local development server with the following command:

bash
Shopify App dev

This will automatically open the browser and will install the app on your dev store.

Deploying Your App

You can deploy your Shopify app using the following command:

bash
Shopify App deploy

This command packages and pushes your Shopify app to Shopify’s servers.

Useful Shopify CLI commands for Shopify Apps

Shopify app init: To create a new app

Shopify app dev: To start the development server

Shopify app deploy: To deploy the Shopify app

Shopify app info: To display the app’s details

Some Advanced Shopify CLI Commands

To help you develop your Shopify store like a pro, following are some advanced Shopify CLI commands.

Generating API Credentials

Bash
Shopify App connect

This command will link your local app to Shopify’s API and is essential for deploying and managing your app.

Managing Extensions

Bash
Shopify extension create

This command will enable you to add the UI extensions.

Debugging

Bash
Shopify App logs

This provides you with the real-time logs to help you in the debugging process.

Pro Tips for Working with Shopify CLI

To help you develop like a pro using Shopify CLI, here are some pro tips that can come in handy.

Version Controlling: Make use of a Git repository for storing your Shopify themes and Shopify apps. This will help you with version control and will also enable you to collaborate more effectively.

Testing in the Development Store: Testing your changes in the development store first before deploying to the live store helps you in better quality control.

Automation With Scripts: By coupling shell scripts with your Shopify CLI commands, you can automate tasks like pulling, pushing, and deploying.

Shopify Themes and Apps Together: While working on complex projects, you can combine Shopify themes and Shopify apps to develop seamless storefronts with an engaging user interface.

Always Stay Updated: Shopify is always rolling out new updates, so make sure to stay updated. You can use the Shopify upgrade command to update.

Multiple Store Management: If you own or manage multiple stores, then you can shift between them quickly using the commands Shopify logout and Shopify login—store your-store.myshopify.com.

Common Shopify CLI Errors and Solutions

Here are some common errors that beginners make on Shopify CLI and how you can correct them.

Authentication Error: For any reason, if you fail to log in, then clear your CLI cache and try to log in again.

Theme Push Error: When encountering a theme push error, make sure that you are targeting the correct store and theme ID. You can also use the Shopify theme list to keep track of your available themes.

App Development Issues: For app development issues, verify your app’s configuration in shopify.app.toml. Also, verify that ngrok is running for your local testing.

Shopify CLI vs Shopify Admin Panel

The Shopify admin panel is very user-friendly, but if you want to work like a professional with speed and control while harnessing the power of automation, then Shopify CLI should be your go-to choice. Here’s how Shopify CLI outshines the admin panel when it comes to agility and robustness.

Theme Editing: While the admin panel enables you to do it manually, Shopify CLI offers instant sync and preview options.

App Development: The Admin panel offers limited app development options, while Shopify CLI offers full-stack generation.

Deployment: With the Admin panel, you do a multiple click-based deployment, but with Shopify CLI, you can do it with just one command.

Automation: Automation is not supported by the admin panel, but with Shopify CLI, it is completely scriptable.

Mastering Shopify CLI: Key Takeaways

For professional and agile Shopify app and theme development, Shopify CLI is a must-have tool in your shed as a developer. Having a full command of Shopify CLI enables you to streamline your development, avoid repetition, and automate your tasks within the Shopify ecosystem. This allows you to focus more on the innovative aspect of your development rather than the setup process.

If you are planning to work with Shopify for the long term, then you should start integrating these Shopify CLI commands in your workflow today. Try all the commands explained in this blog for the Agile Shopify theme and Shopify app development.

Get professional Shopify development services that can scale your online sales to new heights. Contact us today.

Share This Article