Local Previews

Preview your documentation changes locally before they go live.

Developing your documentation in Markdown is a great way to quickly iterate on your content without leaving the code editor or dealing with a complex CMS. However, it can be difficult to visualize how your content will look once it's live on your site. That's where local previews come in.

Preview Mode

Local Preview Mode takes advantage of the new File System API available on modern browsers which enables docs.page to read files from your local file system. Using this API, docs.page can display your documentation as if it were live on your site, without needing to push your changes to a live site, with some limitations such as automatic content reloading.

  • Select your directory

    On the preview page, click the select directory button:

    Select Directory

    When prompted, select the directory where your documentation files are stored. This should be the root directory with a docs.json configuration file.

  • Modify your content

    Once selected, your documentation will be displayed in the browser. Make modifications to your content in your code editor and save the changes. The changes will be automatically reflected in the preview.

  • Grant permissions

    In some scenarios, such as closing the browser or refreshing the page, you may need to grant permissions to access the directory again for security reasons. Click the "Grant Read Permission" button to allow access to the directory again:

    Grant Permission