Untitled

installing share your github username with the chord team to gain access to chord's github repositories you'll need to do two things make sure you have access to the package repository reach out to chord for access with your github username if you do not configure your local npm to install chord's packages from github packages go to https //github com/settings/tokens and click generate new token make sure you select the read\ packages scope copy the token if you don't already have one, create a npmrc file in your home directory ( touch / npmrc ) append the following to / npmrc , replacing the \<your personal access token> with the github token you just created //npm pkg github com/ authtoken=\<your personal access token> @chordcommerce\ registry=https //npm pkg github com this means that any npm packages with the @chordcommerce scope will be installed from github packages instead of the npm public registry if you have any trouble on this step, see github's documentation on configuring npm for use with github packages now you can install the package and its peer dependencies yarn yarn add @chordcommerce/react autonomy @chordcommerce/chord magic react react dom react redux redux npm npm install @chordcommerce/react autonomy @chordcommerce/chord magic react react dom react redux redux developing your application needs to be wrapped in the \<chordprovider> https //docs beta chord co/chord ui/function chordprovider component react autonomy keeps track of your application state and makes it available to components for example, what is currently in a user's cart is automatically persisted \<chordprovider> makes the state available throughout your application \<chordprovider> requires a configuration object with information about your storefront here's an example import chordprovider from '@chordcommerce/react autonomy' import magicclient from '@chordcommerce/chord magic' const app = ({ children }) => { const magicclient = new magicclient(process env magic api key) return ( \<chordprovider config={{ brandname process env chord oms brand name, currency 'usd', domain process env chord oms api url, locale 'en us', omsid process env chord oms id, storeid process env chord oms store id, tenantid process env chord oms tenant id }} authclient={magicclient} \> {children} \</chordprovider> ) } the config object requires these keys name type description brandname string the store's name currency string the store's currency for example, usd domain string the base url of the oms api to use for requests for example, https //my store assembly api com locale string the store's locale for example, en us omsid string a unique identifier generated by chord during provisioning storeid string a unique identifier generated by chord during provisioning tenantid string a unique identifier generated by chord during provisioning once your application is wrapped in the \<chordprovider> component, you can use sdk methods throughout your code for example, here's a react component for adding an item to the cart import { usecart } from '@chordcommerce/react autonomy' export default () => { const { addtocart } = usecart() const onsubmit = ({ sku, quantity }) => { addtocart({ sku, quantity }) } }