Claude Designが来た日 ─ Webデザイナーとフロントエンドの仕事はどこまで削られるのか
はじめに 2026年4月17日（米時間金曜）、Anthropicが Claude Design を research preview として発表 自然言語でプロトタイプ・スライド・モックアップ・LPを作れる、Claude Opus 4.7ベースの新機能 競合は Figma Make / v0 / Lovable / Bolt / Google Stitch / Gamma / Canva 発表前後で Figma -6% / Wix -4.7% / Adobe -2.7% / GoDaddy -3% と市場は結構まじめに反応 「Webデザイナー・フロントエンドの仕事が丸ごと消える」のではなく、「初稿を作る工程」と「単純なUI実装」から先に溶ける、というのが現時点での実際的な読み 普段はClaude CodeやAIツール周りの記事を書くことが多いのですが、今回は界隈としてインパクトが大きかった
我々はCodexとどう向き合うべきなのか
この記事は、すでにCodexやClaudeCodeなどのAIコーディングツールを実際に使い始めているエンジニアに向けて書いている。「期待ほど効率が上がらない」と感じている人や、運用の型を模索している個人開発者を想定している。導入方法や基礎理論は扱わない。ひとりのエンジニアが数ヶ月間Codexと向き合って得た、実践的な運用知見を語る。 数ヶ月で変わったこと まず、ここ数ヶ月でAIコーディングツールの使い方が大きく変わったという話からしたい。 数ヶ月前のClaudeCodeガードレール戦略全盛期と比べると、隔世の感がある。あの頃は、AIが暴走しないように制御する、余計なことをさせないようにガードレールを張り巡らせることに頭を悩ませていた。Kiroが登場したときも、その延長線上にあった。 しかしGPT-5-Codexの登場で、その流れが変わった。 コンテキスト詰め込み時代の終わり 何が変わったの
HTMX入門【はじめからそうやって教えてくれればいいのに！】
はじめに 【追記】↓100秒テックでイラスト投稿してます！よかったら見てってください！ HTMXとは？ HTMX とは、一言で言うと、JavaScriptを書かずに動的なページを簡単に作成できるライブラリのことです。 htmx is a library that allows you to access modern browser features directly from HTML, rather than using javascript. （訳）htmx は、JavaScript を使用するのではなく、HTML から最新のブラウザー機能に直接アクセスできるようにするライブラリです。 </> htmx ~ Documentation ...と言っても、これだけだとよく分からないですよね。なので、実際に手を動かしながら学べるよう、解説していきます。 準備 まず、HTMX を動かす環境
Claude Codeを20万円分使ってバイブコーディングの生産性を更に向上させるツールを作った
バイブコーディングの効率化でGit worktreeが話題になっていたけど、コマンドの実行や管理が大変そうだったので、まずは効率化するツールを作りたいと思いました。いつもならシェルスクリプトとかエイリアスで済ませるところですが、バイブコーディングでOSSとして作ってみたら面白そうと思い、この1週間集中して開発しました。 結果、Git worktreeの管理を効率化するCLIツールをリリースすることができました。途中からはドッグフーディングで自らの生産性も向上させて、Claude Codeを20万円分以上使いましたがCLIツールとしてかなりクオリティの高いものを短期間で作ることができました。 作ったツール PhantomというCLIツールを作りました。Git worktreeを簡単に管理できるツールで、docker execみたいにワークツリーの中でコマンドを実行する機能があったり、tmux
AI時代にこそTDDだと思う話
GitHub Copilot、みなさん使ってますか？すでに多くの方が利用しており、「ないと困る」という方から「提案の質に問題がある」「まだまだ使えない」という方まで、様々な意見を聞きます。 筆者はGitHub Copilotに対して非常にポイティブな立場です。GitHub Copilotは使い方次第で開発速度を格段に向上させることを身をもって体験しており、これからの時代においてはGitHub CopilotなどのAIツールを使いこなせるかどうかで、個人の開発速度に非常に大きな差が出ると考えています。 重要なのは使い方次第と言う点です。前述のように様々な感想が溢れているのはAIツールの習熟度が大きく影響しているようにも感じます。AIツールは静的解析同様、利用者側の手腕が大きく問われるツールであると筆者は感じています。コマンドプロンプトエンジニアリングという言葉もあるように、AIツールを使いこ
100秒で理解するPromise
そもそも非同期処理とは？ Promiseについて知るためには、まず非同期処理について知っておく必要があります。 以下の動画で、非同期処理について100秒で解説しているので、そもそも非同期処理をよく知らないなぁという人はぜひ確認してみてください！ Promiseとは では、本題です。 Promiseとは、ES2015で導入された、非同期処理の状態や結果を表現するオブジェクトのことです。 PromiseはES2015で導入された非同期処理の状態や結果を表現するビルトインオブジェクトです。 非同期処理はPromiseのインスタンスを返し、そのPromiseインスタンスには状態変化をした際に呼び出されるコールバック関数を登録できます。 jsprimer - 非同期処理:Promise/Async Function 例えば、出前アプリでピザを注文することをイメージしてみましょう。 ピザを注文すると、
チーム開発を加速するテストの育て方
テストを書いてないというチームには色々理由があると思いますが、「何をテストすべきかわからない」「書き方がわからない」「どのくらいメリットがあるかわからない」という意見は多いのではないでしょうか？テスティングフレームワークの選定や使い方を学ぶのは重要ですが、それ以上にテストの目的や戦略を学ぶことが重要です。チーム開発においてテストを活かすのは相応の知識とスキルが必要になりますが、活かせればテストは開発スピードを維持・促進する飛び道具になり得ます。 本稿は筆者が取り組んで実際に高いチーム満足度と速度を得られた、テスト戦略についてまとめたものです。
音声認識AIのWhisperをUnreal Engineでリアルタイムに動かすためにやったこと
「Unreal Engine (UE) Advent Calendar 2022 その3」23日目の記事です。 はじめに OpenAIの音声認識AI「Whisper」がすごいらしい。これをUnreal Engineでリアルタイムに動かせるようにしたら応用範囲が広がっておもしろいんじゃないかと思いました。 （「異議あり！」って実際に声に出させたいよね） （NLPアドベンチャーを音声入力で、みたいな夢も広がる） しかし、いざやってみたらいろいろな課題にぶつかりました。この記事は、それらをどう解決したかの記録です。 目次 目標設定：C++とONNX Runtimeで実装する Whisperの処理の全体感 課題と対応 課題1：マイク入力と前処理をC++で実装する 課題2：Whisperの機械学習モデルをONNXにエクスポートする 課題3：ONNXモデルをtransformer＆FP16向けに最適化
VSCode の ESLint 拡張が Svelte を認識するようにする
検索しても検索しても前例があまりないので、書いておく。 結論から言うと VSCode の設定検索で eslint.valitate と eslint.probe を検索して、それに svelte を書き足せば終わりだと思う。以下のような。 { "eslint.probe": [ ..., "svelte" ], "eslint.validate": [ "svelte" ] } よくわからなかったら、プロジェクトルートに .vscode/ を作って、その下に settings.json(つまり /.vscode/settings.json)にこれを書き足せば多分動く。 もう終わったので、以下はストレス発散 ESLint は設定ファイルの種類が馬鹿みたいに多いことで有名な Linter である。以下すべてが認識対象である。 .eslintrc.js .eslintrc.cjs .eslint
ブラウザレンダリングの仕組み
Webの用語を100秒で解説するチャンネルを作りました！ よかったらチェックしてみてください！ はじめに 以前書いた記事「Webページがブラウザに表示されるまでに何が起こるのか？」で ブラウザレンダリングについて詳細に知りたいという意見をいただいたので、調べてまとめてみました。 全体図 レンダリングの大まかな流れです。 HTMLのダウンロード サーバから送られてきたHTMLをダウンロードします。 HTMLの解析 サーバから送られてきたHTMLファイルは、「0」と「1」でできたデータになっています。 ブラウザは、サーバから受け取ったデータをそのままHTMLとして解釈することはできないので、自分で扱うことができる形、つまりDOMに変換する必要があります。この作業を 解析 ( Parse ) と言います。 HTMLをダウンロードしたら、すぐにこの解析作業に入ります。作業は以下のようなステップにな
Webページがブラウザに表示されるまでに何が起こるのか？
## # Host Database # # localhost is used to configure the loopback interface # when the system is booting. Do not change this entry. ## 127.0.0.1 localhost 上記で「127.0.0.1 localhost」とあるように、[IPアドレス] [ホスト名]というフォーマットで書かれます。 HOSTS.TXTが使われていた当時 ( 1970年代 ) では、わずか数百台のホストしかなかったので、ネット上の全てのホスト情報の記載が可能でした。 しかし、インターネットが普及していくにつれてHOSTS.TXTは肥大化していき、1983年には、ホスト数はおよそ数万台になりました。もはやHOSTS.TXTによる名前解決は不可能となったので、現在のようなDNS
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
