Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/Shopify/blockchain-components
Blockchain related React UI components for Shopify storefronts
https://github.com/Shopify/blockchain-components
blockchain component-library connect-wallet react shopify-blockchain-components typescript wallet
Last synced: about 2 months ago
JSON representation
Blockchain related React UI components for Shopify storefronts
- Host: GitHub
- URL: https://github.com/Shopify/blockchain-components
- Owner: Shopify
- License: mit
- Created: 2023-02-02T16:23:08.000Z (almost 2 years ago)
- Default Branch: main
- Last Pushed: 2024-04-11T08:38:06.000Z (8 months ago)
- Last Synced: 2024-04-14T09:45:25.239Z (8 months ago)
- Topics: blockchain, component-library, connect-wallet, react, shopify-blockchain-components, typescript, wallet
- Language: TypeScript
- Homepage: https://blockchain.shopify.dev
- Size: 3.72 MB
- Stars: 72
- Watchers: 128
- Forks: 17
- Open Issues: 14
-
Metadata Files:
- Readme: README.md
- Contributing: .github/contributing.md
- License: LICENSE.md
- Code of conduct: .github/code_of_conduct.md
- Codeowners: .github/CODEOWNERS
Awesome Lists containing this project
- awesome - Shopify/blockchain-components - Blockchain related React UI components for Shopify storefronts (TypeScript)
README
# Blockchain components
[](LICENSE.md) [](https://github.com/Shopify/blockchain-components/actions?query=branch%3Amain) [](../../.github/contributing.md) [](https://main--639b1f308693132693d9b82c.chromatic.com/)
A loosely related set of components for blockchain functionality on Shopify storefronts.
These packages are built to help you integrate blockchain functionality on your Shopify storefront. While you are not required to use all of them at the same time, the idea is that when used together the result is a seamless Web3 experience for your customers.
## Usage
This repository is managed as a monorepo. Each package has its own `README.md` and documentation describing usage.
### Package Index
| Package | Description | NPM |
| ---------------------------------------------------------------- | -------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------- |
| [@shopify/blockchain-components](packages/blockchain-components) | Shared packages for blockchain components | [](https://npmjs.com/package/@shopify/blockchain-components) |
| [@shopify/connect-wallet](packages/connect-wallet) | Crypto wallet connection library for Shopify storefronts | [](https://npmjs.com/package/@shopify/connect-wallet) |
| [@shopify/gate-context-client](packages/gate-context-client) | Gate unlocking context client for Shopify storefronts | [](https://npmjs.com/package/@shopify/gate-context-client) |
| [@shopify/tokengate](packages/tokengate) | Tokengating component for Shopify storefronts | [](https://npmjs.com/package/@shopify/tokengate) |
### Run a command
**All workspaces**
Run commands across all workspaces. This uses [`turbo run `](https://turborepo.org/docs/reference/command-line-reference#turbo-run-task).
| Command | Description |
| ------------------------ | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| `yarn build` | Builds all workspaces (`./apps`, `./examples`, `./packages`) in order of their dependencies. |
| `yarn build:packages` | Builds all packages located in the `./packages` directory in order of their dependencies. |
| `yarn changeset` | Adds a new [changelog entry](https://github.com/Shopify/blockchain-components/blob/main/.github/contributing.md#adding-a-changeset) |
| `yarn dev` | Builds all packages located in the `./packages` directory without regard to any dependencies between the packages and rebuilds when package files are changed. Also runs the `./apps/playground` project for local development purposes. Does not generate declaration files (`.d.ts`). |
| `yarn dev:packages` | Builds all packages located in the `./packages` directory without regard to any dependencies between the packages and rebuilds when package files are changed. Does not generate declaration files (`.d.ts`). |
| `yarn example` | Runs the script in `./examples/scripts` which opens a prompt asking which example you want to run. After selecting an example, the packages within `./packages` are built and the example you selected is started. |
| `yarn example:[example]` | Starts the development server for the example you provided.
Options: `cra` | `custom-theme` | `nextjs` | `remix` | `vite` |
| `yarn lint` | Runs [eslint](https://eslint.org/) against all packages in workspaces that contain a `lint` script to ensure they comply with the rules provided in our [eslint configuration](../.eslintrc.js). |
| `yarn typecheck` | Builds all packages located in `./packages` directory in order of their dependencies and runs type validation. |
## Want to contribute?
Check out our [Contributing Guide](./.github/contributing.md)
## Questions?
For Shopifolk, you can reach out to us in Slack in `#blockchain-components` channel. For external inquiries, we welcome bug reports, enhancements, and feature requests via GitHub [issues](/issues).
## License
MIT © [Shopify](https://shopify.com/), see [LICENSE.md](LICENSE.md) for details.
