Research
Security News
Quasar RAT Disguised as an npm Package for Detecting Vulnerabilities in Ethereum Smart Contracts
Socket researchers uncover a malicious npm package posing as a tool for detecting vulnerabilities in Etherium smart contracts.
@shopify/app-bridge
Advanced tools
[![Build Status](https://travis-ci.com/Shopify/app-bridge.svg?token=RBRyvqQyN525bnfz7J8p&branch=master)](https://travis-ci.com/Shopify/app-bridge) [![codecov](https://codecov.io/gh/Shopify/app-bridge/branch/master/graph/badge.svg?token=nZ21m39Dr6)](https:
@shopify/app-bridge
You can use Shopify App Bridge to embed apps and channels directly into the Shopify admin, Shopify Mobile, and Shopify POS. Shopify App Bridge helps to reduce your development time by accessing native Shopify features across different platforms, and makes sure that the user experience is consistent wherever merchants are using your app.
Shopify App Bridge is currently being released as an update to all current consumers of the Embedded App SDK. Since it’s backwards compatible, you don't need to update your existing apps for them to support Shopify App Bridge.
You can install Shopify App Bridge by using Yarn:
yarn add @shopify/app-bridge
Import the library from the @shopify/app-bridge
package and provide a configuration:
import createApp, {getShopOrigin} from '@shopify/app-bridge';
const app = createApp({
apiKey: 'API key from Shopify Partner Dashboard',
shopOrigin: getShopOrigin(),
});
Shopify App Bridge introduces the concept of actions. An action provides a way for applications and hosts to trigger events with a statically-typed payload.
To learn more about the supported actions, see the actions source folder.
Once the app is set up, you can access additional details and the state of the app at
any time by making async call app.getState()
:
app.getState().then((state: any) => {
console.info('App State: %o', state)
});
You can also use a shorthand to retrieve nested properties by passing in a query
when calling getState(query)
, for example:
app.getState('pos.user').then((user: any) => {
console.log('POS User: %o', user);
});
Shopify App Bridge is shipped with a development build which includes the validation middleware in order to provide helpful information during development.
If you're consuming App Bridge from a CDN or using the UMD build, simply include the development version:
app-bridge.development.js
instead of app-bridge.js
When consumed as JS Modules, development/production build is dynamically selected based on the NODE_ENV
variable. Development build is used when NODE_ENV=development
.
Please note that the development build is not intended for production use, as the resulting file size is significantly larger due to the validator being present.
yarn start
- Start a development server.yarn build
- Build the library, compiling the source TypeScript into JavaScript.yarn clean
- Remove any artifacts produced by the build
script.yarn lint
- Run the source linter.yarn check
- Run the TypeScript type checker.yarn test
- Run the tests.yarn test:watch
- Run the tests in watch mode and auto-rerun on changes.yarn test:coverage
- Run the tests and generate a coverage report.To enable automatic prettier formatting, copy or link the pre-commit script to
.git/hooks/pre-commit
and make sure that it's executable.
Please follow a standardized commit message format when contributing to this repo: https://www.conventionalcommits.org/en/v1.0.0-beta.2/
FAQs
**[Join our team and work on libraries like this one.](https://www.shopify.ca/careers)**
The npm package @shopify/app-bridge receives a total of 63,419 weekly downloads. As such, @shopify/app-bridge popularity was classified as popular.
We found that @shopify/app-bridge demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 25 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Research
Security News
Socket researchers uncover a malicious npm package posing as a tool for detecting vulnerabilities in Etherium smart contracts.
Security News
Research
A supply chain attack on Rspack's npm packages injected cryptomining malware, potentially impacting thousands of developers.
Research
Security News
Socket researchers discovered a malware campaign on npm delivering the Skuld infostealer via typosquatted packages, exposing sensitive data.