eBPFを使った自動テストツール「Keploy」がすごい
この記事はKeployのバージョンv2.0.0-alpha53 を前提に執筆しております。 Keployとは KeployはeBPFを利用して取得できるWebアプリケーションの通信に関するトレース情報を元に、テストとそのテストの実行時に利用するスタブサーバーを生成することができるツールとなります。 公式サイトのトップには以下のようなスローガンが掲げられています。 2 minutes to 90% test coverage! テストに苦労した経験のある方は興味を惹かれるのではないでしょうか。 現在まだアルファ段階のプロジェクトですが、GitHubスター数は2683（2024/01/04現在）、CNCF Landscape にも掲載されているなど、一定の注目を集め始めているOSSです。 開発主体はプロダクトと同名のKeployというインド発のスタートアップで、去年GoogleによるインドのA
ヘルスケアデータをGrafanaで見たくない…？〜健康 Reliability Engineering〜
Blueskyのフォローお願いします！ はじめに まずはこちらをご覧ください。 これは私のApple Watchで計測されたヘルスケアデータです。Apple Watchをつけていると、心拍数や歩数、睡眠時間などのデータが自動的にiPhone内に記録されます。 SREなら健康を維持するためにもSLIとSLOを設定して可視化するべきですよね？ SREなら健康エラーバジェットが無くなりそうだったら「今すぐ寝ましょう！」と架電が来て欲しいですよね？ 普通にやるとiOSアプリを用いて直接ヘルスケアデータを確認することになりますが、Web系のSRE的なエンジニアとしてはやはり業界標準の技術で可視化したいところです。 また、iOSアプリを開発するのは専門知識が必要となり非常に骨が折れる作業です。そもそもMacがないとできないですし。 そこで、今回は Apple Watchのヘルスケアデータを 全自動で良
Next.js App Router と控えめにお付き合いして普通の Web アプリを配信する | Offers Tech Blog
まずは長いものに巻かれたいときもある Offers を運営している株式会社 overflow の あほむ でございます。 先日 コードベースのディレクトリ構成にフォーカスした記事 を公開した関連記事として、Next.js App Router をどのように取り扱っているかについてご紹介します。 【AD?】今回の記事の内容を含んだり含まなかったりすると思いますが、来週 2024/01/17(水) 19:20 〜 オンライン開催の PWA Night vol.59 で発表予定なので興味のある方はぜひ。（終了済み） 下記は本記事の内容を含むイベント発表資料です。ご参考までに。 今回の前提 前回記事 の引用ですが今回も同様です。 最終目標は単体事業でありつつ実質マルチプロダクトな画面群のリプレース クライアントサイドでヘビーなビジネスロジックを持つ必要がない アプリケーション特性としては SaaS
VSCode のターミナル内で画像を表示できるようになったので試してみた
VSCode の更新情報で Preview features に「Images in the terminal」という項目がありました。 There is now experimental support for images in the terminal. Images in a terminal typically work by encoding the image pixel data as text, which is written to the terminal via a special escape sequence. The current protocols that are supported are sixel and the inline images protocol pioneered by iTerm. 個人的にはわりとうれしい機能なので少し試してみるこ
Honoの新しいCloudflare Pagesスターターについて
先日リリースしたv3.9.0でHonoの「Cloudflare Pages」のスターターテンプレートが新しくなりました。 これがなかなか面白いので詳しく紹介します。 使ってみる 使ってみてください。create honoコマンドを使います。C3（Create Cloudflare CLI）コマンドでもHonoを選べますが今のところそれだとWorkersのテンプレートになるのでcreate honoで。npmの場合は以下です。 選択肢がでてくるのでcloudflare-pagesを選びます。 そしたら、ディレクトリに入って、npm installしてnpm run devすれば開発サーバーが立ち上がり、npm run deployすればデプロイできます。 Viteベース で、以前からCloudflare Pages、もしくはWorkersも含み、Honoでアプリ開発をしていた人はこのスタータ
Hono + htmx + Cloudflareは新しいスタック
この記事は以前7月に自分で書いた「Hono + htmx + Cloudflare is a new stack」という記事を一部修正し、訳したものです。 Hono + htmx + Cloudflareは新しいスタック 以前、バックエンドエンジニアだった身からすれば、Reactは複雑だと感じることがあります。さらに（私はフレームワーク開発者なのですが）フレームワーク開発者にとってはハイドレーションの仕組みを作ることは厄介です。しかし、しばしばReactを使うことになります。 Reactの優位な点の一つは「JSX」です。最初見た時、JSXは奇妙に思えました。「なんでJavaScriptの中にHTMLのタグが入っているんだ！」。しかし、一度慣れると、JSXは柔軟で、書きやすいことに気づきました。 今日はこれから、JSXをサーバーサイドのテンプレートとして使う技術スタックを紹介します。これはつ
お気に入りのコマンドラインツールを淡々と紹介する
めちゃくちゃ良い記事でした。 「OSS は使っていることを公言するだけでも貢献になる」と songmu さんが言っていたので、私も貢献したいと思います。 僕も貢献したいのでよく使うコマンドラインツールを紹介していきます。 特定のプログラミング言語等に依存するツールは省いています。 actionlint - GitHub Actions の Workflow ファイルの静的検査 GitHub Actions の Workflow ファイルの静的検査ツールです。 かなり精度が高く、色々な設定ミスを検知してくれます。 エラーメッセージも見やすくて助かります。 aicommits - コミットメッセージを自動生成 変更内容を元に自動でコミットメッセージを AI が生成してくれるツールです。 コミットをする前にちゃんと確認してくれるのも安心感があって良いです。 cLive - ターミナル操作を自動化
数年間継続している「作業メモ」の話
メモを残す習慣 以前、@gorou_178さんが「1日1ファイル、「調べたこと」「やったこと」を日報として残す」という記事を公開していた。 この記事の中に以下のようなくだりがある。 そこでふと思い出したのが元同僚のメモの取り方。 毎日1ファイル作成して、そのファイルにその日にやったこと（事細かくやった作業、実行したコマンドなども）をメモしていた。メモは年単位で残っておりとても驚いたことを覚えている。 この、「元同僚」というのはきっと私のことである。 私はメモを取ることが結構と好きな方で、メモを残すことがわりと習慣化している。 例を挙げると、普段からこういったことをやっている。 Google Keepに「Podcastに出演してほしいゲスト候補」、「勉強会・カンファレンスの登壇履歴」、「来月購入予定の日用品・雑貨」、「自宅周辺の行ったことないラーメン屋」、「読みたい・気になったマンガ本」とい
Remix + Cloudflare Workers + D1 + KV + Queue + R2 + DOで簡単なアプリを作る
Remix + Cloudflare Pages/WorkersをベースにD1とKVと組み合わせた構成で作るアプリの解説は巷に結構あるが、それらに加えてQueueやR2なども合わせた参照実装みたいなものが見当たらなかったので作った。 このアプリの機能は下記。 Googleアカウントを用いたOAuthログイン セッション管理にKV,ユーザー管理にD1を使う はてブのようなブックマーク機能(基本的なCRUD) URLとコメントを入力してD1へデータ登録できる URLの先のページからOGPを取得して登録 QueueのProducerとConsumerを使って非同期にタイトルと画像を取得 取得した画像はR2にアップロードする URLごとにブックマーク数を管理する Durable Object(DO)を使う。 Cron Trigger ついでに追加。アプリ的には不要だがせっかくなので設定だけしておく
2024年 React 環境構築 with Vite
はじめに 書いていて気づいたのですが、この記事に特に目新しいものはありません。コピペで最速環境構築をしたい方向けです。それぞれのツールについて細かい解説はしていないため、詳細は公式ドキュメントをご参照ください。 リポジトリはこちら。 Node.js この記事では Node.js のバージョン管理に volta を使用しますが、nvm や nodebrew などでも問題ありません。パッケージマネージャーには pnpm を使用したいところですが、2024 年 1 月現在、volta の pnpm サポートは実験段階のため、今回は npm を使用します。(そこまでして volta を使用したい理由はないのですが...) curl https://get.volta.sh | bash source ~/.zshrc # or ~/.bashrc volta install node # LTS版
Astro ゆく年くる年
8 月 30 日に v3.0 がリリースされ、それから約 3 ヶ月後の 12 月 5 日には v4.0 がリリースされており、メジャーアップデートのペースがやや早かったように感じますね。Astro の co-creator である Matthew Phillips によると、v4.0 における大きな変更の一つに Vite 5 へのアップデートがあり、これはもともと v3.0 に含まれる予定だったのが、Vite 5 のリリースが遅れてしまい、一方で v3.0 の目玉機能である View Transitions を早くリリースしたかったため、まず先に v3.0 をリリースし、その後に v4.0 で Vite 5 を含めるという流れとなり、結果的に v3.0 と v4.0 のリリースが短期間で連続してしまった、という事情があったようです。 GitHub スター数の推移 https://star-
2024年こそ corepack を使おう
普段の開発では nodenv を使って各プロジェクトのバージョンに合わせた Node.js をインストールしています。その後、各プロジェクトの README や package.json を頼りに npm install -g yarn や npm install -g pnpm することが多いです。 先日、同僚から「最近は corepack 使ってますよ」と教えてもらったので、「おーもう実務で使えるのかー」と一気にモチベーションが上がったので corepack 使っていきたいと思います。 まずはこちらの鉄板記事でおさらい。 corepack を使っていくということは yarn や pnpm の管理を corepack に任せるということなので、まずは global install しているそれらを削除して実験してみます。 yarn を使っているプロジェクトで検証 とある yarn を使っ
開発スピードを維持しながらモブプログラミングを実施した話
こんにちは、ユビーでプロダクト開発エンジニアをしている Sosuke Suzuki です。 最近、チームのエンジニア間の連携がいい感じだなーと思ったので、その要因の一つであるモブプログラミングについて、実践したことを紹介します。 はじめに 最近、私の所属するチームでは、データベース、バックエンド、そしてフロントエンドにも大きな変更を加える必要がある、規模の大きなプロジェクトに取り組んでいました（そして、今も同じチームで別の大きなプロジェクトに取り組んでいます！）。 そのプロジェクトの具体的な内容を書くことはできませんが、大雑把に事情を説明します。 数年前に設計されたいくつかのテーブルがあり、それは当時からずっとユビーのビジネスにとって重要でした。しかしそれらのテーブルは、この数年の間に複雑になったビジネス要件には耐えられなくなっていました。 このままではビジネスの機会を毀損することになりま
テーブル駆動テストを使った QA エンジニアとソフトウェアエンジニアの連携
test.each([ {a: 1, b: 1, expected: 2}, {a: 30, b: 5, expected: 25}, ])('.sum($a, $b)', ({ a, b, expected }) => { expect(sub(a, b).toBe(expected); }); テーブル駆動テストは Go 言語を使った開発で良く使われるスタイルです。Go 言語の GitHub リポジトリの Wiki にはテーブル駆動テストに関するページがあるので、興味がある人はそちらを読んでみてください。 テーブル駆動テストを使った QA エンジニアとソフトウェアエンジニアの連携 テストがなくリファクタリングが困難なフロントエンド 症状検索エンジン ユビー には、ユビーのビジネスにとって重要な、とあるページがあります。そのページではフロントエンドからロギングサービスに対してたくさんのロ
RustでWebバックエンドを書き始めてから1年くらい経った
はじめに 僕はDeno Land Inc.でDenoを利用したサーバレスエッジホスティングサービスのDeno Deployを開発するチームに所属しています。OSSのほうのDenoのメイン言語はRustで、Deno Deployのバックエンドも同様にRustで書かれています。 今年のアドベントカレンダーで一休さんから以下の記事が公開されましたが、日本でもRustをWebバックエンドの言語として採用する企業がじわじわと増えてきている印象があります。 Deno DeployのバックエンドをRustで開発してきて、RustでWebバックエンドを書くことのメリットやデメリットをいくつか感じたので、この記事で紹介したいと思います。 Deno Deployの構成 まず、ざっくりとDeno Deployのバックエンドの構成を紹介します。 多くのコンポーネントがありますが、ここではどのようにRustを利用し
大規模コードベース向けASTツールのast-grepについて
大規模なコードベース向けの高速なASTツールとしてast-grepというものがある。これについての調査メモ。 主に以下の公式ドキュメントを読み進めて、利用方法、パターンやルールの詳細などについて理解を深める。 ast-grepとは 公式ドキュメントでは、コードの検索からLint、codemodに至るまでASTツールとして網羅的にカバーできるツールであることが以下のように表現されている。 Think ast-grep as an hybrid of grep, eslint and codemod. 結果に精度が求められる場面では、高速であるものの精密さに欠けるテキストベースではなく、ASTベースでの正確な解析の方が望ましいだろうけど、ASTでの記述は非常に面倒になりがちという側面がある。 その点においてast-grepは、テキストベースでのgrepではなく、ASTベースでのgrepというよ
Firebase Authから内製認証基盤に無停止移行して年間1000万円以上削減した
症状検索エンジン「ユビー」 では、ローンチ当初から Firebase Auth (GCP Identity Platform) を使っていましたが、OIDCに準拠した内製の認証認可基盤に移行しました。 認証認可基盤そのものは m_mizutani と nerocrux と toshi0607(退職済) が作ってくれたため、僕は移行のみを担当しました。 結果として、強制ログアウトなし・無停止でビジネス影響を出さずに、年間1000万円以上のコスト削減に成功しました[1]。その移行プロセスについて紹介します。認証認可基盤そのものの紹介はあまりしません。 移行した理由 大量の匿名アカウント ユビーでは、アクセスした全ユーザーに対して自動的に匿名アカウントを発行しています。これにより、ユーザーがアカウント登録しているかどうかに関わらず、同じID体系で透過的に履歴情報等を扱うことができます。アカウント
フロントエンドのテスト基盤を Jest から Vitest に移行した話
こんにちは。ナレッジワークの torii です。 7 月にフロントエンドエンジニアとして入社してもうすぐ半年、そろそろ技術記事の一つも書きたいなと思っていたところに、ちょうどいいネタを見つけたので投稿してみます！ Jest から Vitest に移行してみた 早速やったことですが、フロントエンドのテストフレームワークを Jest から Vitest に移行しました。理由としては、Jest が CJS を前提として動作しており、ESM 前提のモジュールを動かすのに一手間も二手間もかかるからです。 ナレッジワークのフロントエンドは Next.js を採用しており、テストフレームワークには Next.js と相性の良い Jest を採用していました。関数単位のテストや UI コンポーネントのテストを書く分には問題なかったのですが、それより上層（ページなど）になるとたちまち ESM 互換性の問題を
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Auth.js v5ではじめる本格認証入門
JavaScriptで数字のみの入力ボックスを作る（全角対応）
