# BookStack + Google Apps Script Integration Demo

## Overview

This project will help you get familiar with our technical setup by integrating a Google Apps Script web app into our BookStack knowledge base. You will be working with Docker, Google Apps Script, and BookStack.

## Objectives

- Set up and run the BookStack app using Docker containers.
- Create and deploy a "Hello World" Google Apps Script web app.
- Embed the web app as an iframe in a BookStack page.
- Record a short demo video to demonstrate the setup.

## Prerequisites

Before starting, please review the following documentation to ensure a smooth setup:

- [BookStack Official Documentation](https://www.bookstackapp.com/docs/)
- [Docker Documentation](https://docs.docker.com/)

<div class="callout info">
  <strong>Note:</strong>
  <ul>
  <li>The following steps are starting points; additional configuration or troubleshooting may be required.</li>
  <li>Embedding an iframe might necessitate adjusting BookStack's configuration settings.</li>
  <li>Deploying the Google Apps Script web app could involve modifying access permissions or deployment settings.</li>
  <li>Utilize tools like ChatGPT, Grok Deep Research, or other resources to assist with any challenges you encounter during this project.</li>
</ul>
</div>

## Tasks

### 1. Set Up BookStack with Docker

- Use the [official BookStack Docker guide](https://www.bookstackapp.com/docs/admin/installation/#docker-containers) or our internal repository if available.
- Ensure the BookStack app is accessible locally, e.g., `http://localhost:8080`.
- Log in using the default or configured credentials.

**Expected Outcome:** BookStack app is running locally in Docker.

---

### 2. Create a Google Apps Script Web App

1. Go to [script.google.com](https://script.google.com/).
2. Create a new project and paste the following code:

```javascript
function doGet() {
  return HtmlService.createHtmlOutput("<h1>Hello World</h1>");
}
```

3. Deploy the script as a web app:
   - Click **Deploy > New deployment**.
   - Click **Select type** and choose **Web app**.
   - Enter a description, e.g., "Hello World Deployment".
   - Under **Execute as**, select **Me**.
   - Under **Who has access**, select **Anyone**.
   - Click **Deploy**.
   - Authorize the script if prompted.
   - Copy the deployment URL.

**Expected Outcome:** A public URL that displays "Hello World".

---

### 3. Embed the Web App in BookStack

- Log in to your local BookStack instance.
- Create a new Page or edit an existing one.
- Use the following HTML to embed the web app:

```html
<iframe src="YOUR_WEB_APP_URL_HERE" width="100%" height="500" style="border: none;"></iframe>
```

<p class="callout info">
Embedding external content via iframes may require additional configuration in BookStack to allow such content. Refer to the <a href="https://www.bookstackapp.com/docs/">BookStack documentation</a> for guidance on adjusting settings to permit iframe embedding.
</p>

**Expected Outcome:** A page in BookStack that shows the embedded "Hello World" web app.

---

## Final Deliverable

Please record a short demo video showing:

- The BookStack app running in Docker.
- The embedded "Hello World" app functioning in BookStack.
- A brief explanation of your setup.

Upload the video to the following Google Drive folder:  
[Upload Link](https://drive.google.com/drive/folders/1ZbVUb2bljV5XLMLfLpL2TNg8QruoFWjg?usp=sharing)

---

## Questions or Issues?

If you run into any problems or have questions, reach out to Thian-Peng directly on Signal.