> For the complete documentation index, see [llms.txt](https://developers-apps-in-toss.toss.im/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://developers-apps-in-toss.toss.im/guide/en/analytics/logging.md). # Event Log Guide Data logging is the most important tool for improving mini app performance. By recording user behavior and element impressions, you can find drop-off points, improve conversion rates, and refine your marketing strategy. The goal is not simply to accumulate data, **where users stop**and **what they respond to**is key. *** ### Quick summary * Page navigation logs are recorded automatically. No additional setup required. * Click events and element impression events can be analyzed more precisely if you configure them directly. * SDK version `0.0.26` Data can be viewed on SDK versions and above. *** ### Principles for using logging well * Record only meaningful interactions. Focus on events with real analytical value, such as button clicks, product views, and completed payments. * Set parameters specifically, for example, `button_name: "subscribe_button"`by specifying it in detail like this, it becomes clear what is driving performance. * Design around the conversion funnel. Measure drop-off rates at each stage and use them to improve UI or target promotions. *** ### Prerequisites * SDK version `0.0.26` or above. * Sandbox or pre-launch stage data is not provided, and data is aggregated only after the actual launch. * You can check the data in the analytics screen starting the day after the service launch. In the SDK, `Analytics` For how to use the object, please refer to the Record User Actions document. *** ### Click event logging example This is the basic pattern for sending an event when a user clicks a button. ```javascript import { Analytics } from '@apps-in-toss/web-framework'; document.getElementById('myButton').addEventListener('click', function () { Analytics.click({ button_name: 'my_button' }); // Write any additional actions to run after the click here. }); ``` * `Analytics.click`logs click events. * `button_name`is the value used to identify the button. Use a name that makes it easy to distinguish the screen and function as much as possible. *** ### Element impression event logging example When a specific element becomes visible on the screen, sending an impression event lets you know which content is drawing attention. ```javascript import { Analytics } from '@apps-in-toss/web-framework'; const target = document.getElementById('impressionItem'); const observer = new IntersectionObserver( ([entry]) => { if (entry.isIntersecting) { Analytics.impression({ item_id: target.dataset.itemId }); observer.disconnect(); } }, { threshold: 0.1 }, ); observer.observe(target); ``` * `IntersectionObserver`runs the callback when the element is at least 10% visible on the screen. * `Analytics.impression`logs impression events. * `item_id`is the value used to identify the impressed item. **HTML example** ```html
Element to detect impressions ``` *** ### Event parameters Event parameters are additional information sent along with an event. Even for the same event, depending on which parameters you send together, you can perform more granular analysis in the console. At this point, `log_name`is the event name displayed in the console. In the console's **Analytics > Events** screen, it serves as the basis for distinguishing events, so it is important to use a name with a clear meaning. For example, `product_detail_screen`for a screen event, if you send `product_id`, `product_category` as parameters together, you can see which products or categories are viewed more often. **Example of event parameters** When entering the product detail screen, you can pass the currently viewed product information as parameters along with the screen event. ```javascript import { Analytics } from '@apps-in-toss/web-framework'; Analytics.screen({ log_name: 'product_detail_screen', product_id: 'prod_123', product_name: 'Wireless earphones', product_category: 'electronics', price: 29900, }); ``` * log\_name is the event name displayed in the console. * The remaining values are custom parameters stored along with the event. **How it appears in the console** If you send events as above, you can check the events in Console > **Analytics > Events** menu. In the event details screen, you can check the following information. * Event occurrence trend (graph) * Recent count * List of parameters sent together * `product_id` * `product_name` * `product_category` * `price` If you select a specific key from the parameter list, you can check the actual value and occurrence status of that parameter. **Example of Click event parameters** When a user clicks the product purchase button, you can send product information along with the click event. ```javascript import { Analytics } from '@apps-in-toss/web-framework'; Analytics.click({ log_name: 'purchase_button_click', product_id: 'prod_123', product_name: 'Wireless earphones', product_price: 29900, product_category: 'electronics', }); ``` Events sent this way are aggregated in the console as `purchase_button_click` event. Through this, you can analyze the following. * Which products were clicked the most * Which categories of products lead to conversions * Comparison of click patterns by price range *** ### Check data in the console Logging data can be checked in the management console's **Analytics > Events** menu. On that screen, you can immediately see click-through rate, conversion rate by impression, and key drop-off points. *** ### Best practices * Standardize event names and parameters. Create naming rules for events within the team and use them consistently. Example: `category_action_label` format * Do not record unnecessary events. Too many events become noise. Select them based on the analysis purpose. * Send additional properties in a structured way. Example: `item_id`, `item_category`, `price`, `position` Including things like these enables more granular analysis. * Do not log personal or sensitive information. If using user identifiers, follow anonymization or hashing policies. * Prepare error handling and retry logic. If event transmission fails due to network issues, applying queuing or retry strategies can reduce data loss. *** ### Troubleshooting summary * When item impressions or clicks are not recorded 1. `Analytics` Check whether the call location exists in the DOM. 2. Check whether events were missed because callback registration happened too late. Place scripts as high as possible. * When data does not appear in the console 1. Check whether the SDK version is `0.0.26` or above. 2. Check whether the service is actually launched. Sandbox data is not provided. * When event parameters are empty 1. Check whether the key names and values in the object being sent are correct. 2. Check for client-side errors such as JSON serialization errors. --- # Agent Instructions This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com. ## Querying This Documentation If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question. Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter: ``` GET https://developers-apps-in-toss.toss.im/guide/en/analytics/logging.md?ask=&goal= ``` `ask` is the immediate question: it should be specific, self-contained, and written in natural language. `goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal. The response will contain a direct answer to the question and relevant excerpts and sources from the documentation. Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.