CSSを書き換えて、画面のどこかにあるボタンを押すだけのゲームです。 ただし、ボタンはズレていたり、隠れていたり、押せなかったり、なぜか埋まっていたりします。 margin、position、display、overflow などを駆使して、壊れたレイアウトをさらに壊しながら正解へたどり着こう！ CSSを完全に理解している人も、だいたい理解している人も、たぶん理解していない人も遊べます。 画面右側のエディターに CSS を入力して、左側のステージ上の要素を動かしたり、隠したり、押せる状態にしたりします。 編集モード ステージ上の要素をクリックすると、その要素を選択できます。 選択した状態で右側に CSS を入力すると、選択中の要素にスタイルが反映されます。 CSS は ; まで入力すると確定します。 プレイモード 正解のボタンを押せる状態にしたら、画面上部の プレイモード を押します。 そ

The Agent Harness Framework Not another SDK. Build powerful, autonomous agents with Flue's programmable TypeScript harness. Write once, deploy anywhere. export default async function ({ init, payload, env }) { // Initialize a new agent. // Provide a hosted sandbox, or use Flue's built-in virtual sandbox. const agent = await init({ model: 'anthropic/claude-sonnet-4-6' }); const session = await agen

Anthropicは米国時間4月30日、新たな防御型サイバーセキュリティ製品「Claude Security」を発表した。現在は大規模企業向けとされる「Enterprise」プランのユーザーを対象にパブリックベータ版が提供されており、より小規模の企業向けの「Claude Team」、および個人についても「Claude Max」プランのユーザーには「近日中に」提供される予定としている。 Claude Securityは、Anthropicのサイバー防御ツールボックスに追加された新たなツールだ。セキュリティ担当チームはこれで、「Claude Opus 4.7」モデルを使用して、「コードベースをスキャンして脆弱性を検出し、ターゲットを絞ったパッチを生成する」ことができるという。 脆弱性の優先順位付けも可能に 脆弱性スキャンの問題点は、ノイズになるような不要な情報が大量に抽出されるおそれがあること

こんにちは！株式会社エーアイセキュリティラボのはるぷと申します。 一般ユーザーがコマンド一発でrootを取れてしまうLinuxカーネルの脆弱性、CopyFail (CVE-2026-31431) が話題になっています。AIによって発見された論理バグで、汚しても問題ないEC2環境を作って実際に検証してみました。 この脆弱性は、 一般ユーザーがroot権限に昇格できる というものです。実行条件がとても簡単なので話題になりました。ざっくり仕組みを言うと、algif_aead・authencesn・splice() システムコールの組み合わせによって、メモリ上のページキャッシュを直接書き換えられてしまう、というものです。 脆弱性の発生原理は元記事の解説に任せ、ここではPoCで何が起きているのか中心に解説します。 TL;DR PoC を動かすと、一般ユーザーから1コマンドで root が取れる ディ

はじめに 画像やPDFのテキストをコピーしたいとき、オンラインのOCRサービスに画像を送るのはちょっと抵抗がありませんか？ 特に社外秘の資料や個人情報が写っている場合。 通信ゼロ、ブラウザの中だけで完結するOCR があれば安心して使えるのに — そう思って、Chrome拡張機能を作りました。 以前からいくつかの日本語OCRを試してきて、ブラウザ内でも実用レベルで動くことがわかっていたので、それを誰でも気軽に使える形にしたかったのが動機です。 yomitokuで作る日本語OCR Webアプリ — サーバーサイドで高精度な日本語OCR Tesseract.jsでカスタムモデルのトレーニング — ブラウザOCRの可能性と限界 ブラウザだけで完結する日本語OCR＋透視変換 — NDLOCRをブラウザで動かす Chrome Web Store で「オフラインOCR」と検索してもヒットします。 これま

はじめに 本日、Hono の作者 yusukebe さん から @hono/inertia が正式リリースされた。 前回、サンプルアプリの中身を除いて、Hono と Inertia.js の型貫通体験の仕組みを明らかにしたところで、今回は実際に簡単あアプリを作って、その触り心地を確かめてみる。 前回の記事 今回作ったアプリ 結論から言うと、SPA の書き心地が一段階アップデートされる体験だった。ふだん React + API で書いていた時のしんどさが、けっこうな部分まるっと消える。具体的には： API エンドポイントを書かなくていい React Router が要らない useEffect + fetch のお作法が消える 取得データ用の useState も要らない 以下、何が嬉しかったのかを、実装しながら掴んだ感覚で書く。 この記事で扱うこと @hono/inertia で何ができる

