# MassiveBox's Website

A statically generated website and blog, built with [Astro](https://astro.build/) and based on the
[Astro Paper](https://astro-paper.pages.dev/) theme.

Check it out at [massive.box](https://massive.box).

## Getting started

```shell
npm install
npm run dev
```

In order to compile the site, run
```shell
npm run build
```
The website will be built to the `./dist` folder.

## Blogging with Joplin

You can use Joplin to write and manage your blog posts, instead of just placing the Markdown files in the
`src/content/blog` folder.

1. Install [Joplin](https://joplinapp.org/)
2. Start the Web Clipper Service: Tools > Options > Web Clipper > Start Web Clipper Service
3. Run `npm run joplin`
4. Allow the request for an API token on the Joplin app
   - You can also place the Joplin token in an `.env` file in the format `JOPLIN_KEY=your_token`.

The script will look for a notebook named `Blog`. It will then download all notes from that notebook, alongside their
attachments, and place them in the `src/content/blog` folder.

You can embed attachments in your notes, and they will work normally in the blog.  
You might need to restart the development server after running the Joplin script.

In order, to have an ogImage (also known as article cover):
1. Add the image to the note, and change the alt text to `ogImage`. It will look like this:
    ```
   ![ogImage](:/0f409e2b6faf44e48c5c0d99453d02c0)
   ```
2. Copy the attachment ID (in this example, it's `0f409e2b6faf44e48c5c0d99453d02c0`)
3. Paste it in your frontmatter like this:
    ```
   ogImage: ./0f409e2b6faf44e48c5c0d99453d02c0
   ```
   Note the `.` (dot) instead of `:` (colon)!

## Uploading to WebDav

I have found that a quick and easy way to deploy the website is via WebDav and compatible software on the server side, like
[this](https://github.com/mholt/caddy-webdav) plugin for Caddy.

To simplify uploading to WebDav, I have created a script, which can be run with `npm run upload`.

You have to set the following environment variables:
- `WEBDAV_ENDPOINT`: The URL of the WebDav server, e.g. `https://example.com/webdav/`
- `WEBDAV_USERNAME`: The username for the WebDav server
- `WEBDAV_PASSWORD`: The password for the WebDav server
- `WEBDAV_PATH`: The path to the folder on the server, e.g. `/public_html/` (default: `/`)

The script will upload the `./dist` folder, so make sure you run `npm run build` before the upload script.  
Note that running the script will clear the remote folder before uploading the files.

## License

The original [Astro Paper](https://github.com/satnaing/astro-paper) is licensed under the MIT License, Copyright © 2025 
[Sat Naing](https://github.com/satnaing).  
Any change to the original code is licensed under the AGPLv3 License, Copyright © 2025 MassiveBox.