Oluwasetemi

Prerequisites

• Use Node.js v24. Trusted Publishing does not work on earlier versions of Node.js.

Steps

1. Go to "Account > Access Tokens" and click "Generate Access Token".
2. Give the new token "read and write" persmissions to "All packages".
3. If you have 2FA enabled on npm (which you should), check the "Bypass 2FA" checkbox neatly hidden in the UI. Otherwise, npm will fail with an error demanding an OTP during automatic publishing.
4. Create the token.

Oluwasetemi

// Run this command to generate base config and vs code settings:
// pnpm dlx @antfu/eslint-config@latest

import antfu from "@antfu/eslint-config";

export default antfu({
  type: "app",
  typescript: true,
  formatters: true,
  stylistic: {

Oluwasetemi

/* eslint-disable node/no-process-env */
import type { ZodObject, ZodRawShape } from "zod";

import { ZodError } from "zod";

export default function tryParseEnv<T extends ZodRawShape>(
  EnvSchema: ZodObject<T>,
  buildEnv: Record<string, string | undefined> = process.env,
) {
  try {

Oluwasetemi

const path = require('path');

const SOURCE = 'src';
const SOURCE_PATH = path.resolve(SOURCE)  + '/';

const removeSourceDirName = path =>
    path.replace(new RegExp(`^${SOURCE}\/?`, 'gi'), '');

Oluwasetemi

import * as React from "react";

type ThemeConfig = "system" | "light" | "dark";
type ThemeName = "light" | "dark";
// Custom themes are keyed by a unique id.
type KeyedThemes = {
  [k: string]: {
    config: ThemeConfig;
    themeName: ThemeName;
  };

Oluwasetemi

import * as React from "react";

type Theme = "system" | "light" | "dark";

const STORAGE_KEY = "theme";
const VALID_THEMES: Theme[] = ["system", "light", "dark"];
const DARK_MODE_MEDIA_QUERY = "(prefers-color-scheme: dark)";

function getAppTheme(): Theme {
  if (typeof window !== "undefined") {

Oluwasetemi

{
  "name": "workshop-computer-validator",
  "version": "1.0.0",
  "description": "I use this to validate people's computers have the proper versions of node and npm installed for a workshop",
  "bin": "./validate-system.js",
  "dependencies": {
    "semver": "7.1.3"
  }
}

Oluwasetemi

import React, { Suspense, useState } from "react";
import { unstable_createResource as createResource } from "react-cache";
import {
  Combobox,
  ComboboxInput,
  ComboboxList,
  ComboboxOption
} from "./Combobox2.js";

function App({ tabIndex, navigate }) {

Oluwasetemi

// All you need to do is add a font that has pretty good itlaics support i.e Fira, Operator, etc. and then add these two params to your existing User settings.
// Tested in Monokai Sharp and Super One Dark

{
"editor.fontFamily": "'Operator Mono', Menlo, Monaco, 'Courier New', monospace",
"editor.tokenColorCustomizations": {
        "textMateRules": [
            {
                "scope": [
                    "comment",

Oluwasetemi

/* bling.js */

window.$ = document.querySelectorAll.bind(document);

Node.prototype.on = window.on = function (name, fn) {
  this.addEventListener(name, fn);
}

NodeList.prototype.__proto__ = Array.prototype;