Yuhei Yasuda yuheiy

jsconf2024 で発表したスライドのソースコードだが、テキスト版のが読みやすい気がしたので公開する。画像のデッドリンクは面倒なので、気が向いたら…

Someone asked me about the spacing scale in Braid and I thought I'd share my thoughts here. For reference this is what they were referring to: https://github.com/seek-oss/braid-design-system/blob/ecdd7f3060cab2a6675cde7dd45bcd510caa268b/packages/braid-design-system/src/lib/themes/baseTokens/apac.ts#L166-L175

I could maybe have turned this into a blog post, but I'm just dropping my rough thoughts here instead.

In practice, the T-shirt size scale felt like indirection because our designers didn't think in those terms so it actually got in the way of developers and designers communicating.

The names also weren't really semantic in the sense that we couldn't confidently change them later without breaking a lot of layouts.

It also made it difficult to name new values to the scale, e.g. if we needed to add a value between "small" and "medium", what would we call it? I've seen things like "xmedium" in other systems before which shows how awkward this can get.

この○○が金やちやほやされるために技術ブログを書いていると思っているのかァーッ！！

技術ブログを書いていることをアフェリエイト目的とか、PV目的だとか言われた時に。

なるほど完璧な開発プロセスっスねーーーっ不可能だという点に目をつぶればよぉ〜

一見完璧に聞こえるけど、どう考えたって上手く回らない開発プロセスの説明を受けた時に。

理解不能理解不能・・・あ、理解可能

ようやく理解できた時に。

お前は1つの修正が終わったらキチっとコミットしてから次の修正に入るだろう？　誰だってそーする。俺もそーする。

tsconfig.json の設定についてのメモ書きです。

Node.jsのバージョンごとの設定

target は変換後のコードのECMAScriptバージョンを指定するたとえば、Node.js 14はES2020をサポートしている。そのため、Node.js 14向けのコード(サーバなど)ならtarget: "ES2020"を指定することで、余計なTranspileが省かれててコードサイズや実行時間が最適化される。

	// Types for the result object with discriminated union
	type Success<T> = {
	data: T;
	error: null;
	};

	type Failure<E> = {
	data: null;
	error: E;
	};

	import gzip

	def gzip_search(query: str, candidate_chunks: list[str], top_k: int=1):
	"""
	文字列ベースで類似したテキストチャンクを推定するアルゴリズム.
	`query`, `chunk`, および`query + " " + chunk`をそれぞれgzipで圧縮し、編集距離のようなものをベースに評価する.

	Parameters:
	query (str): 検索クエリとして使用する文字列.
	top_k (int, optional): 返される類似チャンクの上位k個を指定する (default: 1).

	// Turn all HTML <a> elements into client side router links, no special framework-specific <Link> component necessary!
	// Example using the Next.js App Router.
	import { useRouter } from 'next/navigation';
	import { useEffect } from 'react';

	function useLinkHandler() {
	let router = useRouter();

	useEffect(() => {
	let onClick = e => {

	/**
	* @type {import('prettier').Options}
	*/
	module.exports = {
	plugins: [require.resolve('prettier-plugin-astro')],

	overrides: [
	{
	files: '*/.astro',
	options: { parser: 'astro' }

	#! /bin/bash

	# Author: Birgit Olzem aka @CoachBirgit
	# Version: 1.0
	# Created on: January 19th 2022
	# Requires WP-CLI, cURL, wget

	# credits for the origin idea to Jeremy Herve: https://jeremy.hu/dev-environment-laravel-valet-wp-cli/

	### How to use