Adding am HTML-only interface for Bulgur Cloud

2022-04-17 05:07:30 -04:00 · 2022-04-17 05:07:30 -04:00 · 396056db87
parent 335bec3be7
commit 396056db87
2 changed files with 46 additions and 0 deletions
--- a/content/img/bulgur-cloud-basic-html.png
+++ b/content/img/bulgur-cloud-basic-html.png
--- a/content/posts/2022.04.17.building-a-website-in-rust-with-no-javascript.md
+++ b/content/posts/2022.04.17.building-a-website-in-rust-with-no-javascript.md
@ -0,0 +1,43 @@
+---
+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!