Website on Voltaicforge

Neovim setup for better writing

Sat, 17 Jun 2023 00:00:00 +0000

Setting up nvim for writing

I’ve been getting into using nvim a lot of late, and thus wanted to integrate it well into my website workflow.

One fault I’ve seen in my older posts during my redesign was some spelling mistakes and poor grammar. I used to write in other editors and then copy & paste into Grammarly, which was cumbersome. Of course, this meant at times I would either forget or not be bothered to do so.

The other thing I used to find is because of how cumbersome it was to write I ended up not bothering to write.

So the goal of any new setup needed to be an easy as possible workflow for writing and getting the post to GitHub, and build in spell/grammar checking.

Better language with ltex-ls, ltex-extra, and language-tools

As I was already running a language-tools docker instance in my cluster I was keen to utilise it as well, over sending my data out to another website for review. I found ltex-ls a good candidate for integrating spell/grammar checking, so I added it to my Lazyvim config.

After some fiddling with it, I found that I wasn’t able to add Neovim’s default additional dictionary words to it—the docs show its able to load an external file for user added words. However, this isn’t functional in ltex-ls. You can make a workaround by running lua to load the nvim user dictionary words, then pass them into the model. This doesn’t reload unless you restart nvim, which can be a tad annoying as it adding a word doesn’t remove the error until you restart nvim.

Using ltex-extra provides a wrapper to enable some of these functions and adds code actions. I was able to set up my nvim directory as the location for user added words, and it loaded this dictionary at load/new words being added.

So now, a [d or ]d takes me to the next diagnostic, <leader>cd will show me a popup with the diagnostic text, and <leader>ca brings up code actions with proposed fixes or the ability to add words to the dictionary. <leader>sd will bring all document diagnostics in a telescope window.

First to add it in as a requirement for Mason.

~/.config/nvim/lua/plugins/lsp.lua

{
  "williamboman/mason.nvim",
  opts = function(_, opts)
    vim.list_extend(opts.ensure_installed, {
      "stylua",
      "selene",
      "luacheck",
      "shellcheck",
      "prettier",
      "shfmt",
      "black",
      "isort",
      "flake8",
+     "ltex-ls",
    })
  end,
},

Then to set it up in nvim-lspconfig ~/.config/nvim/lua/plugins/lsp.lua

  {
    "neovim/nvim-lspconfig",
    opts = {
      ---@type lspconfig.options
      servers = {
+       ltex = {
+         on_attach = function(client, bufnr)
+           print("Loading ltex from ltex_extra")
+           require("ltex_extra").setup({
+             init_check = true,
+             load_langs = { "en-AU" }, -- table <string> : language for witch dictionaries will be loaded
+             log_level = "error", -- string : "none", "trace", "debug", "info", "warn", "error", "fatal"
+             path = vim.fn.expand("~") .. "/.config/nvim/spell/",
+           })
+         end,
+         settings = {
+           ltex = {
+             completionEnabled = true,
+             statusBarItem = true,
+             languageToolHttpServerUri = "https://language-tools.trux.dev/",
+             checkFrequency = "save",
+             language = "en-AU",
+             additionalRules = {
+               enablePickyRules = true,
+             },
+           },
+         },
+       },
        ansiblels = {},
        bashls = {},
        dockerls = {},
        html = {},
        gopls = {},
        marksman = {},
        pyright = {
          enabled = false,
        },
        vimls = {},
      },
      setup = {},
    },
  },

And once satisfied in the results, disable Lazyvim’s spellcheck, to avoid having two sets of spell checking occurring, especially as Neovim isn’t aware of the user words you are adding via ltex-extra.

~/.config/nvim/lua/config/autocmds.lua

-- Disable spelling
vim.api.nvim_del_augroup_by_name("lazyvim_wrap_spell")

This has given me solid grammar advice direct into neovim. Next steps for this would be to build a more custom docker with specific n-gram data.

Zen mode with zen-mode and twilight

