Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/kyrelldixon/shopify-demo-app-hooks

The Shopify Demo App with React Hooks
https://github.com/kyrelldixon/shopify-demo-app-hooks

koa nextjs react shopify shopify-app

Last synced: 2 months ago
JSON representation

The Shopify Demo App with React Hooks

Host: GitHub
URL: https://github.com/kyrelldixon/shopify-demo-app-hooks
Owner: kyrelldixon
Created: 2020-03-16T17:31:54.000Z (almost 5 years ago)
Default Branch: master
Last Pushed: 2023-01-07T16:00:43.000Z (about 2 years ago)
Last Synced: 2023-03-08T00:54:33.763Z (almost 2 years ago)
Topics: koa, nextjs, react, shopify, shopify-app
Language: JavaScript
Homepage:
Size: 1.71 MB
Stars: 15
Watchers: 2
Forks: 4
Open Issues: 14
Metadata Files:
- Readme: README.md

Awesome Lists containing this project

README

# Shopify Demo App with Hooks

[![License: MIT](https://img.shields.io/badge/License-MIT-green.svg)](LICENSE.md)

This repository contains a modified version of the completed app for the [Build a Shopify app with Node and React](https://developers.shopify.com/tutorials/build-a-shopify-app-with-node-and-react) tutorial. The original repo can be found [here](https://github.com/Shopify/shopify-demo-app-node-react/).

## Changes from the original

I made a few changes to the code as I walked through the tutorial. The main modifications are:

* Using only React hooks for components
* Modified `package.json` scripts
* Simpler `next.config.js` file
* Using hooks for Apollo mutations and queries

## Shopify tutorial setup for demo app

If you plan to use this completed app, then make sure that you first complete these setup instructions:

1. [Install the latest stable version of Node.js.](https://developers.shopify.com/tutorials/build-a-shopify-app-with-node-and-react/set-up-your-app#install-the-latest-stable-version)
2. Install npm packages (run: npm install).
3. [Expose your dev environment.](https://developers.shopify.com/tutorials/build-a-shopify-app-with-node-and-react/embed-your-app-in-shopify#expose-your-dev-environment)
4. [Get a Shopify API key and Shopify API secret key.](https://developers.shopify.com/tutorials/build-a-shopify-app-with-node-and-react/embed-your-app-in-shopify#get-a-shopify-api-key)
5. [Add the Shopify API key and Shopify API secret key.](https://developers.shopify.com/tutorials/build-a-shopify-app-with-node-and-react/embed-your-app-in-shopify#add-the-shopify-api-key)
6. Start your app (run: npm run dev).
7. [Authenticate and test your app.](https://developers.shopify.com/tutorials/build-a-shopify-app-with-node-and-react/embed-your-app-in-shopify#authenticate-and-test)
8. [Set up your app navigation.](https://developers.shopify.com/tutorials/build-a-shopify-app-with-node-and-react/build-your-user-interface-with-polaris#set-up-your-app-navigation)
9. [Add your ngrok url as Host.](https://developers.shopify.com/tutorials/build-a-shopify-app-with-node-and-react/charge-a-fee-using-the-billing-api#set-up)