44 lines
2 KiB
Markdown
44 lines
2 KiB
Markdown
|
---
|
||
|
|
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!
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
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!
|