はじめに 「どのフレームワークを選ぶべきか？」 これは初学者だけでなく、新規事業の技術選定を任された中級者にとっても常に悩ましいテーマです。 いまフロントエンドの世界は、大きな転換期を迎えています。長年使われてきたReact、Vue、Angularの三大フレームワークが、これまでの古い常識を捨てて新しい次元へとアップデートしているからです。さらに忘れてはいけないのが、私たちのすぐ隣には「Claude Code」や「Cursor」のような、最強のAIアシスタントが当たり前のように存在しているということです。 この記事では、初学者が最初のステップを踏み出すための視点から、中級者がモダンなアーキテクチャをどう捉え、AIとどう協業していくべきかまで、各フレームワークの現在地をまとめました。 1. React：サーバー主導UIへの移行と「AIエコシステムの覇者」 現在もフロントエンド業界で圧倒的なシ

Data-driven link building: lessons from a $708K investment (BrightonSEO talk)

// サーバー側（Hono） app.get('/posts/:id', (c) => { const post = findPost(c.req.param('id')) return c.render('Posts/Show', { post }) }) // クライアント側（React） export default function Show({ post }: PageProps<'Posts/Show'>) { return <h1>{post.title}</h1> } post の型は Post として完全に推論される。間に API 定義も DTO も tRPC もスキーマ生成もない。サーバーで c.render() の第2引数に渡したオブジェクトが、そのまま React の props として、しかも完全に型付きで届く。 「API なし SPA」を謳う Inertia.j

みなさまこんにちは！エアークローゼットでCTOをしている辻です。 これまでに DB Graph MCP、社内MCP群の全体像、Biz Graph MCP と、社内向けに作っている MCP サーバーを順に紹介してきました。 今回はその中でもちょっと毛色が違うものを取り上げます。Sandbox MCP ── 非エンジニアの社員が AI と一緒に作ったアプリを、ワンコマンドで社内に安全に公開できるプラットフォームです。 「Claude Code でアプリを作れるなら、それをそのまま社内に出せばいいじゃん」という話を、安全に実現する仕組みです。 背景：作るのは簡単になったが、公開は難しいまま Claude Code をはじめとする AI コーディングエージェントの普及で、いま社内の景色が大きく変わりつつあります。 これまで「アプリを作る」と言うと、エンジニアの仕事でした。要件定義してデザインを起こ

各種エージェントの台頭により、サーバレスに動作しローカルファイルとして保存でき、永続化可能な組み込みデータベースのSQLiteやDuckDBへの注目を感じる昨今ですね。これらDBでの全文検索(FTS)の日本語対応ってどんなものなのだろうかと調べると、trigram での検索はできるものの、日本語語彙に特化した検索は標準できないようでした。 Linderaを使うアプローチもあるようですが、今回は Rust で実装されている軽量高速なトークナイザの Vaporetto を組み込んで動く拡張機能を作ってみました。 SQLite + Vaporetto https://github.com/hotchpotch/sqlite-vaporetto DuckDB + Vaporetto https://github.com/hotchpotch/duckdb-vaporetto Vaporetto は

私の場合、旧検証環境は使い古しているのでアカウント閉鎖、本番環境（旧管理アカウント）は流用するので組織から離脱（組織から除外）することにしました。 アカウント閉鎖 旧管理アカウントのAWS Organizationコンソールから、当該アカウントを選択して閉鎖を指示します。 閉鎖したアカウントは90日間の猶予期間に入り、猶予期間中はサポートに連絡することで復活が可能です。 猶予期間中のアカウントが存在している場合でもOrganizations組織の削除は可能です。 アカウントの離脱（組織から除外） アカウントの離脱（組織から除外）を行う場合、事前に当該アカウントにて以下の条件を満たす必要があります。 ルートユーザの認証設定完了（パスワード・MFA） 支払情報の設定完了 SMS認証の完了 サポートプランの設定完了 新規アカウントは作成後４日経過 1.ルートユーザの認証設定 AWS Organi

はじめにLayerXで執行役員／VP of Product をしているnumashiといいます。 これまでキャリアの多くを、新規プロダクトの立ち上げにプレーヤーとして費やしてきました。ゼロからプロダクトを作り、顧客に届け、失敗し、作り直す——その繰り返しの中で、Minimum Viable Product(以下、MVP)という概念は自分にとって単なるフレームワーク以上のものでした。 「何を作るべきか」を問い続けるための、思考の型でした。 今、新規事業をやる中で、改めて生成AIの登場によってMVPの意味が根本から変わりつつあると感じたため、言語化しようと思います。 MVPとは何か新規プロダクトを作る際、MVPは開発の羅針盤でした。 Minimum Viable Product——その本質を説明するとき、Henrik Knibergのイラストがよく引用されます。 「車を作るなら、まずタイヤだけ