While I have not had a lot of experience with zen mode editors, I do think this could also help me write, as I’m easily distracted. zen-mode hides everything and just gives a reduced width view of just the text you are editing. twilight dims everything on the screen except the current block you are working on, helping you focus on your current text.

~/.config/nvim/lua/plugins/misc.lua

{
  "folke/zen-mode.nvim",
  cmd = "ZenMode",
  opts = {
    plugins = {
      gitsigns = true,
      tmux = true,
      kitty = { enabled = false, font = "+2" },
    },
  },
  keys = { { "<leader>z", "<cmd>ZenMode<cr>", desc = "Zen Mode" } },
},

-- twilight
{
  "folke/twilight.nvim",
  dependencies = {
    {
      "nvim-treesitter/nvim-treesitter",
    },
  },
},

Website redesign with Hugo & Cloudflare pages!

Mon, 22 May 2023 00:00:00 +0000

Introduction

I wanted to give you a quick update about some changes I’ve made to my website. Previously, my site was built using Jekyll and hosted on GitHub Pages, but I’ve recently migrated it to a new platform: Hugo, powered by Cloudflare Pages. I wanted to take a moment to explain why I made this switch and how it benefits both me and you as a reader.

Reason for the Migration

While Jekyll and GitHub Pages served me well, I was looking for a more streamlined and efficient workflow for managing my site. After exploring various options, I decided to switch to Hugo, a static site generator, combined with Cloudflare Pages for hosting and delivery.

Unfortunately, I found that Jekyll was somewhat slow at times and its site methodology required me to bastardise the template quite a bit, leading to it being somewhat painful to work with at times. I just want to be able to add a new post, save and git push it into the ether, with confidence it would be live shortly thereafter.

Benefits of Hugo and Cloudflare Pages

The move to Hugo and Cloudflare Pages brings several advantages. Firstly, Hugo offers a simpler and faster site building process, allowing me to create and update content more efficiently. Hugo being written in Go makes it quite a lot quicker than Jekyll’s Ruby pipeline (Pity Hugo isnt Rust…)

Cloudflare Pages, on the other hand, offer robust hosting capabilities and improved site delivery. With their global network of servers, my site now loads faster for readers around the world. The combination of Hugo and Cloudflare Pages ensures a seamless browsing experience with minimal downtime. Cloudflare workers are free for small traffic sites, and has a build pipeline that scans this sites github repo, builds it with a worker immedaitly on push and the new site is live quite quickly. I can also see a history of commits if I want to check a commit, and even build branches other main so I can adopt a branch -> push to dev -> check it looks OK -> PR for new post.

CI/CD Workflows and Automation

One of the highlights of this migration is the implementation of strong CI/CD (Continuous Integration/Continuous Deployment) workflows. I’ve set up automated processes that handle tasks such as building, testing, and deploying my site whenever I make updates. This automation saves me time and ensures that the latest content is always available to you.

Conclusion

In summary, I’ve migrated my website from Jekyll/GitHub Pages to Hugo/Cloudflare Pages, aiming for a more efficient and optimized experience. The transition brings benefits like improved performance, streamlined workflows, and automated deployment. I hope you’ll enjoy the enhanced browsing experience, and I’m excited to continue sharing great content with you on this shiny new platform.

Responsive Images in Jekyll

Tue, 10 May 2016 00:00:00 +0000

Responsive images, the Jekyll way

One of the first things I did in my exploration of Jekyll was to go away from using GitHub to generate the site. The first limitation that frustrated me was the inability to use plugins. Currently, I only use one plugin that I couldn’t use on GitHub - which relates to responsive images.

I shoot most of my pictures that I’m using for the site on my DSLR - which means I’m getting large pictures. I export from Lightroom via a preset I have setup. However, the process of resizing images for the web is an additional step in publishing a post. I want to be able to toss the image into a folder, type out some text in Notepad++, and upload the site without worrying about image size, resizing, srcset, etc.

