---
id: left-sidebar
title: Left-sidebar
---

Left-sidebar has the following options:

- **Pages**
- **Inspector**
- **Datasources Manager**
- **Debugger**
- **Dark/Light mode switch**

<div style={{textAlign: 'center'}}>

<img className="screenshot-full" src="/img/v2-beta/app-builder/leftsidebar/leftsidebar.png" alt="App Builder: Left-sidebar"/>

</div>

## Pages

Pages allows you to have multiple pages in a single application, making your ToolJet applications more robust and user-friendly.

Check the detailed documentation for **[Pages](/docs/tutorial/pages)**.

<div style={{textAlign: 'center'}}>

<img className="screenshot-full" src="/img/v2-beta/app-builder/leftsidebar/pages.png" alt="App Builder: Left-sidebar"/>

</div>

## Inspector

The Inspector can be used to inspect the data of the **queries**, properties and values of the **components** that are there on the canvas, ToolJet's global variables and the variables that have been set by the user.

Check the detailed guide on **[using Inspector](/docs/how-to/use-inspector)**.

<div style={{textAlign: 'center'}}>

<img className="screenshot-full" src="/img/v2-beta/app-builder/leftsidebar/inspector.png" alt="App Builder: Left-sidebar"/>

</div>

## Datasources Manager

Datasources Manager is used to connect or remove the datasources. 

Check the detailed **[Datasources documentation](/docs/data-sources/overview)**.

<div style={{textAlign: 'center'}}>

<img className="screenshot-full" src="/img/v2-beta/app-builder/leftsidebar/datasources.png" alt="App Builder: Left-sidebar"/>

</div>

## Debugger

Debugger logs all the errors that are thrown either by the datasource, components, or by wrong query parameters.

<div style={{textAlign: 'center'}}>

<img className="screenshot-full" src="/img/v2-beta/app-builder/leftsidebar/debugger.png" alt="App Builder: Left-sidebar"/>

</div>

## Theme switch

Switch ToolJet into light or dark mode from this button.