Issue
I need help with importing and using the amplitude library to track events on my Appsmith dashboard. I am wondering how to authenticate with the API key and which functions to use to track the events. Should I fire the API on onClick events or on page load?
Resolution
To track Appsmith dashboard events using Amplitude, you can import the Amplitude library and pass your API key as a header in an authenticated REST API datasource. One option is to fire the Amplitude API on the onClick events of your Appsmith components, but you can also configure it to run on page load.
First, import the Amplitude library into your Appsmith dashboard by adding the following script tag to the head section of your index.html file:
<script type="text/javascript">
var amplitude = require('amplitude-js');
amplitude.getInstance().init('YOUR_API_KEY_HERE');
</script>
Next, create an authenticated REST API datasource in Appsmith and pass your API key as a header. Here's an example with the Amplitude API to track a button click event:
URL: https://api.amplitude.com/httpapi
Method: POST
Headers:
Content-Type: application/x-www-form-urlencoded
User-Agent: Mozilla/5.0
Authorization: YOUR_API_KEY_HERE
Body:
event=Button Clicked
user_id={{userId}}
In this example, the "{{userId}}" variable is a dynamic value that can be passed from Appsmith to Amplitude. You can customize the event name and pass additional data as needed in the body of the API call.
Finally, add the API call to the onClick event of your Appsmith button component using the "Open API/Query" action.
With this setup, each time the button is clicked, the Amplitude API will track the event and send the data to your Amplitude dashboard.