/shopify-app-template

🧩 Shopify App Template (Node) with TypeScript and Prisma.

Primary LanguageTypeScriptMIT LicenseMIT

Shopify App Node with TypeScript

License: MIT

Warning This is an old CLI2.0 template and is no longer being maintained. New template with CLI3.0 can be found here, https://github.com/SaeedYasin/shopify-app-template-node

This is a sample app (with TypeScript) to help developers bootstrap their Shopify app development.

It leverages the Shopify API Library on the backend to create an embedded app, and Polaris and App Bridge React on the frontend.

The original template (with JavaScript) is Shopify/shopify-app-template-node that is used when you create a new Node app with the Shopify CLI.

Requirements

Quickstart

  1. Clone the repo
npx degit SaeedYasin/shopify-app-template shopify-app-ts
  1. Create Shopify app
shopify app create node

Then copy .env file to the typescript project and remove the one you just created.

  • Or you can do it in the Shopify Partner Dashboard and then filling .env file with app's credentials (see .env.example).

Note: HOST value will be auto-filled when you run the app.

  • Add your database connection URL as well in .env for DATABASE_URL env variable.
  1. Go to your app's directory and install packages
cd shopify-app-ts && pnpm i
  1. Run the app
shopify app serve

Install and start using the app by opening provided URL in your browser: https://some-ngrok-subdomain-xxxx.ngrok.io/login?shop=your-shop-name.myshopify.com

Deployment

Every time you work on your development app, you can just follow the workflow described above, and when you are ready to push your changes to production, you will simply need to commit and push your changes to Github as normal, and your hosting service maybe can pick up these new changes and push to your app and deploy the new changes to your hosted app.

This means, one code base but 2 apps, this is the most common workflow used by App Developers. 🎉

Thanks to kanzitelli and Jonathan Giardino shopify app starter template for many of the ideas and code samples used in this template.

License

This repository is available as open source under the terms of the MIT License.