イベントの内容覚えてますか？ イベントに参加しても内容を覚えていることって少なくないですか？ イベントに参加しただけで満足して、特に生産的な活動に活かすことなく終わってしまうことがあると思います。また、登壇者の話を必死にメモしようとして、肝心な内容を聞き逃してしまうこともよくあります。 イベント参加は、個人的には学習のモチベーションアップに繋がるので良いのですが、せっかくなら学んだ内容をしっかり定着させたいと思いました。そこで、YouTubeや現地の音声を文字起こしして振り返りたいと考えたものの、理想的なツールが見つからなかったので自分で作ってみることにしました。 この記事では、OpenAIの音声認識モデル「Whisper」を使って、音声をリアルタイムで文字起こしする簡単な機能を自作したので紹介します。 マイクで音声を拾うところから、YouTubeの音声を文字起こしするところまで一通りやり

プログラミングでは、1文字でも打ち間違いがあればエラーの原因になってしまいます。 そこで似たような文字、例えば数字の「1」（いち）とアルファベットの「l」（エル）、数字の「0」（ゼロ）とアルファベットの「O」（オー）などを容易に見分けられるようなフォントを使うことが、ミスを防ぐことにつながります。 コードを表示させたときに整然として見やすく、エディタ上でカーソルを上下に移動させてもカーソル位置が左右にぶれずに表示されるように文字の幅が等幅に揃っていることも必要でしょう。 日本語の場合には、「－」（マイナス記号）と「ー」（音引き）の区別や、コード内に全角空白が紛れ込んだとしてもすぐに見分けられることなどの特徴を備えていることもプログラミングに適したフォントに求められる条件だといえます。 この記事では、そうした特徴を備えたプログラミングに適したフォントを2025年版としてまとめました。この冬休

株式会社FLINTERSでフロント&バックエンドエンジニアをやっている者です！ いい加減、git worktreeを身近においておこうと思い書き留めました。✏️🗒️ 本記事はFLINTERS BLOG Advent Calendar 2025の13日目の記事となります。 はじめに 開発者の皆さんなら、一度は「コンテキストスイッチ地獄」を経験したことがあるのではないでしょうか。新しい機能開発に没頭しているまさにその時、Slackに飛び込んでくる 「緊急バグ修正お願いします！」 の通知。 ここから始まる従来の手順は、思い出すだけでも気が滅入ります。 まず、中途半端な作業を git stash で退避。次に git switch でバグのあるブランチに移動し、修正作業に頭を切り替えます。 修正が終わったら、また元のブランチに戻り、git stash pop を実行。 しかし、複数の stash

2025年11月19日、AWS CLIの認証をブラウザベースで実現する新コマンド 「aws login」 がリリース、AWSマネジメントコンソールにログイン済みのブラウザで承認するだけで、ローカルのAWS CLIが利用できるようになりました。 「開発用端末にアクセスキーを保存したくない」、「MFA必須のIAMユーザーで簡単にCLIを使いたい」という課題を解決する、「aws login」を試す機会がありましたので、紹介します。 AWS CLIの更新 aws login コマンドは、 AWS CLI version 2.32.0 でサポートされた新機能です。 まずは手元の環境を最新版にアップデートしました。 今回、先日リリースされた Kiro-CLIに依頼して、AWS CLIを version 2.32.1 に更新しました。 > macOS、ローカルにインストール済みの AWS CLI v2を

2024/04/09 続編書きました。 LangChainを使って色々LLMアプリを作って遊んでいます。 体感速度が遅いけど、どこが遅いかわからない サンプルソースをコピペして作ったので、実は中身のことをわかってない 入力と出力だけじゃなくて、中間の状態も知りたい みたいなことってありませんか？そんなときに使えるツールを見つけましたのでご紹介します。 Langfuseとは LangfuseはLLMエンジニアリングプラットフォームです。LLMアプリからメトリクスやトレースを取得し可視化できます。また、評価、プロンプトの管理、データセットの作成なども行えます OSS開発が進められており、開発の主導はFinto Technologies GmbHというドイツの企業のようです。 公式サイト 主要機能（公式サイトより） LangSmithと類似したツールですが、OSSなのでセルフホストできる点がポイ

