Local Preview Server
Relevant source files
The following files were used as context for generating this wiki page:
The Local Preview Server renders web content like HTML and Markdown directly within the Acode environment. It allows you to view live changes to your code using either a built-in internal browser or an external system browser.
Sources: user-guide/settings/preview-settings.md:1-3, user-guide/index.md:27-31
Core Functionality
The server hosts local files to enable web-based previews. You can configure the server to use the currently active file or a default entry point like index.html. For advanced workflows, the system supports external servers managed through the terminal or third-party tools.
Sources: user-guide/settings/preview-settings.md:5-10, user-guide/settings/preview-settings.md:22-26
Server Modes and Logic
Acode determines whether to start its own internal server based on the port configuration. If you define identical ports for the server and the preview, Acode initiates the local server. If the ports differ, Acode assumes an external process (such as a Vite or React dev server) is running and attempts to connect to that existing address.
The diagram shows the decision logic Acode uses to choose between the internal preview server and an external process.
Sources: user-guide/settings/preview-settings.md:22-26
Configuration Options
You manage the preview server through the Preview Settings menu. These settings control the network identity of the server and the behavior of the preview window.
General Settings
| Setting | Description |
|---|---|
| Preview Mode | Selects between In-App (built-in browser) or Browser (system default). |
| Use Current File | Previews the active tab instead of index.html. |
| Disable In-App Caching | Forces fresh content on every refresh by disabling browser cache. |
| Show Console Toggler | Displays a button to open the JavaScript console within the preview. |
Sources: user-guide/settings/preview-settings.md:5-10
Network Configuration
| Setting | Description | Default |
|---|---|---|
| Host | The hostname or IP address for the server. | localhost |
| Server Port | The port where Acode's local server listens. | - |
| Preview Port | The port requested by the preview window. | - |
Sources: user-guide/settings/preview-settings.md:14-20
External Server Integration
You can run manual servers using the Terminal or external apps like Termux. When running a manual server, you must ensure the Preview Port in Acode matches the port assigned by your manual process.
Sources: user-guide/settings/preview-settings.md:22-26, tutorials/how-to-run-java.md:46-51
This sequence shows how Acode integrates with a server manually started in the terminal.
Sources: user-guide/settings/preview-settings.md:22-26, user-guide/terminal.md:1-5
Debugging and Monitoring
The preview system provides tools to monitor code execution and fix issues during development.
- JavaScript Console: You can use the Legacy or Eruda console to debug scripts within the preview.
- Console Toggler: A UI button can be enabled to quickly toggle the visibility of these debugging tools.
Sources: user-guide/settings/app-settings.md:65-67, user-guide/settings/preview-settings.md:10
The Local Preview Server provides a flexible environment for web development by balancing an automated internal server with the ability to connect to complex, manually managed development stacks.