iimon TECH BLOG

iimonエンジニアが得られた経験や知識を共有して世の中をイイモンにしていくためのブログです

電子書籍リーダーで快適に読みたい

こんにちは、木村です。(非常に遅ればせながら)本年もよろしくお願いいたします。 さて、入社してから2年が経とうとしています。よりスキルアップしていきたいなと思うこの頃ですが、勉強の一つとして技術書を幅広く読みたいなーと思う一方、なかなか時間…

React Scanで再レンダーを改善してみた

はじめに 使用技術 React Scanとは React Scanの導入 React Scan使ってみる React Scanの分析 分析結果から改善 JavaScript/React Hooks AntdIconの改善 その他のAntdのコンポーネントの改善 改善結果 useCallback + React.memoでチェックボックスの改善 改…

呪術に触れてみた

こんにちは、kogureです。 勉強会のお題を考えているときにEMから今、巷で流行っているJujutsuどう?とお勧めされたので触ってみました! そもそもJujutsuってなんなんでしょうか? 公式のreadme> Introductionを確認してみましょう github.com Git互換の新…

エンジニア&デザイナーのためのフォント入門

皆様ごきげんよう。タクシです。 最近、花粉症をこの世から消す方法と同じぐらい私はフォントについて調べています。 開いたWebサイトがどのフォントを使っているかをデベロッパーツールで確認するのが習慣です。1人でフォント当てクイズをしたりもします。…

Macのアクティビティモニタを理解する

はじめに 株式会社iimonエンジニアのかとうです! Macのファンがうるさくなったり、動きが遅くなったり固まったりしたときに、私はまずアクティビティモニタを確認します 不要なプロセスの終了にしか使用したことがなかったので、他にもどのように使え…

「なぜダメか」で学ぶクラス設計

導入 こんにちは!iimonで「入力速いもん」の開発を担当しているなかむ〜です! 弊社のメイン製品である「入力速いもん」は、リリースから時間が経っていることもあり、現在はレガシーな設計から「新しく保守しやすい設計」への移行を絶賛進めている最中です…

型に縛られず、型を守る。忘れがちな「ジェネリクス」を改めて整理して武器にする

こんにちは。iimonでエンジニアをしているhayashiと申します。 普段は主に拡張機能を開発しております。 今回はジェネリクスについて何となく分かったつもりではいたけれど、 忘れがちという事に気付きまして、ちゃんとアウトプットしてみようと思います。 …

Chrome拡張機能のE2Eテスト、PlaywrightとPuppeteerどっちを選ぶ?調べて比較してみた

目次 1. はじめに 2. PlaywrightとPuppeteerの関係性 3. Chrome拡張のテスト観点での技術比較 4. 公式ドキュメント・情報量の比較 5. CI/CDへの組み込みやすさ 6. 結論:どちらを選ぶか 7. おわりに 1. はじめに こんにちは!iimonでフロントエンドエンジニ…

Chromeってどんなふうにうごいているの?

はじめに Chromeのアーキテクチャはマルチプロセス?!! マルチプロセスを採用することの意味 マルチプロセスを採用することの課題とその対応 まとめ さいごに はじめに こんにちは!iimonでエンジニアをしているひがです! 先日アドベントカレンダー2…

AI駆動開発の新常識「SDD」- Spec Kitとcc-sddを実際に使って感じたこと

1. はじめに こんにちは!株式会社iimonでエンジニアをしている「みよちゃん」です! いや〜来てますねAIの波。開発現場でもAIは「あると便利なもの」から「ないと困るもの」に変化しつつありますよね。この記事もAIに添削してもらいながら執筆しています。 …

Chrome拡張機能開発で意識したいセキュリティ対策(Manifest V3)

はじめに 前提: Content ScriptとService Workerの違い 公式ドキュメントに基づくセキュリティ対策 Content Scriptの信頼性が低い理由 1. Content ScriptがアクセスするDOMの信頼性が低い 2. Webページと同じレンダラプロセスで実行される 対策 1. Content S…

TypeScriptの型システム、実はチューリング完全って知ってましたか?

はじめに 基礎パーツ作成 タプルのlengthで数値を取得 タプルを生成するユーティリティ タプルの結合 足し算の実装 引き算の実装 注意点 再帰の深さ 整数限定 チューリング完全について 応用編 掛け算 比較 まとめ 最後に 参考 はじめに こんにちは!株式会…

チーム目標に合わせてJestカバレッジを"狙い撃ち"計測する方法

こんにちは!iimonでフロントエンドを担当しております、まつむらです! 私たちのチームでは開発中のプロダクトにおいてテストコードが不足していたため、カバレッジを指標としてテストを増やす取り組みを行っていました。 もちろんカバレッジを上げることが…

積読解消プロジェクト「リファクタリング(第2版)既存のコードを安全に改善する」Part2

1. はじめに 2. 6章 リファクタリングはじめの一歩 パラメータオブジェクトの導入 3. 7章 カプセル化 レコードのカプセル化 4. 8章 特性の移動 5. 9章 データの再編成 6. 10章 条件記述の単純化 7. 11章 APIのリファクタリング コマンドにおける関数の置き換…

MySQLのカラム追加や削除はなぜ速くなったのか?

はじめに みなさま、本年もよろしくお願いいたします。 現在のMySQLは本番環境でもカラム追加も懸念すべきことも少なくなり、ALTER TABLE ... ADD COLUMN を実行すれば、テーブルのサイズやレコード数に関係なく一瞬で完了するようになりました。 以前は本番…

