進化し続けるフロントエンド技術「Web Components」はライブラリ不要!――気軽に始めて開発の生産性を高めよう

再利用可能なUI部品を組み合わせて画面を構築していくのは、多くのGUIアプリケーションにとって効率の良い開発手法です。ブラウザ向けにも多くのライブラリが再利用性を担保するための工夫を重ねてきましたが、実はブラウザ自身が再利用可能なUI部品を作成するための機能を備えていることはご存知でしょうか。本記事では…

Hotwireの良かった点、辛かった点、向いているケース、向いていないケース – 猫Rails

Hotwireとは? Turbo Driveとは? Turbo Framesとは? Turbo Streamsとは? Stimulusとは? Hotwireのデモ 良かった点 サーバーサイドに集中できる Railsの資産をフルに活かせる 後付けで段階的にSPA風の挙動を追加できる 学習コストが低い 開発コストが低い WebSocketは必須ではない 辛かった点・辛くなりそうな点 DOM…

個人開発のサービスをVPSからVercelとCloud Runに移行した話

最近以下のような記事で個人開発のコストの話をよく見かけて、ちょうど自分も個人サービスをコストカットのためにVPSからほぼ無料なスタックに移行していたので構成とかを書いてみる。 前提としてはこんな感じ。 仲間内で使ってるだけのWebアプリケーション。月イチくらいしか使わない 技術スタックは技術的な実験とか学…

JavaScriptのコードには、こんな書き方もある

本記事はコードの書き方について「bad」「good」で表していますが、書き方そのものを推奨するものではなく、このような書き方も出来るという紹介に留めておきます。コメント欄まで一緒にみていただくと学びになると思われます。 1.破壊的メソッドを避ける 破壊的メソッドとは、元の配列の要素を変えるメソッドです。以下…

Edge Functionはブラウザ – laiso

Cloudflare Workersのようなサーバーレスなコンピューティングプラットフォームとしてここ数年活発な「エッジサーバーでプログラムを実行される環境」(呼び方が定まらないので一旦Edge Functionとする)でアプリケーションを作る*1とブラウザが通信する先にもう1つブラウザが存在するような妙な感じを覚えていた。 例えば…

Edge Functionsはブラウザ – laiso

Cloudflare Workersのようなサーバーレスなコンピューティングプラットフォームとしてここ数年活発な「エッジサーバーでプログラムを実行する環境」(呼び方が定まらないので一旦Edge Functionsとする)でアプリケーションを作る*1とブラウザが通信する先にもう1つブラウザが存在するような妙な感じを覚えていた。 例えばN…