Skip to content

Indigo

25 posts by Indigo

スマホとAIで完結!長文PDFを音声学習用のテキストに変換して耳からインプットする方法

資格試験の勉強中、分厚いシラバスや長文のPDFを読むのに疲れてしまうことはありませんか? 今回は、AIを使ってPDFを「音声読み上げ用」のテキストに変換し、スマホの機能を使ってオーディオブックのように耳から学習(耳学問)する方法をご紹介します。

JSTQBの試験勉強を例に挙げますが、この方法を使えば移動中やスキマ時間にもインプットが進むので非常におすすめです!

NotebookLMにJSTQBシラバスを読み込ませたら、最強の試験対策ツールになった話

現在、QAエンジニアとしてのスキルアップも兼ねて、JSTQB Foundation Level(FL)の資格勉強を進めています。

JSTQBの公式シラバスは非常に網羅的で勉強になる反面、テキストのボリュームが多く、ただ読んでいるだけではなかなか頭に入ってこないのが悩みでした。

そこで、話題のGoogleのAIツール 「NotebookLM」 に、公式シラバス(V4.0のPDF)を丸ごと読み込ませて試験対策の教材を作らせてみたところ……結果として、想像を絶するクオリティの学習環境が爆誕しました。

今回は、NotebookLMを使ってどのような試験対策コンテンツを作成したのか、その衝撃的な体験をシェアします。

『エッセンシャル スクラム』に学び、アジャイル現場へ応用したい話

システム開発を進める中で、「アジャイルにやっているつもりだけど、なんだかうまくいかない」「要件変更に振り回されて疲弊している」と感じる瞬間はありませんか?

スクラム開発のバイブルとも言える Kenneth S. Rubin (著) 『エッセンシャル スクラム』 を読み、こちらに要約いたしました。

その中から 「現場のエンジニアが本当に知っておくべきスクラムの要点」 を整理しました。単なるフレームワークの解説にとどまらず、開発のスピードと品質を両立させるためのマインドセットについて紹介します。

JavaScriptとTypeScriptの歴史の整理:バージョンとモジュールシステムの変遷

エンジニアとしてモダンなWeb開発(Next.jsやAstroなど)を行う上で避けて通れない、JavaScript(JS)とTypeScript(TS)の関係性や歴史的背景を整理します。

TypeScriptは、JavaScriptをベースに「型」の機能を追加した言語であり、 JavaScriptのスーパーセット(超集合) です。

  • JavaScript (JS): ブラウザやNode.jsで直接実行できる標準的な言語。
  • TypeScript (TS): JSの全機能を含みつつ、静的型付けなどの拡張機能を加えたもの。
  • 互換性: 有効なJSコードは、そのまま有効なTSコードとして扱えます。

Astro + Starlightブログにおけるタグ管理のベストプラクティス(Zodを使った表記揺れの防止)

AstroとStarlight(starlight-blog)を使って技術ブログを運用していると、記事が増えるにつれて気になってくるのが**「タグの表記揺れ」**です。

例えば、記事のフロントマターで以下のようにタグを指定していくと…

# 記事A
tags: [Git, Next.js, UI/UX]
# 記事B
tags: [git, nextjs, ui-ux]

サイト上では「Git」と「git」が別のタグとして扱われてしまい、タグ一覧ページが分散してしまいます。 毎回「大文字だっけ?記号は入れるんだっけ?」と過去の記事を確認しながら入力するのはミスが起きやすく、執筆体験もよくありません。

そこで今回は、Zodの transform 機能を活用して、システム側でタグの表記を自動的に正規化・統一するベストプラクティスをご紹介します。

WSL2環境でペット専用LoRAを訓練してStability Matrixで画像生成するまでのまとめ

この記事では、ペット(うさぎ)のクッキーの写真から専用のLoRAモデルを訓練し、Stability Matrixで画像生成するまでの全工程を解説します。

WSL2環境でのセットアップから、実際の訓練、そして画像生成まで、実際に遭遇したトラブルシューティングも含めて詳しく記録しています。

