- You must download and install Node.js if you don't already have it.
- I would recommend Visual Studio Code for programming
- Fork this repository
- Clone the fork
- Run
npm install
- Always create a new branch before starting a feature
- Commit your changes
- Run
git checkout main
- Run
git pull upstream main --rebase
andgit push origin main
(if doesn't work, rungit push origin main --force
) - Switch to your feature branch (
git checkout [branch-name]
) and rungit rebase main
- Now, you can push to your origin (
git push origin main
) and go to this repo and create a PR
- Create a Shopify Partners account
- Send me the email address you used on Slack (Krithin Jay)
- Engineering Handbook
- Shopify Docs: (https://shopify.dev/docs/apps/getting-started/create)
- Message @SuspenseFallback or Krithin Jay on Slack for help
- Create a discussion/issue
- Ask for help in the Slack Channel
This app combines a number of third party open-source tools:
- Express builds the backend.
- Vite builds the React frontend.
- React Router is used for routing. We wrap this with file-based routing.
- React Query queries the Admin API.
i18next
and related libraries are used to internationalize the frontend.react-i18next
is used for React-specific i18n functionality.i18next-resources-to-backend
is used to dynamically load app translations.@formatjs/intl-localematcher
is used to match the user locale with supported app locales.@formatjs/intl-locale
is used as a polyfill forIntl.Locale
if necessary.@formatjs/intl-pluralrules
is used as a polyfill forIntl.PluralRules
if necessary.- Jest for testing
The following Shopify tools complement these third-party tools to ease app development:
- Shopify API library adds OAuth to the Express backend. This lets users install the app and grant scope permissions.
- App Bridge React adds authentication to API requests in the frontend and renders components outside of the App’s iFrame.
- Polaris React is a powerful design system and component library that helps developers build high quality, consistent experiences for Shopify merchants.
- Custom hooks make authenticated requests to the Admin API.
- File-based routing makes creating new pages easier.
@shopify/i18next-shopify
is a plugin fori18next
that allows translation files to follow the same JSON schema used by Shopify app extensions and themes.
- Merchant (admin): Backend user of Shopify customizing the checkout process and adding items to the online store.
- Prerequisite (Merchant): Needs to have a designated wallet handle with tokens inside. Or create a new wallet in the app.
- Consumer: Person buying something on Shop owners (Merchants) Shopify instance
- Prerequisite (consumer): Needs to go through the cart checkout process and finalize a purchase. Either has an existing wallet (enter wallet name) or gets assigned a new wallet (could be the email address)
-
Greenstand Shopify Master Wallet: This is the master wallet created on the Greenstand wallet system that enables the shopify App to create more wallets and create trust relationships to receive tokens from the wallet of the shop owner.
-
Consumer Wallet: A wallet created by the Shopify App (Using the Greenstand Shopify Master Wallet above). This wallet is created with a “trust relationship” that enables the wallet to receive tokens from the shop owner’s wallet. Complication: If the consumer already has created an outside of the shopify app, a new relationship must be established and a trust relationship must be sent (later user stories).
-
Merchant Shop Wallet: This is a wallet that is owned by the merchant and designated as the wallet to draw tokens from on the shop.
Consumers buy items in the store and on check out opt in to receive tokens. If no wallet is known a new wallet gets created. The wallet created is fully managed by the Greenstand master account and only has a trust relationship to the “merchants master wallet”. That way tokens can not be transferred back into the merchant's master wallet which increases trust and security.