sindresorhus

Pure ESM package

The package that linked you here is now pure ESM. It cannot be require()'d from CommonJS.

This means you have the following choices:

1. Use ESM yourself. (preferred)
   Use import foo from 'foo' instead of const foo = require('foo') to import the package. You also need to put "type": "module" in your package.json and more. Follow the below guide.
2. If the package is used in an async context, you could use await import(…) from CommonJS instead of require(…).
3. Stay on the existing version of the package until you can move to ESM.

mjackson

import React from "react";

export type ColorScheme = "light" | "dark";

export default function useColorSchemePreference(
  defaultColorScheme: ColorScheme = "light"
) {
  let darkQuery = "(prefers-color-scheme: dark)";
  let [colorScheme, setColorScheme] = React.useState<ColorScheme>(
    typeof window === "object" && window.matchMedia

petamoriken

import { useEffect, useState } from "react";

/**
 * @example
 *   const matches = useMatchMedia("screen and (min-width: 560px)");
 *
 * @param raw
 */
export function useMatchMedia(raw: string): boolean {
  const [matches, setMatches] = useState(false);

mizchi

html を 画像化する https://github.com/gripeless/pico の、コアっぽい部分を抜き出した

手順

• html を svg の foreignObject (任意HTMLの埋め込み要素) に描画
• svg を XMLSerializer で data-uri 化
• new Image して img.src に data-uri を流し込む
• canvas に svg を読み込んだ img を renderImage する
• canvas.toDataURL("image/png") で任意のフォーマットで吐き出し

WebReflection

My FE/DOM Libraries

a gist to recap the current status, also available as library picker!

Minimalistic Libraries

do one thing only and do it well

• µhtml (HTML/SVG auto-keyed and manual keyed render)
• augmentor (hooks for anything)
• wickedElements (custom elements without custom elements ... wait, what?)

mizchi

Minilink

comlink から proxy やらなんやら抜いたもの。 気が向いたら npm に投げる

使い方

// worker thread
import {expose} from './minilink'

laggardkernel

Comparison of ZSH frameworks and plugin managers

Changelog

• update 1: add a FAQ section
• update 2: benchmark chart and feature comparison table
• update 3:
  • improve the table with missing features for antigen
  • new zplg times result

TLDR

mizchi

この記事は議論のたたき台で、ポジショントークや、偏見にまみれています。

今のフロントエンドの分類

• 古典的なサーバーサイド WAF への +α の味付け
• 大規模なクライアントアプリケーション管理のための SPA
• SEO / SSR を考慮した Node ヘヴィーな環境

他、提唱されてるパターン

gcchaan

エンジニア向け研修

• AI Shift
  • 社内SQL研修のために作った資料を公開します - (2021/06/21)
• CARTA HOLDINGS（旧VOYAGE GROUP）
  • 技術広報が新卒研修<Open AIハッカソン>をスパイしてみた - (2023/04/11)
  • @t_wadaに学ぶテスト駆動開発【CARTA 23新卒研修】 - (2023/04/19)
  • 【新卒研修】監修者@t_wadaと読む！プログラマが知るべき97のこと読書会 - (2024/04/09)
• Classi
  • 当たり前にリリースしていく ~ 新卒研修編 - (2021/05/20)
• リモートワークのための質問力向上研修を実施しました - (2021/12/07)

Restuta

Below is the list of modern JS frameworks and almost frameworks – React, Vue, Angular, Ember and others.

All files were downloaded from https://cdnjs.com and named accordingly. Output from ls command is stripped out (irrelevant stuff)

As-is (minified)

$ ls -lhS
566K Jan 4 22:03 angular2.min.js