仕様駆動開発（Specification-Driven Development, SDD）は、AI コーディングエージェントを活用した新しいソフトウェア開発スタイルです。GitHub が提供する Spec Kit は、仕様駆動開発を支援するためのツールキットであり、AI との対話を通じて正確な受け入れ基準の定義とコード生成を支援します。この記事では Spec Kit を使用して仕様駆動開発を試してみます。 Kiro と呼ばれる AI IDE の登場は、仕様駆動開発と呼ばれる AI コーディングエージェントを活用した新しい開発スタイルの可能性を示しました。仕様駆動開発とは、まず AI と対話しながら要件定義・システム設計を行い、その後作成した設計書をもとに AI にコード生成を行わせる開発スタイルです。 ユーザーの要求をまず明確な仕様として定義することで、ユーザーが頭の中で思い浮かべていた要

こんにちは、リテールアプリ共創部の戸田駿太です。 今回はChrome DevToolsを利用した手動テスト時の入力を効率化する方法をご紹介します。 この方法を使えば今まで手作業で行なっていた入力を簡易的に自動化することができるため手動テストの効率が向上します。 まずは実行動画から！ 左のカード登録画面（仮）のバリデーションテストをしている様子です。 この動画で行なっていること 正常な値を入力して登録 正常登録の確認 正常な値の状態から1つの入力を編集してバリデーションエラーの状態で登録 エラーが発生することを確認 Recorderを使うメリット ✅ 手動テストの効率が向上する 今までテスト項目毎に入力していた値をミスなく入力できるようになります。 コードベースの確実な操作ができるのでテストのミスも少なくなるので安心感も増します。 ✅ Chromeの開発者ツールであるため、環境構築が必要ない

GitHub からリリースされたばかりの Spec Kit を試してみましたので使用感などをまとめました。 Claude Code との組み合わせを前提としています。 試してみる Spec Kitは、GitHub が公開した仕様書駆動開発ツールです。AWS の Kiro に相当するツールですが、こちらはエディタを使用せず、CLI + コーディングエージェント を組み合わせて仕様書生成からコード生成まで行うツールです。 3つのフェーズに分けて、仕様書の生成から実装計画、タスク分解までを行います。 まずはインストール Python パッケージマネジャの uv コマンドでインストール＆実行します。

「エンジニアならtmuxくらい使いこなしたらどうだ」の声に驚いて振り向くと、研修中のメンターと新人。 メンターはサッサと自分の業務に戻ったけど、新人はiTerm2を開いて俯いたまま。 私は咄嗟にThinkPadを連れて、新人の目の前でtmux windowを Ctrl+tで開いた。2つも開いた。 大丈夫ですよと念じながら。 「母親ならポテトサラダくらい作ったらどうだ」 この記事の概要 tmux固有のショートカットを覚えずにtmuxへ入門します tmuxとは tmuxは，誤解を恐れずに言えば，ターミナルで タブ機能 や 画面分割 を行えるようにするためのソフトウェアです． ブラウザからタブ機能がなくなったら？たぶん不便すぎて泣きたくなるはず．tmuxによってターミナルが便利になるのは言うまでもありません （言ってる） 「タブとか画面分割ならiTerm2やTerminatorでもできるでしょ」

Vibe Kanban は、AI コーディングエージェントの管理を支援するためのツールです。カンバン方式の UI でタスク管理を行い、各タスクに対して AI エージェントを割り当てて人間がその進捗を管理できます。この記事では Vibe Kanban を使用して AI コーディングエージェントの管理を実際に試してみます。 AI コーディングエージェントが登場して以来、開発者の仕事はコードの生成からコードのレビューや設計、AI エージェントの管理へとシフトしつつあります。AI コーディングエージェントは大量のコードを高速に生成できる一方で、生成されたコードが正しいか、セキュリティ上の問題がないか、プロジェクトのスタイルガイドに準拠しているかを確認する必要があります。また、AI エージェントに適切なプロンプトを与え、タスクを分割して効率的に作業を進めるための管理も重要です。 Vibe Kanba

はじめに こんにちは！令和トラベル Frontendエンジニアのふくだです。 「Figma MCPを使っているけれど、生成されるコードの精度がイマイチ...」 そんな悩みを抱えていませんか？ 本記事では、実際にFigma MCPを使ったコード生成を体験し、そこから段階的に改善していく過程を詳しく解説します。セットアップから始まり、失敗例の分析、具体的な改善手法、そして最終的なベストプラクティスまで、実践的なアプローチでFigma MCPのポテンシャルを最大限引き出す方法をお伝えします。 事前準備 検証環境 Figmaデスクトップアプリ（Web版では利用できないので注意） MCP対応エディタ（VS Code, Cursor, Windsurf, Claude Code等） Next.js 14+ (App Router) TypeScript、Tailwind CSS

