# Quickstart

## Install the SDK

{% tabs %}
{% tab title="npm" %}

```
# Install via NPM
npm i kinora-sdk
```

{% endtab %}

{% tab title="yarn" %}

```
# Install via yarn
yarn add kinora-sdk
```

{% endtab %}
{% endtabs %}

### [Envoker](https://codex.irrevocable.dev/sdk-reference/envoker)

<pre class="language-typescript" data-overflow="wrap" data-full-width="true"><code class="lang-typescript"><strong>import { Envoker } from "kinora-sdk";
</strong>
const apolloClient = new ApolloClient({
  link: new HttpLink({ uri: 'https://api.lens.xyz/graphql' }),
  headers: {
    "x-access-token": `Bearer ${authToken}`,
  },
  cache: new InMemoryCache(),
});

const lensProvider = new ethers.providers.JsonRpcProvider(
    "https://lensprovider.com",
    232,
  );

const newEnvoker = new Envoker({
    authedApolloClient: client,
    ipfsConfig: {
      uploadEndpoint: "https://api.pinata.cloud/pinning/pinJSONToIPFS",
      gateway: "https://gateway.pinata.cloud",
      headers: {
      Authorization: "Bearer YOUR_PINATA_JWT"
      }
    },
    envokerLensAddress: "0xlensprofileaddress",
    wallet: new ethers.Wallet(process.env.ENVOKER_PRIVATE_KEY, lensProvider)
});

const { postId, factoryId, questId, transactionHash, factoryQuestData } = await newEnvoker.instantiateNewQuest({
  factoryId: 0,
  questDetails: {
    title: "Chromadin Chronicle",
    description: "Engage in a Chromadin video binge session for Season 1 and Season 2 of The Dial Pirate Radio . Interactions, mirrors and comments on episodes accrue bonus points.",
    cover: "ipfs://QmQk9TqFivUqc6ktosoZVVih9o1uiY3r5Z7F3GCC1FpaJS", 
    },
  maxPlayerCount: 100, 
  milestones,
  joinQuestTokenGatedLogic: tokenGatedLogic,
});
</code></pre>

### [Dispatch](https://codex.irrevocable.dev/sdk-reference/dispatch)

{% code overflow="wrap" fullWidth="true" %}

```typescript
import { Dispatch } from "kinora-sdk";

const apolloClient = new ApolloClient({
  link: new HttpLink({ uri: 'https://api.lens.xyz/graphql' }),
  headers: {
    "x-access-token": `Bearer ${authToken}`,
  },
  cache: new InMemoryCache(),
});

const lensProvider = new ethers.providers.JsonRpcProvider(
    "https://lensProvider.com",
    232,
  );

const newDispatch = new Dispatch({
    playerAuthedApolloClient: client
});

await newDispatch.playerJoinQuest(
    postId,
    new ethers.Wallet(process.env.PLAYER_PRIVATE_KEY, lensProvider));
```

{% endcode %}

### [Kinora Player Wrapper](https://codex.irrevocable.dev/sdk-reference/kinora-player-wrapper/kinora-player-wrapper)

<pre class="language-typescript" data-overflow="wrap" data-full-width="true"><code class="lang-typescript"><strong>import { Player } from "@livepeer/react";
</strong>import dynamic from "next/dynamic";
import { useWalletClient } from 'wagmi';
import { KinoraProvider, KinoraPlayerWrapper } from "kinora-sdk";
import { apolloClient } from "../../lib/lens/client";
import { createReactClient, studioProvider, LivepeerConfig,} from "@livepeer/react";

const livepeerClient = createReactClient({
  provider: studioProvider({
    apiKey: process.env.LIVEPEER_STUDIO_KEY!,
  }),
});
 
function App() {
  return (
    &#x3C;LivepeerConfig client={livepeerClient}>
      &#x3C;KinoraProvider playerAuthedApolloClient={apolloClient}    ipfsConfig={{
    uploadEndpoint: "https://api.pinata.cloud/pinning/pinJSONToIPFS",
    gateway: "https://gateway.pinata.cloud",
    headers: { Authorization: "Bearer YOUR_JWT" }
  }}>
        &#x3C;Component {...pageProps} />
      &#x3C;/KinoraProvider>
    &#x3C;/LivepeerConfig>
  )
}


function Page() {

return (
  &#x3C;div id="parentId" className="w-20 h-20 flex">
    &#x3C;KinoraPlayerWrapper
      parentId={"parentId"}
      postId={postId}
      customControls={true}
      fillWidthHeight={true}
      >
      {(setMediaElement: (node: HTMLVideoElement) => void) => (
        &#x3C;Player
         mediaElementRef={setMediaElement}
         playbackId="f5eese9wwl88k4g8"
         objectFit="cover"
         />
       )}
    &#x3C;/KinoraPlayerWrapper>
   &#x3C;/div>
  );
}
</code></pre>