Without plugins, this means that all the images you have on your site are going to be resized in the browser - which is a big detractor for page load speed and general usability of the site.

So I set out to find a plugin that would do responsive images (via srcset or picture tags) as well as automatically resizing the images, so I didn’t have to worry about anything except the parent image.

Jekyll-picture-tags

After a bit of searching, I found three candidates for creating responsive images.

I found Jekyll-srset broken as of May 2016, and it did not generate multiple images. I couldn’t get Jekyll-responsive-images to run properly either.

Jekyll-picture-tags works a treat after some setup. Unfortunately, it has poor error messages (generic Ruby messages) and was tough to debug.

After installing into my gemfile, I ended up on the following addition to _config.yml

picture:
  source: "images"
  output: "images/resize"
  markup: "picture"
  presets:
    default:
      ppi: [1, 1.5, 2.0]
      source_medium:
        media: "(min-width: 40em)"
        width: "600"
      source_default:
        width: "600"

Info: Ensure your indentation is correct if copying a config - misalignment’s will give you a dreaded generic error message Liquid Exception: undefined method [] for nil:NilClass in _drafts/JekyllAnchors.md/#excerpt

Warning: Also ensure your base-url in _config.yml is set to an empty string "" (base-url: ""). Without this, the images won’t be found or load correctly, even if it generates correctly.

After much fiddling and debugging, I had it working. I decided to add it to my shortcuts in Notepad++ using FingerText. I came up with the following code, which also allowed me to have an alt and title text in the tag.

FingerText enables me Notepad++ users to write blocks of text with a single keyword (amongst other uses). So now when I type respimage with a tab immediately after, the below code will be automatically inserted and the text between $[![ and ]!] will be selected upon each tab to allow me to enter the relevant details. Entering an Image Filename (from my /assets/images/ folder) and an Image title defines the image, and the Preset name will tell Jekyll-picture-tag which config branch to run - which dictates the which sets of images to include.

{% capture imagesrc %}$[![Image_Filename]!]{% endcapture %}
{% capture imagetitle %}$[![Image_Title]!]{% endcapture %}
<a href="/assets/images/{{ imagesrc }}">{% picture $[![Preset_name]!] {{ imagesrc }} alt="{{ imagetitle }}" title="{{ imagetitle }}" %}</a>
{: .text-center}

Warning: Jekyll-picture-tag also hates spaces in picture filenames. Not that you should have spaces in filenames anyway, but that’s another thing I stumbled on.

I now have images that (should) be responsive for mobile and desktop, and I don’t have to do the resizing myself.

New Site

Sat, 09 Apr 2016 00:00:00 +0000

New Site hits the Internet

Finally found the inspiration to build a nice personal site. I’ve been toying with Wordpress for some time, but it’s quite bloated for a nice basic site. And then there’s the security hassles, addons, database setup, theme setup, etc. It’s so far beyond what I want to be doing for a personal site it’s not funny.

I’ve wanted to be getting posts back online about projects and tinkering I’m always doing, so that will be the aim for this site. I’ve also been looking for some time for a better layout to be able to post about projects. The default blogging layout to be inadequate for something project like, or anything that is posted about over time. Making a visitor have to browse multiple posts to piece together the history of one project really doesn’t work.

With what I’m crafting here, I will be able to have static pages for projects that can be appended to over time to add up to one larger page per project. Most likely with blog posts for updates or miscellaneous stuff that fits on the site. I’ll also be planning to write up some mini-guides for things I’ve come across in my hobby projects.

I’ve gone with an AWS approach, along with using Jekyll. This gives me a simpler way of posting and updating a site without the big CMS overhead, and after skipping over static site generators as being probably more effort than their worth, I went back to check out Jekyll, then using Jekyll with S3 and AWS. And that was the end of that search.

I thoroughly enjoy the ease of use of Markdown for writing HTML and if you haven’t checked it out and have some basic HTML background, definitely check it out.

Now its time go get cracking writing up all the projects past and present and getting the site filled out.