> For the complete documentation index, see [llms.txt](https://docs.betterbugs.io/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.betterbugs.io/developer-guide/betterbugs-web-sdk.md).

# BetterBugs Web SDK

### What is the BetterBugs Web SDK Widget?

The BetterBugs Web SDK enables you to add a lightweight bug reporting/feedback widget to your web application. It’s got a simple and intuitive button that allows users to click, create, and submit a bug report or feedback instantly!

{% embed url="<https://files.gitbook.com/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FBzBhuIUDDav7ztnadaoO%2Fuploads%2F0OOifwiBNJZkPV4wpBdu%2F01-Web-SDK-Quickstart-Video.mp4?alt=media&token=d5a777fd-d68d-4c4d-9519-729cb67a97dc>" %}
BetterBugs.io Web SDK Feedback Widget | Video Demo
{% endembed %}

Once you install the Widget on your web app,

* Your customers or end-users can click the widget to create and directly share bit-perfect bug reports or send direct feedback back to you.&#x20;
* No downloads or setup is required from the end users.&#x20;
* End-users do not have to set up an account or anything else to use it.

### How it Works

When end users face any difficulty or an issue while using your app, they can click the widget button to take a screenshot or record their screen and instantly send it to you as a complete bug report.&#x20;

The submitted bug report comes bundled with:

<div data-with-frame="true"><figure><img src="/files/TzkliiIy36kUFeCQ2ql5" alt=""><figcaption></figcaption></figure></div>

1. **The visual evidence (screenshot or screen recording)**&#x20;
2. **Auto-attached technical details (console logs, network requests, errors, warnings, and others).**

Developers can then use these technically sound, context-rich, and data-filled bug reports for debugging purposes.&#x20;

In a nutshell, using the widget button, your end-users and customers can easily:

* **Report a bug or an issue while using your app**
* **Submit feedback effortlessly**

### What are the Top Use Cases of the BetterBugs Web SDK Feedback Widget?

You can use the feedback widget to:

* Get instant bug reports/feedback from external users and customers
* Get visual evidence of an issue + auto-attached technical details (console logs, errors, and others)
* Report app issues to other team members (in “development” mode)
* Add a bug reporting widget to your app with a custom UI (using customization options)
* Equip apps with quick bug reporting capabilities in bug bash events
* Run testing activities and QA overall&#x20;

### What is the Difference between the BetterBugs.io Extension and the BetterBugs Web SDK widget?

The BetterBugs extension is a fully fledged web application that provides advanced bug reporting and debugging features. The Web SDK is a part of the BetterBugs extension that works in sync with the BetterBugs application and allows users to submit bug reports with minimal effort, zero setup, and a simple-to-use interface.

### When to Use: Extension vs. Web SDK Feedback Widget

With the BetterBugs extension, you can:

* Create and share context-rich and technically sound bug reports
* Do bug tracking, reporting, debugging, and testing activities
* Manage project bug reports
* Share reports with your issue trackers and project tools&#x20;
* Do QA, testing, and debugging activities overall
* And many others.

The Web SDK serves as the extension’s sidekick to collect fully-fledged bug reports from customers and internal team members. You can use the Web SDK widget to:

* Get the visual evidence of the issue + error logs from the console
* Get bug reports from end users without any setup
* Serve as a built-in and automated bug reporting software
* Getting quick feedback from users if something goes wrong
* Get the exact steps of user action in case of an issue
