> Portal Navigation:
> 
> - Append `.md` to any URL under `https://dev.wix.com/docs/` to get its markdown version.
> - Pages are either content pages (article or reference text) or menu pages (a list of links to child pages).
> - To get a menu page, truncate any URL to a parent path and append `.md` (e.g. `https://dev.wix.com/docs/sdk.md`, `https://dev.wix.com/docs/sdk/core-modules.md`).
> - Top-level index of all portals: https://dev.wix.com/docs/llms.txt
> - Full concatenated docs: https://dev.wix.com/docs/llms-full.txt

## Resource: Tutorial | Generate Logs to Debug a Site

## Article: Tutorial | Generate Logs to Debug a Site

## Article Link: https://dev.wix.com/docs/develop-websites-sdk/get-started/tutorials/monitoring/tutorial-generate-logs-to-debug-a-site.md

## Article Content:

# Tutorial | Generate Logs to Debug a Site

This tutorial demonstrates how to generate and view logs from site code. The logs are viewed using [Wix Logs](https://dev.wix.com/docs/develop-websites-sdk/test-your-site/work-with-wix-logs/about-wix-logs.md).

In this tutorial, you'll:

1. [Add a button to a site](#step-1--add-a-button-to-a-site)
1. [Generate and view a log](#step-2--generate-and-view-a-log)

> **Note**: In this tutorial, logs are generated from page code. However, you can also generate logs from backend code.

## Step 1 | Add a button to a site

Add a button to a site and create an event handler:

1.  Add a button labeled `button1` to a site's home page. Here's how it should look:

    ![Button added to site home page](https://wixmp-833713b177cebf373f611808.wixmp.com/images/949a3dd03f5f11dd9dc3211af1b2c85f.png)

1.  In the site's home page code, add an [event handler](https://dev.wix.com/docs/develop-websites-sdk/code-your-site/build-a-custom-frontend/event-handlers/about-event-handlers.md) that runs whenever the button is clicked.

    > **Note**: This tutorial uses the `$w()` selector for frontend element interaction, which is a Velo API that remains necessary for frontend code even when using the JavaScript SDK for backend development.

    For the purposes of this tutorial, produce an error by defining `factor3` instead of `factor2.`

    ```js
    $w("#button1").onClick(() => {
      const factor1 = 10;
      const factor3 = 5;
      try {
        console.log("Button clicked!");
        console.log(factor1 + " * " + factor2 + " = " + factor1 * factor2);
      } catch (error) {
        console.error("An error occurred during multiplication:", error);
        console.warn("Make sure to specify 2 factors for multiplication.");
      }
    });
    ```

1.  Preview or publish the site.

    > **Note:** You can generate logs when previewing a site, but some log information is available only when the site is published.

## Step 2 | Generate and view a log

Generate a log and view it [using Wix Logs](https://dev.wix.com/docs/develop-websites-sdk/test-your-site/work-with-wix-logs/view-logs-with-wix-logs.md) as follows:

1. In a separate browser tab or window, [open the Wix Logs page](https://dev.wix.com/docs/develop-websites-sdk/test-your-site/work-with-wix-logs/view-logs-with-wix-logs.md#view-the-logs).

   ![Wix Logs window](https://wixmp-833713b177cebf373f611808.wixmp.com/images/6f82b8af9105b4198ffe5babf7d6114d.png)

1. In the live site's home page or in Preview mode, click the button you created.

   The logs appear in the Wix Logs page:

   ![Wix Logs error example](https://wixmp-833713b177cebf373f611808.wixmp.com/images/dbf2dc66af923e4d2c64564f8332de90.png)

1. Click **View** for the log with the error to see its full details on the right:

   ![Wix Logs log details](https://wixmp-833713b177cebf373f611808.wixmp.com/images/123b0719f98d5699cf242c68c1813b02.png)

   Check out the `jsonPayload` to see an explanation for the error.

## See also

- [About Wix Logs](https://dev.wix.com/docs/develop-websites-sdk/test-your-site/work-with-wix-logs/about-wix-logs.md)
- [View logs with Wix Logs](https://dev.wix.com/docs/develop-websites-sdk/test-your-site/work-with-wix-logs/view-logs-with-wix-logs.md)
- [View logs with Google Cloud Logs](https://dev.wix.com/docs/develop-websites-sdk/test-your-site/work-with-wix-logs/view-logs-with-google-cloud-logs.md)
- [View logs with an external logging tool](https://dev.wix.com/docs/develop-websites-sdk/test-your-site/work-with-wix-logs/view-logs-with-an-external-logging-tool.md)
- [Log object structure](https://dev.wix.com/docs/develop-websites-sdk/test-your-site/work-with-wix-logs/log-object-structure.md)