React Quickstart
Install adkit-react and drop ad slots into your React app. Works with Vite, Create React App, and any React 17+ project.
Prerequisites
React 17+, Node.js 18+, and an Adkit account. Sign up at adkit.dev to get your site ID.
1
Install the package
2
Add the provider
Wrap your app with AdkitProvider and import the stylesheet. Place the provider as high in the tree as possible so all slots share the same context.
src/App.tsx
3
Place a slot
Import AdSlot and add it anywhere in your component tree. Give it a unique slot name and an aspect ratio.
src/components/Sidebar.tsx
Price is in cents
price={2500} displays as $25/day. The server confirms the final price — it cannot be overridden client-side.4
Verify it works
Run your dev server and open the page. The slot should match this banner placeholder.
Without a provider
If you only need a single isolated slot, pass siteId directly to AdSlot instead of using a provider.
src/components/Banner.tsx
The
refresh() API from useAdkit() is only available inside a provider. For SPA route changes, use the provider approach.