Curation / The Stream

The anti-social media stream. Otherwise known as my personal feed. Similar to Linus's stream by Linus Lee.

Jun 20, 2024, 11:11 AM
Running ESM on Node REPL

d3 v7 is packaged as ESM only. That made it difficult to use in the Node.js REPL. From this StackOverflow thread, I found a solution.
```
let d3;
import("d3").then((module) => {
  d3 = module;
});
// Then you can use d3 anywhere once the promise is resolved.
```
Jun 18, 2024, 11:19 AM

Package Dependency for @observable/plot

Extremely esoteric bug. I’ve had an open issue for the past three months related to this other issue. I couldn’t figure out why npm’s registry would pull an older version of d3-scale-chromatic when I upgraded the @observable/plot library. As a future note for myself, if I run into this issue again, I’ll have to go into the package-lock.json file and update d3-scale-chromatic to v3.1.0.
Jun 14, 2024, 3:56 PM

Stochastic Parrots

From this ACM paper, On the Dangers of Stochastic Parrots, the hypothesis is maybe these LLMs are parroting back what we already know and aren’t learning. We can probably, maybe, safely say that is no longer the case.
May 2, 2024, 5:25 PM

Students Have the Right to Protest Apartheid

From The Progressive: Students Have the Right to Protest Apartheid. My lovely fiancé wrote a piece about the student protests for Palestine.

While the Republican-led Congress has used its power to condemn any protests on behalf of Palestinians, where was the same outrage and zealousness when white nationalists came to college campuses?
Apr 24, 2024, 11:16 AM
TIL importmap

I forked a small demo from Wes Bos and ran in on my own sandbox. It seems much cleaner than using a script tag per each dependency, and works on all major browsers.

In my little demo app, I placed the importmap in the head of the document. I’m using react as well as my own utils file to test out the functionality.
```
<script type="importmap">
  {
    "imports": {
      "react-dom": "https://esm.sh/react-dom",
      "react": "https://esm.sh/react",
      "utils": "./utils.js"
    }
  }
</script>
```
Read more about importmap on MDN

From there, I imported these libraries in a script module.
```
<body>
  <div id="app"></div>
  <script type="module">
    /* eslint-disable */
    import { useState } from "react";
    import { createRoot } from "react-dom";
    import { formatMoney } from "utils";
    createRoot(document.querySelector(`#app`)).render(formatMoney(100.2365));
  </script>
</body>
```
I had a hiccup with [plugin:vite
] as I found countless others have, so I wrote a custom bun server to host this project. Hopefully there’s a better setup I can find with Vite using importmap in the future.

Apr 23, 2024, 2:32 PM

Start and end of day offsets for current system time zone offset using Luxon

Luxon datetime library defaults startOf and endOf methods to UTC. But this isn’t great for end users who don’t live in UTC / GMT. To offset this, we need to grab the time zone offset from the user’s system.

const systemTimeZoneOffsetInMinutes = new Date().getTimezoneOffset();  
const systemTimeZoneOffsetInHours = systemTimeZoneOffset / 60;

Then we can add the offset to the Luxon datetime object.

const now = DateTime.now();
const startOfLocalDay = now.startOf('day').plus({ hours: systemTimeZoneOffsetInHours });
const endOfLocalDay = now.endOf('day').plus({ hours: systemTimeZoneOffsetInHours });

Apr 18, 2024, 4:14 PM

The "Boring" Stack

I was listening to this podcast: The boring JavaScript stack featuring Kelvin Omereshone (K.O.O) (JS Party #319). My takeaway is I should be using a boring stack to build my business ideas. Leave the shiny new toys for tinkering and use something stable.

While Kelvin talks about the benefits of using Sails, I was thinking about the other “boring” things that constitute a boring stack. It goes beyond tecnologies, like how to run a business, how to organize your team, and how to market the product. And when those things are boring, they are unsexy and oftentimes neglected.

Related: Kelsey Hightower’s nocode

The best way to write secure and reliable applications. Write nothing; deploy nowhere.

Apr 15, 2024, 3:22 PM

Obsidian Templater - Updating Properties on Daily Notes

I wrote a script that updates my daily notes to add properties. Since I’ve been using Obsidian for awhile, properties was introduced much later. I’ll walk through my code.

// Get the current file title, which is in a common date format: YYYY-MM-DD
const currentFileTitle = tp.file.title;

// Set folder you want to get latest file for here
const folder = "Calendar/Personal Reviews/journal and daily review/2022";

// Get all files in that folder, including nested folders
const filesInFolder = app.vault.getMarkdownFiles().filter(file => {
    return file.path.startsWith(folder);
});

// Sort files by file name
filesInFolder.sort((a, b) => a.basename < b.basename ? 1 : -1);

// Get the index of the current file
const currentIndex = filesInFolder.findIndex(file => file.basename === currentFileTitle);

// Get basename of previous and next TFiles to be used in link
let previousEntry = '';
let nextEntry = '';

// Wrap it around a try catch block in case there's something wrong with getting these basenames
try {
    previousEntry = `[[${filesInFolder[currentIndex + 1].basename}]]`
} catch (err) {
    console.error(err);
}
try {
    nextEntry = `[[${filesInFolder[currentIndex - 1].basename}]]`
} catch (err) {
    console.error(err);
}

Here’s my template that the templater plugin uses in markdown.

<%*This is where the JS code above is inserted-%>
---
tags: 
    - logs/daily 
created: <% currentFileTitle %>
previousEntry: 
    - "<% previousEntry %>"
nextEntry:
    - "<% nextEntry %>"
---

I’ve had to modify this depending if the file already has properties or not.

Apr 12, 2024, 11:59 AM

Elicit UX

I got a chance to play around with Elicit and was reading through Adam Wiggin’s Tweet. I think I might make a quick web app trying multi-column queries about a particular topic and allow more of a computational style of conversational chat.

Computational style of conversational AI using Elicit

Apr 11, 2024, 3:37 PM

Setting up SVGR with Jest

I was getting some errors in my unit test output because I converted my SVGs to React components using SVGR. As such, I needed to re-configure Jest accordingly.

Create the mock file

export default "svgr-div"; // This is the kebab case that jest is looking for
export const ReactComponent = "div";

// @see https://react-svgr.com/docs/jest/ for setup

Configure jest in package.json

{
  "jest": {
    "moduleNameMapper": {
      "\\.svg": "<rootDir>/PATH_TO_FOLDER/svg.js"
    }
  }
}

Previous Page 2 Next