記事一覧

React v18でReact Compilerを使う&一部のコンポーネントだけReact Compilerで最適化する方法

⚛️
Posted at
Tags

先日、React Compilerがオープンソースになり、誰でも利用できるようになりました。 しかしながら、React CompilerはReactのベータ版が必要になり、本番環境でガッツリ利用するのは少し難しいです。そこで、今回はReact CompilerをReact v18でも利用できるよう…

2023年の振り返り

🗓
Posted at
Tags

毎年恒例の1年間の振り返りです。なんだかんだで3年目になりました。 やっぱり自分のブログがあるとカジュアルにこういった記事を書くことができていいですね。 皆さんも是非自分のブログを作ってみてはいかがでしょうか？ちなみに今はblog.s2n.techのv3を準備中です。公開したらまた紹介記事を書くの…

アドベントカレンダーを3年間主催した話

🎄
Posted at
Tags

この記事は長野高専 Advent Calendar 2023の25日目の記事です。今日はクリスマスですね。皆さんはどんなクリスマスを過ごされましたか？私はAstro触ってたらクリスマスが終わってました。今年も長野高専のアドベントカレンダーにはたくさんの記事が投稿されました。いろんな人が参加してくだ…

工嶺祭2023HP制作の裏側

🎆
Posted at
Tags

私は今年の工嶺祭のHP制作を担当しました。ここでは制作にあたっての技術スタックや運用、工夫した点などを紹介します。 なお、この記事は私が自主的に書いたものであり、工嶺祭実行委員会や長野高専とは一切関係ございません。 本記事の内容に関して学校などに直接問い合わせることはご遠慮ください。また、この記事…

「しゅん」という人間の作り方 〜生まれてからの 20 年間を振り返る〜

🌙
Posted at
Tags

先に書いておくが、この記事は全文駄文である。全く推敲していないし、全く校正していない。 さて私は 2023/04/22 に 20 歳の誕生日を迎える。 自分の半生の振り返りをここに書いておき、自分という人間がどのように構築されていったのかを知ってもらえたらと思っている。私は元々何か創作したりするの…

TypeScript で"moduleResolution": "Node"は使わないほうがいい

🙅‍♂️
Posted at
Tags

タイトルは若干煽りですが、TS 5.0 でBundlerという設定値が追加されたため、Nodeを使う場面はほぼ無くなったと思います。 今回は Node.js と TypeScript のモジュール解決の仕組みについて、moduleResolutionというオプションの観点から解説します。 この記事…

Cloudflare Tunnel でローカルの開発環境を公開する

🚇
Posted at
Tags

LINE Messaging API や Slack/Discord の Slash Command など、Webhook ベースの API を利用する場合、 ローカルに建てた Web サーバーを外部からアクセスできるようにする必要があります。今までは、ngrok などのツールを利用していましたが…

Renovate で Deno の依存関係を自動で更新する

🦕
Posted at
Tags

Renovate は非常に高機能なツールで、GitHub Actions や Docker の更新なんかもできますが、 残念ながら執筆現在は Deno の依存関係の更新には対応していません。 今回はどうにかして Renovate で Deno の依存関係を自動で更新する方法を紹介します。先に動いて…

1kB の XML ビルダーを作った

🕊️
Posted at
Tags

littlexml という軽量の XML ビルダーをリリースしました。 Cloudflare workers などの Edge ランタイムでの動作を考慮していますが、Node.js, Deno, Browser でも動作します。 また通常の文字列としての出力以外にも Iterator や Web …

正規表現でキャプチャグループを使うときは名前を付けよう

🈂️
Posted at
Tags

JS/TS で正規表現を扱う際、()を使ったキャプチャグループを使うことがあると思います。 キャプチャグループは大きく分けて 2 つの使われ方があり、 1 つはキャプチャした文字列を.match()などで取得したり後方参照するために使われ、 もう 1 つは|を使った論理和のために使われます。これら…

Next.js App Dir で CSP を設定する

🔐
Posted at
Tags

最近このブログに CSP を設定しました。 Next.js ではインラインスクリプトが使われているので Nonce の設定が必要なのですが、 App Dir での Nonce 設定方法が公式ドキュメントに書かれていなかったので、ここにやり方をまとめておきます。ちなみに App Dir を使用してい…

pnpm では Pre/Post スクリプトは実行されない