PDFファイルをマークダウンに変換する作業って、地味だけど本当に大切な作業ですよね。 「また手作業でコピペか...」 「レイアウトが崩れてる...」 「表がめちゃくちゃになってる...」 私もさまざまな文書管理の現場で同じような課題に直面してきました。特に、既存のPDF資料をObisidianやNotionなどのマークダウン形式で管理したい場面って、本当に多いですよね。 手作業でやると、一つの文書だけで数時間かかることもあります。表や画像の配置を調整して、リンクを張り直して、フォーマットを整えて...。骨が折れる作業です。 「もっと効率的な方法はないだろうか？」 そう思っていた矢先、いくつかの優秀な手法を発見しました。今回は、スキルレベル別に4つのアプローチをご紹介したいと思います。 【各レベルの概要】まず、それぞれのアプローチの特徴を簡単にご紹介しておきますね。 レベル1：GPT-5でシ

Oikonです。外資系IT企業でエンジニアをしています。 AIエージェントのコンテキストエンジニアリングが最近は注目を集めています。今後もしばらくはこの流れが続くんじゃないかと。 AIエージェントにコンテキストを与える仕組みのために、知識の源泉としてObsidianを3ヶ月ほど前から試行錯誤しながら使っています。 最近になって、ようやく自分の中でしっくり来る運用が固まってきたので、その方法を共有します。 この記事は、先日Xにポストした内容の詳細版です。 Obsidianの運用方法は人によって全く違うと思うので、「こんな運用方法もあるのね」くらいに読んでいただければ幸いです。 運用の流れ まず以下が揃っていることを前提とします。 Obsidian Desktop Obsidian Mobile(Optional) Claude Code クリックで、それぞれの公式サイトに飛びます。 はじめに

Introducing Bases, a new core plugin that lets you turn any set of notes into a powerful database. Now available to everyone with Obsidian 1.9! pic.twitter.com/PXbwzAeO8T — Obsidian (@obsdmd) August 18, 2025 私自身β版から使用しているのですが画像の表示をはじめとしていくつかつまづきポイントがあるので Bases の使い方を基礎から解説します。また Bases と WebClipper を組み合わせると大変便利なのでそちらの方法についても解説します。 BasesとはBasesはObsidianが公式で提供している機能で既存のObsidianノートをまとめてデータベースのように扱う事ができ

Google⁠⁠、AIを使って非構造化テキストから構造化データを抽出するオープンソースPythonライブラリ「LangExtract」をリリース Googleは2025年7月30日、非構造化テキストから構造化データを抽出するオープンソースのPythonライブラリ「LangExtract」をリリースした。 Introducing LangExtract: A Gemini powered information extraction library -Google Developers Blog ✨Announcing LangExtract! ✨ Our new open-source Python library for information extraction, powered by #Gemini. ✅ Turn text into structured data ✅ Trace

はじめに 最近 Markdown を触る機会、増えてますよね。 AI ツールの登場で、書いたり読んだりレビューしたりが日常的になってきました。 特に最近は Kiro なんかの登場もあり、Markdown がワークフローの中心になっている人も多いかと思います。 ただ、ローカルに溜まっていく .md ファイルを 読む 体験には、あまり選択肢がありませんでした。 エディタで1ファイルずつ開くのは面倒だし、ツリー構造を見ながら全体を把握したいときにも不便です。 そこで今回 mdts を作りました。 ローカルにある Markdown ファイル群を、 npx mdts のみでツリー構造のままブラウザで閲覧できるようなCLIツールです。 特徴 ⚡ 1コマンドで即起動 npx mdts を叩くだけで現在のディレクトリをブラウズ可能。 🌐 ブラウザベース 専用アプリ不要。Web ブラウザでそのまま閲覧可能

「通知を送るだけ」なら Webhook、「対話が必要」なら Bot で実装するのが一般的に良いでしょう。なお、今回は Webhook をテーマとしますが、今後は Bot に関する記事もあげていく予定です。 ざっくり Webhook の作成方法 1. チャンネルの設定を開く 送信先のテキストチャンネルを右クリック → 「チャンネルの編集」を選択します。 2. 連携サービスから Webhook を作成 左メニューの「連携サービス」→「ウェブフックを作成」をクリックします。 3. Webhook の設定 お名前: メッセージ送信時の表示名 アバター: アイコン画像（オプション） チャンネル: メッセージ送信先 ※ 全て後から変更可能です。 4. URL をコピー https://discord.com/api/webhooks/[ID]/[TOKEN] 形式の URL が発行されます。 ※ この