Welcome to the digital garden of Can Rau
Let me give you a little background story of myself.
Posts
Dynamically generate og:image using skia-canvas in Remix 💿
How to dynamically generate og:images for Social Media using `skia-canvas` in a Remix resource route.
How To: Install CouchDB on Fly.io
Explaining how to run existing Docker images and changing internal and (adding) external ports in your fly.toml
How to add images to WYSIWYG in Keystone v6
Tutorial on how to add a custom image component block field to Keystone's document field
CMS Thoughts
Some (non-exhaustive) thoughts I gathered over a few CMS's I've tried out recently
Remix upload to S3
Upload files to S3 compatible API - I'm using Backblaze B2 - with Remix and parseMultipartFormData
Dynamically generate OG:image using Remix 💿
How to dynamically generate OG:images using Remix resource routes, React JSX, TailwindCSS & Puppeteer
Accessibility
A11Y - Accessibility features supported by this website and on the roadmap
Find Twitter User ID
My way of finding my Twitter UserID in 2021 & 2022
How to add canonical URL to Remix 💿
Add canonical urls to you Remix website to avoid duplicate content penalties for better SEO
How to deploy Remix 💿 to fly.io using GitHub Action
How to deploy your Remix.run 💿 website to fly.io using GitHub Actions?
Bookmarks
A list of interesting links curated by Can Rau
RSS in Remix 💿
How to generate (beautiful) RSS feeds and in general web-feeds using Remix 💿?
My VSCode Settings
Sharing and explaning my VSCode settings.json
Todo comment parsing in Remix 💿
How to use a route to auto generate a list of all your `TODO:`, `FIXME:` (and more) comments
Generate directory trees in your terminal
A small reminder to myself as to how to generate tree like lists of a directory from the terminal, which can be really useful to illustrate something in a GitHub issue, tweet or comment.
Failed to resolve "fs" or "path" in Remix 💿
Bumped into issues importing node modules like "fs" and "path" in Remix recently, here's how I fixed it
Target every child except first in Tailwind
How to write a little TailwindCSS helper plugin to add a custom variant like `dark:`
Remix 💿 mdx-bundler and images
How to get mdx-bundler (by Kent C. Dodds) working with local images
Deno.run cmd arguments
fixme: desc
To Add or Remove trailing slashes?
Bumped into issues importing node modules like "fs" and "path" in Remix recently, here's how I fixed it
Gracefully close sub-subprocess using signals in Deno
How to terminate not only the main but also its subprocess and make sure the server frees the address it was listening on
ES6: Sort an array based on another array
Sorting an array of numbers & an array of objects based on another array of numbers/strings in JavaScript.
Rubber Ducking
How talking to non-techies (or rubber ducks) helps me fix my problems. Sometimes even before actually talking
<Link/> a universal gatsby-link wrapper
Automatically uses gatsby-link or <a> depending on the url and adds default props accordingly. Prevents 'reverse tabnapping'
window.GaiAma
A little easter egg exposing internals/meta data via the console for enthusiasts 🤓
gapa - aka git add --patch
How to keep your Git commits clean & atomic even if your workflow might be as messy as mine 😁
Query parent File node in GatsbyJS
Accessing file informations from Markdown/MDX nodes using GraphQL's inline fragments
ES6 object destructuring mandatory parameters
Use a small utility function in ES6 default function properties to throw error on missing required props
Gatsby Transformer Leasot
Make TODO:, FIXME: (and more) source code comments GraphQL queryable in your GatsbyJS site
Github GraphQL to recursively list all files in the directory
Query all repository files using GitHub's GraphQL API and gatsby-source-graphql
CSS-Only Fluid Typography
Responsive font-size using vw (viewport width), calc() and media queries to set boundaries
Remove UTM params using hitCallback in Google Tag Manager
Use Google Analytics hitCallback in Tag Manager to clean your URLs from campaign data, so they won't end up in Bookmarks