JWT認証の仕組みについて調べてみた

■はじめに ■認証とは? ■JWT認証とは ■セッション認証方式 ◆処理フロー ◆セッション認証方式の課題点 ■JWTの構造 ■HMAC(Hash-based Message Authentication Code)とは ■アクセストークンとリフレッシュトークン ■JWTを使った認証フローを確認してみる ■悪…

React 19.2で追加された<Activity>コンポーネントについて

はじめに こんにちは、保田です。本記事はiimonアドベントカレンダー25日目の記事となります。 試験的機能として開発されていた<Activity>コンポーネントが、2025年10月にリリースされたReact 19.2で正式に導入されました。 普段の業務で使えるものなのか気になったの</activity>…

これぞ拡張機能の真髄!chrome.webRequest APIについてまとめてみた

こんにちは。iimonでエンジニアをしているhayashiと申します。 普段は主に拡張機能を開発しております。 本記事はiimon Advent Calendar 2025 24日目の記事となります! 今回はこれぞ拡張機能の真髄って個人的に思ったchrome.webRequest APIについて解説した…

不気味の谷から考える:違和感とユーザー体験

はじめに 不気味の谷 AIにおける不気味の谷 動画生成AI AIのハルシネーション 開発と不気味の谷の関係 不気味の谷を避ける配慮 さいごに 参考 はじめに 本記事はiimon Advent Calendar 2025 23日目の記事となります! みなさまごきげんいかがでしょうか。 株…

Claude Codeサブエージェントハンズオン

はじめに 本記事はiimonアドベントカレンダー22日目の記事となります。 こんにちは、kogureです。 あっという間に12月ですね、去年にアドベントカレンダーを書いたのが昨日のことのようです。 こうやってあっという間に歳をとっていくのですね。怖いですね。…

最初から完璧は目指すな──初めて設計するあなたへ伝えたい、TypeScript設計の最低ライン

初めて0→1設計を任された人向けに、TypeScriptを例に「壊れにくく変更に強い設計」を解説。依存方向の整理、副作用の隔離、テストファースト、仕様変更に強い型設計など、品質とスピードを両立する最低限の設計ポイントを紹介する記事です。

SwiftUIで「推し活カレンダー」アプリを作ってみた

この記事はiimon Advent Calendar 2025 20日目の記事となります! はじめに 開発環境 完成したアプリ 開発の流れ 1. まずはシンプルなスケジュールアプリから @Stateと@Bindingの使い分け 2. カレンダーUIを自作 日付セルのデザイン 3. カテゴリをenumで管理…

MutationObserverを理解する

MutationObserverとは 処理ステップと実装方法 オプションの設定 childList subtree attributes attributeFilter MutationRecordのプロパティ 無限ループの罠 廃止されたMutationEvent まとめ 参考記事 こんにちは。 iimonアドベントカレンダー19日目の記事…

Claude Codeと一緒に行う学習方法を試してみる

こんにちは、木村です。 本記事はiimonアドベントカレンダー18日目の記事となります。 最近Claude Codeを使用し始めたんですが、AIって便利ですね!全肯定でAIを使うのは良くないとは思うのですが、できることが多くて試しきれないと思うこの頃です。 Claude…

Node.js × Docker ベースイメージをどうやって選ぶか

はじめに Docker イメージとは Node.js Docker公式イメージとは Node.js Dockerイメージの種類 node:<version> node:<version>-alpine node:<version>-slim 補足:Debianのコードネーム イメージサイズ イメージサイズが重要な理由 イメージサイズの確認 イメージサイズ一覧 ベースイメ</version></version></version>…

RISC-Vはなぜシンプルなのか?x86との比較で理解する設計思想

本記事はiimon Advent Calendar 2025 16日目の記事となります! こんにちは、iimonでエンジニアをしている須藤です。 RISC-V(リスクファイブ)は「シンプルでエレガント」と言われますが、実感が湧いていなかったので、今回はx86との比較を通じて、シンプル…

PMに「Hono書いて」と言われたのでCloudflareでAIチャットボットを作ってみた

◼️ はじめに ◼️ Honoとは ◼️ Cloudflareとは ◼️ 今回作成するアプリのアーキテクチャに関して 各サービスの役割 ◼️ プロジェクト作成 Honoを使用するためのプロジェクト作成 各リソースを作成 型定義のインストール D1テーブル作成 ◼️ 実装 Bindings型定義 …

JavaScriptのWeb Audio APIを使ってジングルベルを演奏してみよう

こんにちは!iimonでエンジニアをしている、でっさんです。 本記事はiimon Advent Calendar 2025 14日目の記事となります! 今年はダイエットに挑戦したものの、チートデイを設けすぎてリバウンドしてしまいました。 来年は、みなさんの助言を真摯に受…

パソコンってなんで動くの?パーツ編

はじめに 主要パーツの名称 ハードウェアとソフトウェアの違い 主要パーツの役割 トータルバランス ボトルネック現象とは? ボトルネック回避のために 適切なバランスはどうやって調べればいいの? まとめ 参考資料 はじめに こんにちは!株式会社iimonでエ…

AI-DLCを導入するとしたら?それ以前に「うちのコードベース、AIに説明できる状態ですか?」

はじめに AI-DLCとは なんの略称やねん AI-Driven Development Lifecycleの概念 開始( Inception )フェーズ 構築( Construction )フェーズ 運用( Operation )フェーズ スプリントでは遅い!?ボルトという単位 AI-DLC実践事例 そもそもこの記事を書こうと思…