Fintan » Development Guide with Generative AI生成AI エンジニアリング活用ガイドは、開発プロセスにおいてすぐに生成AIを活用できるように設計された、TIS株式会社が提供しているガイドラインです。 ChatGPTやGitHub Copilotなどの導入方法、開発プロセスにおける生成AIの具体的な活用方法などを提供します。 どなたでも無償で利用いただけます。
「読みやすいコード」を依存グラフで考える
はじめに こんにちは、ダイニーの ogino です。 この記事では、コードの読みやすさを比較判断するために役立つメンタルモデルを紹介します。 本記事を読むと、「このコードは良い / 悪い」という感覚が身につき、その理由を自信を持って説明できるようになるはずです。 コードの読みやすさとは何か コードを読む時には大抵、何か特定の目的があります。例えば、 API /foo にリクエストした時の動作を知りたい、ある画面で発生しているバグの原因を知りたい、などです。 この時、コードベースの隅から隅まで読み尽くすのではなく、特定のポイントから出発して関連する箇所を芋蔓式に辿りながら読むはずです。 人が一度に理解して覚えておける情報量には限界があるので、辿らなければいけないコード量が少ないほど当然読みやすくなります。 つまり、ある目的に関連するコードの箇所が局所的かつ明示的であるほどコードは読みやすいと
これからNext.jsを始める人に注意してほしいセキュリティ事項
Next.js v14からServer Actionsがstableリリースとなり、開発体験だけでなく、ユーザ体験(ハイドレーションの完了を待機せずフォーム操作ができる、プログロレッシブ•エンハンスメントなど)の向上が見込まれます[1]。 今回は、Next.jsのServer Actionsを実装する上で注意しなければならないセキュリティ懸念事項とその対策を提案します。 Server Actionsとは formからsubmitされた際の処理(DBの更新等)をサーバサイドで非同期で実行できる関数です。ReactのServer ComponentsだけでなくClient Componentsからも呼びだすことができます。つまり、formがsubmitされた際のDB更新などの処理をわざわざエンドポイントを立てずに関数として書くことができます。[2] Server Actions(またはServ
知らないとあぶない、Next.js セキュリティばなし
ムーザルちゃんねるのムーです。今回は zaru さんと、Next.js のセキュリティについて話しました。 セキュリティについては様々あると思いますが、今回は以下の3点をピックアップして話しました。 Client Components の Props から露出する Server Actions の引数に注意 認証チェックをやってはいけない場所、やって良い場所 これらは、Next.js 入門者がうっかりとやってしまうリスクがあるものです。 このような罠は、アプリケーション自体は正常に動くので、知らないうちにはまってしまいますし、自力で気づくのも難しいものです。もしも知らないものがあれば、ぜひご確認ください。 楽しくて、安全な Next.js 生活をお送りください！ Client Components の Props から露出する これは、シンプルで当たり前といえば当たり前ですが、Client
AI エージェントを仕組みから理解する
はじめに こんにちは、ダイニーの ogino です。 この記事では、AI エージェントや MCP に入門しようとしている人向けに、エージェントの内部実装について概説します。これを理解することで、現状の AI にできることが明確になり、今後の技術動向を追う上でも役に立つはずです。 本記事の要旨 MCP の表層的なプロトコルには大した意味も革新性も無いので、AI エージェントを理解するにはまずコンテキストを把握しましょう。 素の LLM の能力と、エージェントの実装を切り分ける AI エージェントは、自律的に判断してファイル操作や Web ブラウザなどのツールを使い分けることが可能です。しかし、その基盤となっている LLM にできるのは、テキストを入力してテキストを出力することだけに限られます[1]。 以降では「LLM にできないこと」を掘り下げ、それを補うために AI エージェントがどのよう
Claude Code の --dangerously-skip-permissions を安全に使う Hooks 設定
こんにちは、わさびーふです。 今回は Claude Code の --dangerously-skip-permissions オプションを使いながらも、hooks↗ 機能と deny-check.sh スクリプトで安全性を確保する方法を紹介します。 問題：権限チェックのジレンマ Claude Code には通常、安全のための権限チェック機能がありますが、開発効率を重視して --dangerously-skip-permissions を使うことがあります。 しかし、これには以下のリスクがあります。 システム設定を変更する git config コマンドの実行 パッケージの自動インストール（npm install -g、brew install など） 権限変更（chmod 777）や強制削除（rm -rf）の実行 GitHub の API を使った破壊的操作 解決策：PreToolUse
Claude Codeの指示忘れ問題を解決！HooksでPython環境をpip禁止＆uv統一にする
Claude Codeで開発していると、こんな問題に遭遇しませんか？ CLAUDE.mdに「uvを使って」や「uvの具体的な環境構築ガイド」を書いても、ルールを無視してpipを使われてしまう 仮想環境をアクティベートするのを忘れ、Python実行でエラーが頻発する。そして別のActivateされていた環境が汚される 長いやり取りの途中で、AIがプロジェクトのルールを忘れてしまう CLAUDE.mdに詳細な環境構築手順やuvパッケージマネージャーの使用を記載していても、Claude Codeが一貫してそのルールを守ってくれることはなかったです。 しかし、Claude Code Hooksを使うことで、指示忘れの問題を解決できました！ この記事では、実際にPython環境のパッケージマネージャーを強制的にuvに統一するためのHooksスクリプトを公開し、Hooksのメリット等を解説します。 例
Claude Codeの「すぐルール忘れる問題」をHooksで解決する
この記事はClaude Code v1.0.41で動作確認しています。Hooks機能は比較的新しい機能のため、必ず最新バージョンのClaude Codeを使用してください。古いバージョンでは正常に動作しない可能性があります。 Claude Codeの「すぐルール忘れる問題」を解決する超効果的な方法を見つけた気がする を読んで、これいいなと思いました。 でも毎回手動でルールを確認するのは面倒。Claude CodeのHooks機能を使って自動化できるじゃんって気づいたので、方法を紹介します。 Hooksとは Claude Codeの新機能で、特定の処理の前や後、返答完了時にフックしてコマンド実行できる代物です。 実装例 元記事の5原則をHooksで自動化するとこんな感じです。 Claude CodeのHooksは以下のようなJSONフォーマットで情報を渡してきます。 { "session_i
「考えなくていいUI」を考える｜ritar
これはdesigning plus nine Advent Calendar 11日目の記事です。 こんにちは。ritarと申します。 Slackに昨年追加された「キャッチアップ」という機能がめちゃめちゃ便利で毎日使っているのですが、ご存知ですか？ 各チャンネルがカードになっている。右にスワイプすると既読にできるSlackには、メッセージを送れる「チャンネル」が多数あり、それぞれで独立した会話が起こります。 普通は、「チャンネル一覧」から一つずつ開いて、その中に届いている新着メッセージを読みます。しかし、大きい組織だとどんどんチャンネルが増えていき、既読をつけるのが大変になります。 そこで導入されたのがキャッチアップです。この画面では各チャンネルがカードになっており、それを左右にスワイプしていくことで、既読にするか未読にするかを選ぶことができます。 何も考えずにただ左右にスワイプしていくだ
Claude CodeにLSPツールが追加
数ヶ月前の「Serena MCPはClaude Codeを救うのか？」で「Claude Code本体にLanguageServer統合を追加する可能性も考えられます」と書きましたが、その機能が2.0.74で有効になりました。 導入方法は「Claude Code の LSP サポート」が詳しいので参照ください。 Claude Code の LSP サポートClaude Code のバージョン 2.0.74 から LSP（Language Server Protocol）サポートが追加されました。LSP サポートにより、Claude Code はコードベースに対してシンボルの定義検索、参照検索、ホバー情報の取得などの操作が可能になります。この記事では Claude Code の LSP サポートの概要と使用方法を紹介します。azukiazusaのテックブログ2まとめると/plugin コマンド
Claude Code の LSP サポート
Claude Code のバージョン 2.0.74 から LSP（Language Server Protocol）サポートが追加されました。LSP サポートにより、Claude Code はコードベースに対してシンボルの定義検索、参照検索、ホバー情報の取得などの操作が可能になります。この記事では Claude Code の LSP サポートの概要と使用方法を紹介します。 コーディングエージェントが LSP（Language Server Protocol）を扱えるようになることで、エージェントがより効率的にタスクを遂行できるようになります。文字列でコードベース全体を検索するのではなく、LSP を通じてコードの構造やシンボル情報にアクセスできるため、正確な情報を迅速に取得・編集できるためトークンと時間を大きく節約できます。このことはコーディングエージェントにセマンティックなコード検索・編集
ドラゴンを倒して覚える Claude Code - Commands, Skills, Subagents, Rules の違いと使い分け
この記事を読むべき人 Claude Code をカスタマイズしようとして、こんな経験はありませんか？ 「このルール、CLAUDE.md に書く？Skills に書く？」と手が止まる Commands を作ったのに、結局 Skills との違いがわからない Subagents の存在は知っているけど、いつ使うか判断できない そして最近、Rules という機能まで登場しましたね。「また増えた...これどこに書くの？」 公式ドキュメントを読んでも、概念の使い分けがピンとこない。そんな人のために、RPGゲームで例えてみました。 冒険の始まり - あなたはプレイヤー あなたはモンスターを倒すRPGをプレイしています。 画面の中には主人公のキャラクターがいます。あなたはプレイヤーとして、この主人公に指示を出してゲームを進めます。 Claude Code で言うと： あなた（プレイヤー） = ユーザー
予約処理で結果整合を実現するための実装パターン - 一休.com Developers Blog
この記事は一休.com Advent Calendar 2025の13日目の記事です。 宿泊開発チームでエンジニアをしている @kosuke1012 です。 本記事では、予約処理の中で必要な在庫引当、カード決済などの各処理について、予約処理全体として成功/失敗の結果整合を実現するための実装パターンを紹介します。 背景 現在、一休.com の宿泊予約のシステムでは、予約部分のリニューアルを進めています。 予約リニューアルプロジェクトの全体感もどこかで是非説明したいのですが、アドベントカレンダーの期日も迫ってきているため、 リニューアルの中で取り組んだ、予約処理の結果整合を実現するための実装について書いてみたいと思います。 用語 この記事内での用語の定義をしておきます。 この記事の中で「トランザクション」と言った際には、予約処理全体を指すことにしたいと思います。 また、「カード決済」「在庫引当
Claude Codeのユーザー設定プロンプトを使い分けてコンテキスト管理を最適化する (CLAUDE.md, rules, slash commands, skills, subagents)
Claude Codeで設定できるプロンプトがどんどん複雑化してるので、自分の理解を整理しとく。ユーザー単位でもプロジェクト単位でも設定できるが、プロジェクト単位をあちこちでやるのは大変なので、ユーザー単位での設定をある程度進めたいなと思ってる。 CLAUD.md、rules、slash commands、skills、subagents、全部一緒じゃないですかー！という人も、それぞれの用途とコンテキストの扱いを理解すれば、使い分けの意義が見えてくると思う。 設定できるプロンプトと用途プロンプトの肥大化と複雑化はコンテキストウィンドウの枯渇や重要情報の埋没などの様々な問題を生む。この問題を回避するためにプロンプトを用途に応じて様々に設定できるようになっている。 CLAUDE.md (~/.claude/CLAUDE.md)全プロジェクトに共通する設定rules (~/.claude/rul
2025年版 私がAIエージェントと協働しながら集中する方法 - じゃあ、おうちで学べる
集中できなくなった 何かがおかしい。 AIエージェントを使い始めてから、自分が壊れていくのを感じていた。以前は4〜5時間ぶっ通しで集中できた。コードを書き始めたら、気づいたら夕方になっていた。あの没入感。あの充実感。それが、完全に消えた。 30分も持たない。いや、10分だろうか。1つの作業に没頭しようとしても、すぐに別の作業に引き戻される。戻ってきたら、さっき何をしていたか忘れている。頭の中が常にざわついている。自分の脳が、自分のものではなくなっていく感覚があった。 最初は自分を責めた。集中力が落ちたのは、体力のせいか。年齢のせいか。怠けているのか。スマホの見すぎか。でも違った。同じように苦しんでいる人が、周りにもいた。 きっと、最初からうまく馴染める人もいるのだろう。複数のエージェントを同時に回しながら、涼しい顔で成果を出せる人。元々、全体を俯瞰しながら動くのが得意な司令官タイプ。私は違
Background Fetch API が消えそうだった話 | blog.jxck.io
Intro 「Background Fetch を使っているのが、世界であなたのサイトだけなんだけど、この機能消しても良い?」 と、TPAC 2025 の会場で、Chrome の Service Worker チームの開発者と話していた際に言われた。 Background Fetch Background Fetch は、Service Worker を使って、文字通り Fetch をバックグラウンドで行う機能だ。 特に Android では、ダウンロードの UI にプログレスが表示され、終わったら Cache API に保存される。 筆者が運営している mozaic.fm のサイトは、Podcast アプリと同じようなことを Web でもできるように PWA 化し、様々な機能を試していた。 PWA: モバイルでインストールしてアプリとして使える Background Fetch: エピソ
かゆいところに手が届く！Geminiの小ワザ【個人的】8選
こちらは DSKアドベントカレンダー2025 7日目の記事です！🎄 2025年も終わりに差し掛かろうとしている今日このごろ、振り返ればGeminiに振り回された１年だったな〜〜と感じています。（もちろんいい意味で！） 嬉しいアップデートが毎日のように降り注いでくる激アツプロダクト。 長年Googleに関わる業務に携わってきましたが、こんなに脳汁垂れ流しながら仕事したことはないです。 そんなGeminiを追い回し続けた私が「結局これが便利なんだよな」という結論に至った 【個人的】Gemini の小ワザ を 8個に絞ってご紹介したいと思います。 ※あくまで【個人的】な選定です。ご了承ください🙏 ※Google Workspace アカウントで使える Gemini / NotebookLM の機能をメインにご紹介します。 🎯 前提と課題 📄 【プロンプトあり】業務で活きる Gemini
「FastAPI + htmxが最強説」- AIエンジニアがモック作るならReactは不要、Streamlitも捨てよう
FastAPI + htmxが最強説 - Pythonエンジニアがモック作るならReactは不要、Streamlitも捨てよう この記事はLivetoon Tech Advent Calendar 2025の12日目の記事です。 宣伝 今回のアドベントカレンダーでは、LivetoonのAIキャラクターアプリのkaiwaに関わるエンジニアが、アプリの話からLLM・合成音声・インフラ監視・GPU・OSSまで、幅広くアドベントカレンダーとして書いて行く予定です。 是非、publicationをフォローして、記事を追ってみてください。 本題 どうも、LivetoonCTOのだいちです。 今回はスタートアップでプロトタイプ開発する時の技術選定について書きます。結論から言うと、FastAPI + htmxという組み合わせがモック開発において最も効率的で効果があると思います。 モックごときでReactを
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
今さら聞けないDocker入門 〜 Dockerfileのベストプラクティス編
GitHub - ykdojo/claude-code-tips: 40+ tips for getting the most out of Claude Code, from basics to advanced - includes a custom status line script, cutting the system prompt in half, using Gemini CLI as Claude Code's minion, and Claude Code running itself
