From a6a1bb9da3e5e4e8d79714c1a9cad55fac67e2b3 Mon Sep 17 00:00:00 2001 From: Daniel Olsen Date: Sun, 18 Jul 2021 04:23:34 +0200 Subject: [PATCH] add prject-blog-blogpost --- content/2021-07-17-project-website.md | 124 ++++++++++++++++++++++++++ nix/sources.json | 16 ++-- 2 files changed, 132 insertions(+), 8 deletions(-) create mode 100644 content/2021-07-17-project-website.md diff --git a/content/2021-07-17-project-website.md b/content/2021-07-17-project-website.md new file mode 100644 index 0000000..6869dd2 --- /dev/null +++ b/content/2021-07-17-project-website.md @@ -0,0 +1,124 @@ ++++ +title = "Project Showcase: Blog" +date = 2021-07-17 +updated = 2021-07-18 + +slug = "projet-blog" +[taxonomies] +categories = ["Technical", "All"] +tags = ["Nix", "Zola", "Web Assembly", "Python", "Matrix"] ++++ + +I'm going to write a series of blog posts on some of the projects I've worked on, +and what would be better to start with than this very website? + + + +## Zola + +For the blog I used the static site generator [Zola](https://www.getzola.org/), +it's rust based and I think it keeps a nice balance between "keeping it simple" +and having nice quality of life features. After trying things like [Gatsby](https://www.gatsbyjs.com/), +[Jekyll](https://jekyllrb.com/), and [Hugo](https://gohugo.io/) +I've found myself really enjoying this one. A very good first impression! + +Zola has a themes feature like most SSGs, I'm using my own fork of [even](https://github.com/dali99/even), +which's only current difference from upstream is that it has a python webassembly [shortcode](https://www.getzola.org/documentation/content/shortcodes/) and a commenting system. + +I picked `even` mostly for its \\(\KaTeX\\) support and simple design. + +## Python WASM + +{% python() %} +print("Hello World") +{% end %} + +Try running the code above with the `Run` button! +The codeblock is even editable by the user. Click inside and edit it to print your name +or something! + +This works by using [Pyodide](https://pyodide.org/), a complete python interperator compiled to WASM! +It uses some magic from [pyodide/pyodide#8 (comment)](https://github.com/pyodide/pyodide/issues/8#issuecomment-772024841) to reroute stdout to the fake console. + +You should definetly play around with it, it even handles `input()`! (click cancel to send EOF or whatever) + +I plan on maybe using this with stuff like matplotlib to generate some cool interactive graphs in the future. + +While very cool, hitting that run button does download like 8MB of js and wasm data. +So I decided not to preload it, and rather grab it when ran whilst providing a warning by the button. +Luckilly future presses of should be cached by your browser... I hope... + +## Cactus Comments + +I'm a big fan of [Matrix](https://matrix.org/), so when [Cactus Comments](https://cactus.chat/) was announced in [#twim:matrix.org](matrix:r/twim:matrix.org?via=matrix.org&via=dodsorf.as) I had to jump on it. + +Embedding it was super easy and I think it really exemplifies that matrix is a useful tool for many more things than chat! + +When you comment, I get a ping over matrix, and I can reply or react to the comments right in my chat program. + +To check out the comment system of this post you can join the matrix room at [#comments_dandellion-xyz_UHJvamVjdCBTaG93Y2FzZTogQmxvZw==:cactus.chat](matrix:r/comments_dandellion-xyz_UHJvamVjdCBTaG93Y2FzZTogQmxvZw==:cactus.chat). +(I originally used the slug for the identifier for these comment boxes, but changed it to base64 of the title. Not the smartest choice I've ever made...) + +## Building + +For development I have a nix-shell with zola in it and just clone the theme into themes manually. +But for deploying the website I actually made a cute litle package for it which is used together with the nginx module: +```nix +let + even = pkgs.fetchFromGitHub { + owner = "dali99"; + repo = "even"; + rev = "730a85d3fa1d54569cc8d7d2d162461d955572ce"; + sha256 = "0d04xas3mml0n1j64d4gl292bbhdrn02cmjxpjqglbimd4y4cn64"; + }; + dandellion-xyz = pkgs.stdenv.mkDerivation { + pname = "dandellion-xyz"; + version = "2021-03-04"; + nativeBuildInputs = [ pkgs.unstable.zola ]; + + src = pkgs.fetchFromGitHub { + owner = "dali99"; + repo = "dandellion-xyz"; + rev = "169945c0a2bfc142f21beedd5de73918e5118e7e"; + sha256 = "0vjllyas7s8lzhqbn907xg9ma97339qf4iq8bl6fmdd0nfksbivf"; + }; + + buildPhase = '' + mkdir themes + ln -s ${even} themes/even + zola build + ''; + + installPhase = '' + mkdir -p $out + mv public/* $out/ + ''; + }; +in +{ + services.nginx.virtualHosts."dandellion.xyz" = { + enableACME = true; + forceSSL = true; + + root = dandellion-xyz; + }; +} +``` + +This works well, but has the downside of me needing to change those hashes every time I want to update the site. +No push-to-deploy gitops stuff going on here. Not to mention having to rebuild the entire system just to deploy a website! + +I'll probably look into setting something with a litte better UX in the future. +Maybe I'll let [Hydra](https://github.com/NixOS/hydra) build it + +For now though it's not _too_ too bad, and it gives me some incentive to proof-read my stuff before pushing it live... + +## Wrap up + +And that's all, result is served with [nginx](https://www.nginx.com/), with certs from [Let's Encrypt](https://letsencrypt.org/), running on [NixOS](https://nixos.org/) + +In the future I hope to take some time to move some of the files currently served from the CDNs so stuff won't randomly break, +and to change that awful comic sans title the website seems to fall back to on Windows. (Finding out about that was a little embarassing) + +Thanks for reading. Hopefully I'll have some more interesting blogposts in the future! +Feel free to ask questions in the comments! diff --git a/nix/sources.json b/nix/sources.json index c69bf6a..b0fd8d4 100644 --- a/nix/sources.json +++ b/nix/sources.json @@ -5,22 +5,22 @@ "homepage": "https://github.com/nmattia/niv", "owner": "nmattia", "repo": "niv", - "rev": "af958e8057f345ee1aca714c1247ef3ba1c15f5e", - "sha256": "1qjavxabbrsh73yck5dcq8jggvh3r2jkbr6b5nlz5d9yrqm9255n", + "rev": "e0ca65c81a2d7a4d82a189f1e23a48d59ad42070", + "sha256": "1pq9nh1d8nn3xvbdny8fafzw87mj7gsmp6pxkdl65w2g18rmcmzx", "type": "tarball", - "url": "https://github.com/nmattia/niv/archive/af958e8057f345ee1aca714c1247ef3ba1c15f5e.tar.gz", + "url": "https://github.com/nmattia/niv/archive/e0ca65c81a2d7a4d82a189f1e23a48d59ad42070.tar.gz", "url_template": "https://github.com///archive/.tar.gz" }, "nixpkgs": { - "branch": "nixpkgs-unstable", + "branch": "change-zola-cargo-sha", "description": "Nix Packages collection", "homepage": "", - "owner": "NixOS", + "owner": "dali99", "repo": "nixpkgs", - "rev": "123db833485edf8df83f95ef2888113390768686", - "sha256": "1cspmvb0gwh27ifp27pcaqkwl5blsg11samm09csl8h5qlqv3h19", + "rev": "c051d5fcbfd6b616cdce190ef6c8371e320b3a0c", + "sha256": "08qhaai9q4j98k53x202i51zyv0a3zzinyc7fwcjwsk3mkfygsa2", "type": "tarball", - "url": "https://github.com/NixOS/nixpkgs/archive/123db833485edf8df83f95ef2888113390768686.tar.gz", + "url": "https://github.com/dali99/nixpkgs/archive/c051d5fcbfd6b616cdce190ef6c8371e320b3a0c.tar.gz", "url_template": "https://github.com///archive/.tar.gz" } }