AIに追加学習させるための「軽量化技術」のことです。

元の巨大なAIモデル(数GB)をまるごと再学習させるのではなく、覚えさせたい特徴(今回ならペットのクッキー)だけの「差分データ」を作ります。 これにより、短時間(数分)かつ低スペックなPCでも学習が可能になり、出来上がるファイルサイズも非常に小さくなるのが特徴です。

Stripeアカウント閉鎖からGitHub Sponsors成功まで:AI画像サービスの決済問題解決記録

AI生成画像を無料で提供する「Free Images」を運営していたある日、Stripeから一通のメールが届きました。

カードネットワークパートナーの制限により貴社アカウントのサポート継続が困難となりました

この記事は、突然の決済手段喪失から、GitHub Sponsorsで支援を受け付けられるようになるまでの2日間の記録です。同じような問題に直面している方、特にAI関連サービスを運営している方の参考になれば幸いです。

Claude Codeで「UIがダサい」と伝えたら、驚くほどオシャレになった話

バイブコーディング(Vibe Coding) という言葉をご存知でしょうか。これは、具体的な技術仕様ではなく「雰囲気」や「感覚」といった抽象的な指示でコードを生成・修正するAI開発の新しいスタイルです。

「AIに開発を任せる」ってどんな感じなのか興味があったのですが、Claude Codeを使って実際に体験したことは、想像を遥かに超えるものでした。

今回は、簡単なホワイトボードアプリのUIを改善してもらった体験を通じて、たった一言の「バイブ」でどこまでできるのかを検証してみました。

Next.js 16 アップデート:脆弱性 0 への道とビルドエラーの回避

Next.js の公式チュートリアルをベースにしたダッシュボードアプリにおいて、セキュリティ脆弱性の解消をきっかけに Next.js 16 へのアップデートを敢行しました。

最新の React 19 や Next.js 16 では、これまでの書き方が通用しない「破壊的変更」や、ビルド時の挙動の変化がいくつかあります。フリーランスエンジニアとして、実務でも遭遇しそうなこれらのトラブルをどう解決したか、その全記録を共有します。

個人開発アプリにStripeで寄付機能を導入する方法と注意点

現在開発中のフリー素材サイト「Free Images」に、「寄付(Donate)」機能を導入することにしました。

「決済機能なんて実装が大変そう…」と身構えていたのですが、Stripe を使えばコードをほとんど書かずに導入できることが判明。

しかし、いざ設定を始めると 「管理画面のどこで名前を変えるの?」「複数のアプリはどう管理する?」 といった、コード以外の部分で意外と躓きました。

今回は、初めてStripeを触るエンジニアに向けて、最短で安全に寄付機能をリリースするための手順と、私がハマった落とし穴をシェアします。

Next.js認証の深堀り:JWTという『透明な証明書』をどう扱うか?

Next.js(App Router)での認証実装。ライブラリが優秀すぎて「なぜか動く」状態になりがちですが、一歩踏み込んで JWT(JSON Web Token ジョット) の仕組みを理解すると、デバッグの質が劇的に変わります。

今回は、Auth.js(NextAuth)を例に、JWTの正体と現場で使えるTipsをまとめました。

Playwright × NextAuth v5:ログインのテストを自動化する方法

Next.js + NextAuth (v5) で構築された、AI画像ストックサイト「free-images」というサービスに E2E テスト(Playwright)を導入しました。

初期段階では「Googleログインしかないから、テストが難しいな」くらいに考えていたのですが、実際は認証基盤のアーキテクチャ変更にまで発展する大工事となりました。

この記事では、直面したエラーとその解決策、そして最終的に完成した「テスト用裏口実装」のコードを共有します。

Vercel × Route53 × Astro で「wwwあり」を正解にする理由

「ドメインは短い方がクールだ」

そう思って、個人開発のサイトではこれまで https://example.com のような「wwwなし(ネイキッドドメイン)」を好んで使っていました。しかし、このブログ(Astro Starlight + Vercel)を構築し、Google AdSenseやSearch Consoleの設定を進める中で、その認識を改めることになりました。