You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert

ブックマークでは物足りず、監視ツールでは堅すぎる。そんな自宅サーバー管理者にちょうどいいのが「Dashy」です。多数のサービスリンクを1画面に整理し、オンライン状態の確認やRSS・天気予報などのウィジェットも設置できるモダンな見た目のオープンソースダッシュボードです。 Dashy - The Ultimate Homepage for your Homelab | Dashy https://dashy.to/ Lissy93/dashy: A self-hostable personal dashboard built for you. Includes status-checking, widgets, themes, icon packs, a UI editor and tons more! https://github.com/Lissy93/dashy Demo Homelab

セキュリティグループのCIDR設定について、同じ指摘を3回レビューコメントに書いた。1回目は「うっかり」で済ませ、2回目で「仕組みで防げるな」と思い始め、3回目のとき「これはレビューで防ぐ問題ではない」と腹が決まった。 アプリ開発者からキャリアをスタートしSREに転向し、Webサービスの立ち上げからPlatform SREまで4社で担ってきた。あるWebサービスのSREチームで、Policy as CodeをCIパイプラインに組み込んだ。この記事はその記録だ。 何が問題だったか 当時、複数の開発チームがTerraformでインフラを管理していた。変更のたびにSREチームへのレビュー依頼が来る運用だったが、問題が2つあった。 一つは「レビュアーによって指摘内容が変わる」ことだ。自分がいるときはセキュリティグループの開放範囲を必ずチェックするが、別のメンバーが担当した日は見落とされることがあっ

https://dev.classmethod.jp/articles/claude-code-security-basics/

はじめに Claude Code のプラグインエコシステムが急速に拡大しています。2026 年 4 月時点で、公式マーケットプレイス（claude-plugins-official）には 160 個のプラグインが登録されています。うち 32 個が Anthropic 製、残りはサードパーティ製です。 しかし、数が多すぎて「結局どれを入れればいいの？」と迷う方も多いのではないでしょうか。 この記事では、公式マーケットプレイスの中身を実際に確認した上で、おすすめのプラグインと MCP サーバー系プラグインを紹介します。 プラグインの基本 プラグインとは Claude Code プラグインは、スキル・フック・MCP サーバー・エージェントをパッケージ化して配布する仕組みです。プラグインをインストールするだけで、新しいスラッシュコマンドやツールが使えるようになります。 インストール方法 # 公式マ

クエリが遅くなった。直そう。ここから問題が始まる プロジェクト管理SaaSを1年ほど運用すると、Issueテーブルが200万行、変更ログテーブルが2000万行を超えてくる。ソフトデリートを採用していれば物理削除されないので、行数は増える一方だ。 最初の兆候はユーザーからの報告だった。「Issue一覧の読み込みが遅くて、フィルターを切り替えるたびに5秒くらい待たされるんですが」。スロークエリログを見ると、フィルター付きのIssue一覧クエリがp95で3秒を超えている。インデックスを追加すれば改善する。スキーマ変更も1つ控えていた。どちらもやること自体は明確だった。 問題は「200万行のテーブルにDDLを打つ」という行為そのものにあった。膨れ上がったテーブルに対するスキーマ変更は、パフォーマンスを改善するための作業が、新たな障害を引き起こす可能性を持っている。治療のための手術が患者を殺しかねな

皆様、Claude Code使ってますか？ CLIで利用されている方が大多数だと思いますが、VSCodeの拡張も悪くないよ、というお話です。 いつのころからか、左右にパネルが出るような構成になっています。 右側が通常（？）のチャット欄で左が過去のセッション一覧みたいな感じです。 左側にある「New session」をクリックするとメインのコードエディター部分にチャット欄がタブとして表示されます。 連打すると量産できますし タイル状に配置したりできます。 モードとか設定とか、マウスでポチポチ設定できます。 MCPサーバーの設定とかも、グラフィカルでわかりやすい。 プランモードでテトリスを作ってみましょう。 そういえば、Windowsですがいい感じにPowerShellを実行してくれます。 そういえば、別途claudeをインストールもしておらず、VSCode拡張をインストールしただけです。 ツ