Weekly Review W45

published: November 9, 2025 estimate: 6 min read view-cnt: 26 views

I haven’t found the balance between coding and writing yet.

I hope this weekly review provides some insight for my future self to find the balance.

Writings I’ve done in the week:

11/06 [ai] Web Accessibility: Building a Better Web for Everyone
11/05 [ai] Web Scraping with Browser DevTools: A Practical Guide
11/03 [ai] VIM: Your Developer Old Friend That Always Has Your Back
11/02 [hm] Plain Text for Personal Knowledge Management, Part 3

Missed three articles (expected 7 for the week)
3 out of 4 were AI-generated (expected at least a 1:1 ratio)

When I have some ideas on a topic but am too busy to write a full article, I use AI to generate an article on that topic.

How I Prompt AI For Generated Articles

Here’s my prompt to generate an article:

please help generate an article with following requirements:
- topic: {topic name}
- introduce the concept of {topic name}
- make a list of canonical resources for further reading
- make sure the article is less than 500 words
- generate the article in this folder "./ai-generated"
- make sure you use similar frontmatter to the other markdown files in the folder
- {specific requirements 1, 2, 3...}

Here are a few examples of specific requirements:

Web Accessibility:
- what are the major efforts to be made, who will benefit from a11y, and what is the size of the affected population
- focus on how a11y would also improve normal users' browsing experience
- name a few of the most well-known a11y improvements that benefit all users

Web Scraping:
- List a few of the most popular methods for web scraping
- Focus on web scraping directly using the devtools inside a browser
- Name a few of the most commonly seen patterns and demonstrate how to use devtools to scrape that data

VIM
- topic: VIM, developer's old friend that always has your back (yes, I named the post title for this one)
- talks about how knowing regex and bash commands along with VIM command mode could boost your developer life
- cover a few of the most well-known cases where a developer gains an instant boost via simple regex, bash, and VIM command combinations

What I learned from these three generated posts:

the more you know, the easier it is to validate the content (pretty straightforward)
- to be honest, I am not so familiar with the a11y area; I am only fascinated by the part about keyboard shortcuts
- the part where I asked AI for “improvements that benefit all users” didn’t impress me that much
- I think I would learn more from this topic after I understand “inclusive design” mentioned in the further reading
popularity of the topic MATTERS
- the code snippets provided in the web scraping are all legit
- there’s no need to change anything at all, it just works (shout out to the localStorage one, super useful for full-page refresh pagination)
- on the other hand, code snippets in the VIM article got me into a rabbit hole twice!

VIM Script Problems

AI gave a rename variables example which could be easily replaced by LSP variable rename
Then, I asked if there’s a one-liner command to diff two different versions of a file (controlled by git) side by side
The problem is that windo diffthis is bugged in both NeoVim and VIM for such a use case
If you pipe something after windo (e.g. git show), the command would simply run twice which is not the expected behavior
The workaround is to simply call diffthis twice.

I also spent tons of time figuring out the correct syntax to pull out the old version git show HEAD~3:#:.
However, I think it is mostly just a skill issue 🤣🤣
I then ran into this command to pull out the version without heavily guessing git show $(git log --format=\%h --skip=2 -n 1 -- #:.):#:.
The reason is that HEAD~3 doesn’t tell you if the requested file has been changed in that commit whereas git log with the skip flag would ensure the requested version is surely modified in that commit

Pretty messy, right? I doubt anyone would execute the command “like a breeze” My recommendation is to go straight to the plugin Fugitive
You can learn more from Vimcasts, the video is comprehensive, also remember to check the note section below the video for fast reference

That was the first rabbit hole. The second one is this :g/^import/.,/^$import$\@!/-1!sort -u
The original command :g/^import/d | let @a=@" | put a | sort u didn’t work at all
You need to consider that the global command executes line by line; thus, you need to append to the register in order to keep all the lines
You also need to consider the position of the cursor to put the content in the right place
Lastly, the sort command is an external command, and you need to prefix a minus sign to the option u

It’s amazing how many mistakes the LLM made in this simple case.
The one that uses negative lookahead \@! is the result I kept doing trial-and-error until it was correct, which is still a mess to type explicitly
The simplest solution IMHO is to visual select then simply execute the !sort -u command which the LLM failed to deliver during the process 😕

Anyway, it’s just a simple experiment to test the boundary of the LLM and explore the ergonomic portion of using VIM
(I don’t have the habit to sort import statements at all 🤣🤣)

Coding Part Done This Week

implement comment section, post reactions, and view counter
- store data in Supabase without hosting an additional web server
- ensure Lynx browser can read build-time fetched data
- add a few validation checks on the server side
adjust post list, start working on the post tags
implement a helper function to scrape all siblings innerText by consecutive “inspect element”

About The Web Scraping Helper

NO more specifying CSS classes or custom attributes.

Just open your devtools, use “inspect element” on two visually consecutive items, then, BOOM you have all the text you want in the clipboard.
The complete usage guide:

open devtools
initialize the helper
select the first element
(required by firefox) store the first element in $1
select the second element
call the helper function

This script is ready-to-use in Chromium via the snippets module

Step 4 is required by Firefox due to the lack of historical references (e.g. $1, $2…) in their console utilities

It is also possible to store the script inside a bookmarklet.

Step 4 and Step 6 can be eliminated once a proper “element selection” helper is implemented (the helper will include historical references, working around Firefox’s limitation).

Step 1 and Step 2 can be eliminated by encapsulating the helper into a browser extension

Teaser: I will publish an article about this tool once I implement the “element selection” helper.

Final Thought

AI-generated articles make mistakes especially in niche areas.
Luckily I am enthusiastic enough to get into the rabbit hole, since these topics (a11y, web scraping and VIM) are my hobbies as well

Supabase is indeed super useful. This is the third cloud-based database I’ve tried so far. The others were Planetscale and Turso.
Interestingly, each of them uses a different database under the hood
I hope this time I will develop a stronger bond with PostgreSQL, keeping my backend data safe and thriving!

Stay tuned for the upcoming web scraping helper and tag-based navigation
I’ll catch you in the next one! 😎