Create an app quickstart

You're ready to create a new app. You want to set up your development environment so that you can start coding.

In this tutorial, you'll use Shopify CLI to create an embedded app using Node.js. Shopify CLI generates starter code for building your app and automates many common development tasks.

Scenario

You want your app to embed in the Shopify admin inside an iframe. Since this is your first time creating a Shopify app, you want to start with some boilerplate code that makes your programming experience easier and more efficient.

By creating an embedded app, you're able to add features to certain parts of Shopify’s user interface and online stores. You'll also deliver the best merchant experience because your app will be closely integrated with Shopify.

What you'll learn

After you've finished this tutorial, you'll have accomplished the following:

  • Set up your local development environment
  • Generated starting code for building your app
  • Installed your app on a development store

Screenshot showing a simple embedded app in the Shopify admin

Requirements

Step 1: Install Shopify CLI

Start by installing Shopify CLI on your computer. You can install Shopify CLI on Windows, macOS, or Linux. Use your computer's command line to install Shopify CLI from one of the supported package managers.

Step 2: Create a new project

After you've installed Shopify CLI, you're ready to create a new project.

Navigate to the directory where you want to create your project and run shopify node create. This command scaffolds a new Node.js app in a subdirectory and creates your app in the Partner Dashboard.

GIF showing how to create a project

Step 3: Start a local development server

After your app is created, you can work with it by navigating to your project directory and running shopify node serve to start a local development server.

Shopify CLI uses ngrok to create a tunnel that allows your app to be accessed using a unique HTTPS URL, which is mandatory when creating an app.

GIF showing how to start a local development server

Step 4: Install your app on your development store

With the server running, open the URL that your terminal printed out in the previous step. When you open the URL, you're prompted to install the app on your development store.

GIF showing how to install your app on your development store

You now have a development store running with your new app installed.

Next steps

  • Start building your app by populating data to test your app against, designing your user interface with Polaris, interacting with Shopify's APIs, and configuring a webhook so that your app stays in sync with changing data.