update repo readme

This commit is contained in:
goenning 2023-09-04 20:59:23 +01:00
parent 5a5038724b
commit f440679594
2 changed files with 8 additions and 52 deletions

View file

@ -1,50 +1,6 @@
![Aptabase](https://aptabase.com/og.png) ![Aptabase](https://aptabase.com/og.png)
# JavaScript SDK for Aptabase This repository hosts the code for:
A tiny SDK (1 kB) to instrument your web app with Aptabase, an Open Source, Privacy-First, and Simple Analytics for Mobile, Desktop, and Web Apps. - [SDK for React / Remix / Next.js](./packages/react/README.md)
- [SDK for JavaScript](./packages/web/README.md)
> 👉 **IMPORTANT**
>
> This SDK is for **Web Applications**, not websites. There's a subtle, but important difference. A web app is often a lot more interactive and does not cause a full page to reload when the user interacts with it. It's often called a **Single-Page Application**. A website, on the other hand, is a lot more content-focused like marketing sites, landing pages, blogs, etc. While you can certainly use Aptabase to track events on websites, please be aware that each page reloads will be considered a new session.
## Install
Install the SDK using your preferred JavaScript package manager
```bash
npm add @aptabase/web
```
## Usage
First, you need to get your `App Key` from Aptabase, you can find it in the `Instructions` menu on the left side menu.
Initialized the SDK using your `App Key`:
```js
import { init } from "@aptabase/web";
init("<YOUR_APP_KEY>"); // 👈 this is where you enter your App Key
```
The init function also supports an optional second parameter, which is an object with the `appVersion` property.
It's up to you to decide what to get the version of your app, but it's generally recommended to use your bundler (like Webpack, Vite, Rollup, etc.) to inject the values at build time.
Afterward, you can start tracking events with `trackEvent`:
```js
import { trackEvent } from "@aptabase/web";
trackEvent("app_started"); // An event with no properties
trackEvent("page_view", { name: "Settings", path: "/settings" }); // An event with a custom property
```
A few important notes:
1. The SDK will automatically enhance the event with some useful information, like the OS, the app version, and other things.
2. You're in control of what gets sent to Aptabase. This SDK does not automatically track any events, you need to call `trackEvent` manually.
- Because of this, it's generally recommended to at least track an event at startup
3. You do not need to await for the `trackEvent` function, it'll run in the background.
4. Only strings and numbers values are allowed on custom properties

10
package-lock.json generated
View file

@ -124,6 +124,10 @@
"resolved": "packages/react", "resolved": "packages/react",
"link": true "link": true
}, },
"node_modules/@aptabase/web": {
"resolved": "packages/web",
"link": true
},
"node_modules/@babel/code-frame": { "node_modules/@babel/code-frame": {
"version": "7.22.13", "version": "7.22.13",
"resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.22.13.tgz", "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.22.13.tgz",
@ -13329,7 +13333,7 @@
}, },
"packages/react": { "packages/react": {
"name": "@aptabase/react", "name": "@aptabase/react",
"version": "0.1.0", "version": "0.1.1",
"license": "MIT", "license": "MIT",
"dependencies": { "dependencies": {
"@aptabase/web": "0.2.0" "@aptabase/web": "0.2.0"
@ -13338,10 +13342,6 @@
"react": "^18.0.0" "react": "^18.0.0"
} }
}, },
"packages/react/node_modules/@aptabase/web": {
"resolved": "packages/web",
"link": true
},
"packages/web": { "packages/web": {
"name": "@aptabase/web", "name": "@aptabase/web",
"version": "0.2.0", "version": "0.2.0",