---
title: "Adding an HTML-only interface for Bulgur Cloud"
date: 2022-04-17T04:49:20-04:00
draft: true
toc: false
images:
tags:
- dev
- rust
- web
- bulgur-cloud
---
I have talked about my project [Bulgur Cloud](/bulgur-cloud-intro/) before. I'm
very happy with the user interface I've been building for it, which fully relies
on JavaScript with React. Well, React Native with React Native for web
specifically. The nice thing about is that I can reuse most of my code for
mobile and desktop applications, without resorting to Electron.
I also want to keep in mind though that sometimes you want a web page to work
without JavaScript. Maybe it's a basic text-based browser like Lynx, or it's
someone on a slow device that can't run a web app.
So I decided to experiment with a basic HTML interface for Bulgur Cloud. And it
was shockingly easy! With maybe 5 or 6 hours of work, I was able to get a
read-only interface off the ground, and I was able to reuse a lot of the code I
had written for the Bulgur Cloud API that the web app interface uses.
The key packages in my experiment are [askama](https://crates.io/crates/askama)
with [askama_actix](https://crates.io/crates/askama_actix), and
[rust-embed](https://crates.io/crates/rust-embed). Askama is a template
rendering engine which builds the templates into rust code. `askama_actix` adds
support for the Actix framework so I can return a templated page from a route,
and Actix will finish rendering and serving the page for me. Finally,
`rust-embed` allows you to embed files into your executable binary, which is
great because you can ship a single binary which includes all the files you
need!
![A web page with the name "kaan" and a link "Logout" at the top. Below is a list of files and folders. The bottom has some text noting Bulgur Cloud is open source, and that this is the HTML-only version.](/img/bulgur-cloud-basic-html.png)
It's all hand-written HTML and CSS. It was very quick to get all of this
working. Once the web app is done, I'll come back to this interface to add full
functionality!