Experience App SDK
Introduction
The Experience App SDK is a typescript library to help you utilize ShowpadJS in your experience apps.
Requirements
- Showpad domain with administrator rights.
- NodeJS
Compatible browsers for development
Showpad Experience Apps run inside Iframes: Use relative paths in production.
Documentation
You can find documentation on the Showpad Developer Portal.
Installation
# npm
npm i @showpad/experience-app-sdk
# yarn
yarn add @showpad/experience-app-sdk
We also offer the Experience App SDK through a CDN:
<script src="https://d1r7y59lntwm8j.cloudfront.net/experience-app-sdk.js"></script>
Usage
import { Showpad } from '@showpad/experience-app-sdk';
const main = async (): Promise<void> => {
// Always wait for ShowpadLib to be loaded
await Showpad.onShowpadLibLoaded();
const userInfo = await Showpad.getUserInfo();
const deviceInfo = await Showpad.getDeviceInfo();
};
main();
The equivalent in a standard HTML file through the CDN could be this. To develop on localhost
, you will still need the
Experience App CLI in a Node environment. We recommend using a build tool like vite
for local
development.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Experience App</title>
</head>
<body>
<!-- Injects ShowpadSdk on the window object -->
<script src="https://d1r7y59lntwm8j.cloudfront.net/experience-app-sdk.js"></script>
<script>
const { Showpad } = ShowpadSdk;
const main = async () => {
// Always wait for ShowpadLib to be loaded
await Showpad.onShowpadLibLoaded();
const userInfo = await Showpad.getUserInfo();
const deviceInfo = await Showpad.getDeviceInfo();
};
main();
</script>
</body>
</html>