🤨
Posted at
Tags

最近メインで使うパッケージマネージャを Yarn から pnpm に乗り換えたのですが、 Yarn の時に使っていた Pre/Post スクリプトが自動で実行されないことに気づきました。これは pnpm v6.0.0 からの仕様変更で、 意図的に 実行されないようになっています。 今回は対処法も含…

GitHub Actions で corepack を使って CI 上のパッケージマネージャを楽に管理する

📦
Posted at
Tags

皆さんは corepack をご存知でしょうか？ corepack は Node.js v14.9 以降に同梱されているパッケージマネージャマネージャ(?) です． プロジェクト側で package.json に使用するパッケージマネージャとそのバージョンを明記しておくと， コマンド実行時に指定…

KaTeX と React Syntax Highlighter を React Server Component に対応させる

🧐
Posted at
Tags

このブログは Next.js 13 で新しく追加された App Dir + React Server Component(RSC)を使って実装しています． RSC はクライアントサイドのバンドルサイズを非常に小さくすることができますが，RSC では useState などの副作用や Provide…

ブラウザ上で動くファビコンジェネレーターを作った

🎉
Posted at
Tags

この前blog.s2n.tech v2 をリリースしましたが， その時に動的に OGP 画像を生成するために @vercel/og というライブラリを使用しました．@vercel/og は大まかには JSX を SVG に変換する処理と SVG を PNG に変換する処理を内部で行っているのですが…

blog.s2n.tech v2 のリリース

📝
Posted at
Tags

このブログは元々 2021 年末に唐突に自作のブログが作りたくなって急遽作ったものだったのですが， 急ごしらえで作ったせいか，色々と機能不足だったり，問題があったりと不満点がたくさんありました．そこで今回自作ブログを大幅にリニューアルし，機能の追加，問題の解決を行いました．v1 時代のブログシステ…

2022 年の振り返り

🗓
Posted at
Tags

もともと書く気はあまりなかったんですが、限界開発鯖箱推し後方腕組みオタクに書かないんですか？ と言われてしまったので書いています。実質 RTA です。間に合うかな。あんまり特に生産的なことは何もしていません。 冬休み中に突然、「Switch 欲しいな、買うか」と思い立って近くの家電量販店で Swi…

macOS 上で glpng をコンパイルして動かす

🖼️
Posted at
Tags

今日から学校でプログラミング演習の授業が始まった。 プログラミング演習では OpenGL を用いてゲームを作るらしく、はじめは環境構築だった。 OpenGL の他に png を扱うための glpng というライブラリを導入する必要があったが、これを本家ソースから macOS 上でコンパイルしようと…

数論変換(NTT)を用いた多項式乗算 ① 〜離散フーリエ変換と多項式乗算〜

🫠
Posted at
Tags

この記事は数論変換(NTT)を用いた多項式乗算について 1 から丁寧に解説することを目標としています。この記事を書こうと思ったきっかけは学校で｢円周率を 1000 桁計算する｣というレポートが出たからです。いわゆる多倍長演算のレポートなのですが、乗算の速度をなんとかして上げようと思い、高速フーリエ…

2021 年の振り返り

🗓️
Posted at
Tags

もともと書く気があまりなかったのですが、みんなが書いてるのを見たら書きたくなってきたので今急いで書いています。｢サポーターズウィンターズハッカソン〜オンラインで LVup する開発合宿 vol.6〜｣にて最優秀賞を頂きました。 某コミュニティ内の 4 人で参加していて、一応フロントエンドを担当しま…

2021 年の段階で僕が知らないこと

🤔
Posted at
Tags

こんにちは、しゅんです。この記事では 実は僕がよく知らない技術について挙げていきます。 実はこのブログを開設したかった理由もこの記事を書くためです。 もともと 2018 年の段階で私が知らないこと という React のコアコミッターの方が書いた記事がありまして、 これを読んだときに、｢僕もこんな…

ブログ開設のご挨拶

👋
Posted at
Tags

こんにちは、しゅんです。この度ブログを開設しました。サイトのタイトルは｢高専生はエンジニアの夢を見るか？｣です。5 秒くらい考えて決めたタイトルなので気が変わったらタイトルも変えるかもしれません。一応雑多ブログとして開設しましたが、主に技術メインで書いていこうと思っています。個人ブログで Qiit…