# Use the Webview

The Webview pane in the Editor displays a preview for each branch.
Any time you make a change in the Editor, the change is reflected in the Webview.
You can disable auto-sync, view different screen sizes, reload the page or restart, navigate the pages, and close the Webview to expand the Editor.

![Webview buttons](/assets/webview-buttons.9c71a9dda205eb0f40f970211a313a90a4b83d5d04673f4bcda9289901aa394b.4968a88f.png)

There is a difference between the **Webview** and the **[preview deployment](/docs/realm/reunite/project/use-previews)**. The Webview displays uncommited changes while the preview deployment triggers when you make a commit to a branch with an open pull request.

## Before you begin

Make sure you have the following before you begin:

- At least a member role in your organization in Reunite.
- If you have RBAC configured, you need to log in to the interface.
You do not need to use actual credentials.


## View different screen sizes

If you want to see how a page renders on different screen sizes, click the **Toggle device view** icon.

![Toggle device view icon](/assets/webview-mobile.012477eddc0f182beee14e4724d4dd62bcba4ad81a96a5e7a6027699f4c89b14.4968a88f.png)

You can select from the following preset sizes:

- Mobile (320x675)
- Tablet (1024x765)
- Desktop (1400x800)
- Desktop HD (1920x1080)


You can also enter specific length and width pixel sizes and click and drag the sides of the Webview to expand or contract the sides.

To see a full screen version in a new tab, click the **Open in a new window** icon.

![Open in a new window icon](/assets/webview-open-in-new-window.25a74e0bae6c7e03e49b3b0329a9314bfc357c9d12523612bbc2312cf1bc1d86.4968a88f.png)

## More actions

Click the **More actions** icon to either do a full restart or disable auto-sync.

![More actions icon](/assets/webview-more-actions.5d4f5cfbb5235039a950120a9e3b63965a57b1a44de36c74ad2b81cd937961a4.4968a88f.png)

### Full restart

To completely restart the server, click the **More actions** icon and select **Full Restart**.

When you update the `package.json` file in the Editor, the Webview re-installs dependencies and restarts automatically.

### Disable auto-sync

When you disable auto-sync, the Webview does not update based on the page you are on in the Editor.
To disable auto-sync, you can click the **More actions** icon and select **Disable auto-sync**.

To turn auto-sync back on, click the **More actions** icon and select **Enable auto-sync**.

## Reload

To reload the page you are on in the Editor, click the **Reload** icon.

![Reload icon](/assets/webview-reload.34e0a195761980c37955fde79f54f543bc90ac6a639ce6709acd3928d276597a.4968a88f.png)

## Navigate pages

You can use the back and forward arrow icons to navigate pages in the Editor.

![Back and forward icons](/assets/webview-back-and-forward.b0e93723fc61c993b523e31b8a34a5a299112cc58accc74a7888cba947f51c80.4968a88f.png)

The back and forward arrow icons consider page view history, which starts over when the Webview is reloaded or restarted.

## Close or open

You can close the Webview by clicking the panel toggle, which changes direction after you click it.

![Panel toggle icon](/assets/webview-panel-toggle.d429d890ee9e92fc319ad9f10c2b601e84022bfa08099e01f146e5e6b82a2aa2.4968a88f.png)

To open it, click the toggle again.

## Access build logs in the Webview tab

You can monitor and manage Webview logs using the **Logs** panel at the bottom of the screen.
Logs automatically appear when changes are made to the project or when the Webview generates new output.
The **Logs** panel automatically scrolls to show the most recent logs.
![Logs Panel](/assets/webview-logs-panel.be3a4ec34aaf4757c8f42c52b9a5fc4e4b81c16923e117b3c372dec86d698a14.4968a88f.png)

In the **Logs** panel you can:

- Expand and collapse the panel
![Logs expand button](/assets/webview-logs-expand-panel.c17114e7f40e53ddea6581b190f8cb7122f9d050687a991f39a9809046520f65.4968a88f.png)
- **Clear logs**: remove all current logs
![Logs Clear button](/assets/webview-logs-clear-button.3a10cc9e8ed2810d261f32356758b9ab11c993a65e64402cab98d177c18416f8.4968a88f.png)
- **Copy logs**: copy all logs to clipboard
![Copy logs button](/assets/webview-logs-copy-button.f9cd0a1e5bdf1ad6fea061d91530a06106ebd97712fd18bfb53e3cb730ad52cc.4968a88f.png)


## Resources

- **[Use the editor](/docs/realm/reunite/project/use-editor)** - Learn to edit content in Reunite's integrated editor with syntax highlighting and collaborative features
- **[Use previews](/docs/realm/reunite/project/use-previews)** - Access deployment previews to review changes before publishing to your live documentation site