今回は、Vercel環境においてなぜ「wwwあり」が推奨されるのか、そしてAstroの設定でハマりやすい サイトマップの罠について共有します。

認証の基礎知識:Cookie、セッション、JWTなど

Webアプリケーションを開発する上で、避けて通れないのが**「認証 (Authentication)」**です。

特に Next.js + NextAuth (Auth.js) のようなモダンな構成を採用する場合、裏側で何が起きているのかを理解していないと、「ログインできない」「テストが通らない」「意図しないログアウトが起きる」といったトラブルに対処できません。

この記事では、認証周りの重要キーワードを、イメージしやすいように整理しました。

Playwright トラブルシューティング - Firefoxだけが動かない

現在開発中のAI画像ストックサイト『free-images』に、品質担保のためE2Eテストツールである Playwright を導入することにしました。

「モダンなツールだし、サクッと導入できるだろう」と高を括っていたのですが、Firefox環境でのみテストが落ちる という泥沼にハマりました。 今回はそのトラブルシューティングの記録を残しておきます。WSL環境で開発している方の参考になれば幸いです。

生成画像プロンプトを洗練

「赤い布の画像を作って」 AIにそう頼めば、確かに赤い布の画像は出てきます。しかし、それは果たしてストックフォトサイトで「売れる素材」と言えるでしょうか?

現在開発中の画像ストックサイト『free-images』では、単なる自動生成を超え、デザイナーが「これこそ探していた質感だ」と唸るクオリティを目指しています。今回は、Google Gemini APIを駆使したプロンプト改善の旅についてお話しします。

povo2.0で構築する安価なSMS認証基盤

開発やサービス検証を行っていると、「商用環境とテスト環境でアカウントを分けたい」「検証用にクリーンな電話番号がもう一つ欲しい」という場面に多々遭遇します。

しかし、そのためだけに月額数千円のキャリア契約を追加するのはコストが見合いません。今回は、Androidスマホとpovo2.0を組み合わせ、年間数百円で「死なない認証用番号」を維持する方法をまとめました。

30秒周期で画面が収縮する謎の挙動を追う。

作業中に突然発生し始めた「約30秒周期で画面が一瞬収縮する」という謎の挙動。 作業に集中できないだけでなく、ハードの故障も疑われるこの問題に対し、イベントログの解析から物理的な環境要因の特定までの記録をまとめました。

ある日、私のデスクトップ環境(GALLERIA / RTX 4060 Ti)で、画面が約30秒おきに数ミリ収縮し、また戻るという現象が起き始めました。

「30秒」というあまりに正確な周期は、ハードウェアの寿命というより、何らかのソフトウェア的な「タイムアウトとリトライ」を強く示唆していました。

gitのよく使うコマンド

実務で頻出するGitコマンドのメモです。ブランチの作成から、作業中の変更の退避、コミットの修正方法までをまとめています。

マウスの「逆スクロール」現象。高価なマウスを選ぶべきなのか?

コードを読んでいる時、長いログを追っている時。 マウスホイールを下に回しているはずなのに、画面が一瞬だけ「クッ」と上にスクロールする。

そんな地味ながらも強烈なストレスを感じる現象に遭遇したことはありませんか? これは ホイールの逆スクロール と呼ばれる、マウスの代表的な不具合の一つです。

「たかがマウスの不調」と侮るなかれ。1日中PCに向かう私にとって、この現象は、ボディブローのように生産性と集中力を削ぎ落としていました。

Astro Starlightを使ってポートフォリオサイトを構築

日々の技術的な学びやメモを何かの形で残していきたいと思い、いろいろ試しています。
とりあえず、このサイトは Astro Starlight を使って構築しました。
wordpressはあまり使いたくないという思いがあり、では何にしようかと考えた結果、Astroでサイトを構築することにしました。
Notionと迷いましたが、新しいことを試してみたく。