ハクソク

世界を動かす技術を、日本語で。

ウェブ開発が再び楽しくなった

概要

  • かつてのWeb開発はシンプルだったという懐古
  • 現代のWeb開発は複雑化し、一人で全てを管理するのが困難に
  • AIツールの登場で再び全体を扱える感覚を取り戻す
  • 生産性の向上と創造性の回復についての実感
  • AIによるWeb開発の楽しさの再発見

シンプルだった時代のWeb開発

  • PHP 4全盛期、jQuery登場初期の新鮮さ
  • テーブルレイアウト主流、div未普及
  • Dreamweaver活用による効率化感
  • Photoshopでのデザインスライスによるワークフロー
  • phpMyAdmin管理のデータベース
  • 開発サイクルの全体像が頭に入る規模感
  • 一人開発者としてアイデアから実装まで一貫管理可能
  • 過去の美化という自覚を持ちながらも、当時のシンプルさを実感

現代Web開発の複雑化

  • フロントエンドにおけるビルドパイプライン・バンドラー・CSSフレームワーク
    • PWA、Core Web Vitals、SEO、レイアウトシフト、レスポンシブ画像対応
    • IE6互換性が最大の課題だった時代との対比
  • バックエンドにおける設計パターン・ユニットテスト・API・パフォーマンス
    • 依存管理、インフラ、監視、ログトレース、オブザーバビリティ
  • 各分野の専門性の深化と、より深いドメイン知識の必要性
  • バックエンド・サーバインフラ特化へのシフト
  • フロントエンドの進化に追いつけず、全体管理の難しさを痛感

AIによる生産性の回復

  • **AIツール(Claude, Codexなど)**の登場
  • 個人開発者として再び全スタックを扱える自信
  • アイデアから実装までのスピードが大幅向上
  • 各分野の複雑さがAIによって大幅に軽減
  • 生産性10倍の体感

経験とAIの融合による品質担保

  • 過去の経験(多様な職種・人材との協働)をAI活用に生かす
  • コーディング標準・トーン・手法をAIで再現
  • AI生成コードの良し悪しを見極めてブラッシュアップ可能
  • プロジェクト開始のハードル低減、現実的な実現性の向上
  • 目標は変わらず、現代基準を満たす高品質ソフトウェア構築

創造性と楽しさの復活

  • AIによる雑務・煩雑さの軽減で創造的思考の余裕
  • UI/UXの実験や新しいアイデア試行の機会増加
  • 生活向上系の細かな改善にも時間を割けるように
  • コーディング自体よりも、ゼロから何かを作る楽しさの再発見
  • AIと最新ツールによる時間短縮と、Web開発の楽しさの復活

Hackerたちの意見

変な新しいLLM支援の世界で好きなところは、管理職になったり親になったりして、プログラミングをやめてしまった人たちがまたコーディングを始めていることだね。AIの助けがあれば、30分で役立つものが作れるし、他のことをしながらでもできるから、2〜4時間も時間を取らなくて済む。以前にかなりのコーディング経験があれば、たとえ数年ブランクがあっても、これらのことをすごく効果的に進められるよ。特に管理経験があれば、コーディングエージェントを「管理」するのにも役立つしね(明確にコミュニケーションをとる、達成可能な目標を設定する、関連するコンテキストを提供する)。
そうそう!自分も見たことあるよ、何年も何十年も開発から離れていた人たちが戻ってきてる。
まさに自分の経験そのものだわ。特に親としての個人的なプロジェクトの時間がね。今は子供を寝かせた後に、もっと早く動けるから、数日ごとに1〜2時間しかないけど、また楽しんでいじれるようになった。
プログラミングに飽き飽きしてたけど、今はAIがコードを書いてくれるから、楽しいことに集中できるようになった。どうやって動くのかを理解したり、デバイスハッキングやホームプロジェクトをしたりするのが楽しい。
自分の経験にも合ってる。最近のエピソードだけど、4年前に個人的な欲求を満たすためにObsidianのプラグインを書いたことがある。すぐに詳細を忘れちゃって、ObsidianのプラグインAPIやエコシステムもその後変わったし、Typescriptも普段使ってない。以来、新しいプラグインのアイデアを集めてたけど、実装するための時間を取るのが億劫だった。最近の冬休みにClaudeを使って、2つの新しいプラグインと4年前の古いものの改善を作った。Claudeが過去に自分を悩ませていた複雑さをかなり軽減してくれたんだ—使うべきAPIメソッドを提案してくれたり、イディオマティックなTSを書いてくれたり、リンターの指摘に対応してくれたり。
ちょっと恥ずかしいけど、ページ上でdivを中央に配置するのがまだ苦手なんだ。フレックスボックスについては10年以上知ってるけど、やり方を思い出すために毎回検索しちゃう。だから、あまり使わない知識を復習する代わりに、AIにやってもらうことにしてる。このことがMDNドキュメントを検索するのとどう違うかは、また別の話だね。
俺、AIにはめっちゃ反対だったんだ(主に仕事を奪われるのが怖かったから)。でも、サイドプロジェクトをやったら、数週間かかるはずのことがたった2日でできちゃった。もうデプロイもしたし、今はお客さんを待ってる状態。正直、プロセスにハマっちゃったよ。昨日、妻に愚痴ったんだ。「今の唯一の問題は、サーバー代を払うための時間とお金が足りないことだ」って。新しいアイデアを開発してデプロイするチャンスが広がったからね。
> AIのサポートがあれば、30分で何か有用なものができるし、他のことをしながらでもできる。もう2~4時間もかけて準備する必要はない。それは、俺が作ったChrome拡張機能の経験とも合ってる。ドキュメントを読んだり、サンプルプロジェクトを探したりする代わりに、1時間もかからずに動くバージョンを作れたんだ。
よくわからないけど、これってプログラミングの楽しさの真逆な気がする。趣味でコーディングする時に、生産性の目標なんていらないよ。30分の時間を最大限に活用しなきゃって、そんなの楽しくないもん。30分あれば、ちょっといじって楽しむ。それが終わったら、また30分できる時に続けるんだ。(あるいは、やめられなくて夜遅くまでやっちゃうこともあるけど。)
うん、前はマネージャーだったし、今は小さな家族がいるから、自分でもこれを見たことあるよ。週の中で2〜4時間だけ確保しても、サイドプロジェクトで信じられないほどの進展ができるようになった。ここには、サイドプロジェクトが増えて「もし時間があったら」っていうプロジェクトが実現するっていうジェボンズの逆説があるといいな。
AIのいいところは、数日ごとに現れる小さなライブラリを全部知ってることだよね。もうこの手のことを学ぶ心配しなくていいし、何かに使うライブラリをAIに聞けば、依存関係を出してくれてサンプルコードもくれる。リアルなアルゴリズムを書くためのAIはあんまり好きじゃないけど、最近まで追いかけなきゃいけなかった無数のライブラリを気にしなくていいのはすごくいいと思う。
あの頃を思い出すと楽しかったけど、今はLAMPスタックを動かすのに何も止めるものはないよ。フレームワークなしでPHPを書いたり、手動のSQLクエリを使ったりするのも全然楽しい。今のモダンPHPは最高だし、MariaDBはMySQLそのものだし(Postgresに切り替えるのもそんなに難しくない)。コードのインジェクションを防ぐのもずっと簡単だよ。Photoshopでデザインを切り取るなら(ええ、昔のオリジナルはFireworksを使ってたけど)、Dreamweaverを使ってもいいよ。とはいえ、HTML5のおかげでレイアウトにテーブルを使わなくて済むし、VS CodeにはDreamweaverの良い部分が全部入ってるから(信じて、WYSIWYGは必要ないし、使いたいなら要素を検査して変更をHTMLファイルに移すだけでいい)。要するに、今のソロ開発者にとってウェブ開発はシンプルになったってこと。もっと複雑なツールもあるけど、楽しむためにソロ開発をするなら、スキップしちゃえ!追記:phpMyAdminは使うのが楽しかったけど、ボックスを壊すのには最適な方法だった。今はDBeaverみたいなツールが自分にはぴったり。
フロントエンドでは、ビルドパイプライン、バンドラー、独自のツールチェーンを持つCSSフレームワーク、プログレッシブウェブアプリ、Core Web Vitals、SEO、レイアウトシフト、srcset/レスポンシブ画像… 自分もMattiasと同じくらいの期間ウェブ制作をしてきた感じだ。最初はPerlから始めて、すぐにPHP 4に移った。これらの問題は認識してるけど、自分は違った見方をしてる。20年前にはすでにその複雑さはあったけど、無視してたんだ。それはシンプルだったわけじゃなくて、ただリスクを取ってたってこと。今みたいなビルドパイプラインはなかったけど、物を作るためのスクリプトはあった。新しいバージョンをデプロイする前に、Adobe Pagemillを使ってサイト全体の変更を行ってた。昔は変更を加えて、ローカルで簡単に動作確認してから、手動でFTPでファイルをサーバーにアップしてたけど、その過程で壊れることもあった。ユーザーがナビゲートしている間にサイトが変わるのを見てしまうからね。メンテナンスページを表示して、トラフィックをブロックすることもあった。確かにそれは「シンプル」だけど、ユーザーにとってはずっと悪かったし、データを扱うサイトではユーザーの記録を壊すリスクもあった。もっと壊れることがなかったのが不思議だった。もしかしたら壊れてたけど、気づかなかったのかも。CSSフレームワークはなかったけど、自社のテンプレートはあったし、それには独自のツールチェーンがあった。時間が経つにつれて、そのツールチェーンは主にWordpressとそのテンプレートビルダープラグインに移行した。だから、あの混乱よりもTailwindがいい。Core Web VitalsやSEOはUrchin Statsの形で存在してたし、レイアウトシフトはFOUCと呼ばれてた。srcsetもあったけど、Macromedia Dreamweaverのmm_ JS画像プリロードとスワッピング関数のセットとして実装されてた。今はずっと良くなった。ウェブソフトウェアを書くのはすごく楽しい。自分もコードにLLMを活用してるけど、簡素化のためじゃなくて、単にそれが素晴らしいから。複雑さが新しいわけじゃないと思う。ただ、今はそれが見えるようになっただけ。
> いろいろ洗練させたり、やり取りを重ねても、俺は簡単に10倍以上生産的になってる。開発者はAIの生産性向上を過大評価することが多いけど、プロンプトを出すたびにギャンブルみたいなもんだから、AIの出力がうまくいくことを期待してる。開発者が実際には生産性が下がってるなんて、驚くよ。
ちょっと個人的なデータポイントなんだけど、君は開発者なの?AI使ってる?
生産性向上は認めるけど、「10倍」って言われるとちょっと信じがたいな。もう飽き飽きするフレーズだし。2.5倍のエンジニアっていう謙虚さはないのかな?
数字は、あなたが「もっと生産的だ」と感じるなら関係ないよ。AIがなかったら始めるのが面倒だった小さなプロジェクトを、今はたくさん始めて終わらせられるようになったから。無限に生産的? でも、AIが生成したものが気に入らなくて新しいチャットを始めるのに時間を無駄にしたこともあるけどね。
> 開発者が実際には生産性が下がっていないなら、驚くと思うよ。10倍ってすごい数字だし、実際にはもっと小さいだろうね—1.5倍くらいが妥当かも。でも本当に? 1.0倍を超えたら驚くの? こういうコメントは、すごく子供っぽくて失礼に感じるんだ。AIを使うことで開発者が実際に遅くなっているなんて言うけど、あなた以外は誰も気づいていないみたいな。
ユーザー名がそのままだね。
何をやってるかによると思う。ClaudeにRust/Reactアプリのフロントエンドを書かせたことがあるけど、10倍以上の効果があったよ(やろうとも思わなかったから)。低レベルのクレートのドキュメントも書かせたけど、これはクレートを効果的に使うために必要な作業で、正直言って適当にやってたかも。誰がドキュメントを書くのが好きなんだよ?最近は非同期Rustを書くのに使ってるけど、全然うまくいかない。select!のドロップ問題を頻繁にコードに入れたり、複数のことを待つのを全く処理できなかったりする。最近は結構口汚くなってきたよ。多分1倍かそれ以下だね。でも、パターンを作って例を入れてみようと思ってる。これは克服すべき問題だと思ってるから、乗り越えられない失敗じゃない。AIがうまくいかないところもあるかもしれないけど、他のところでやってる巧妙なトリックを書くのは信頼できないな。でも、そこでも(ほとんどの)テストやドキュメントは書いてくれる。全体的に、AIと一緒にいる方がずっと楽しいし、平均して2倍は生産性が上がってると思う。もしかしたら、ローカルな(すごく悪い)最大値にハマってるかもしれない。そういうのは確かにあるから、いくつかサイドプロジェクトを試してみて。トレーニングセットにたくさんの既存の例があるものがいいよ。もしF1チームを始めたかったら、車のデザインを知る必要があるけど、トラックに車を運ぶための物流もたくさんあって、AIがそれを処理してくれるかもしれない。AIができるつまらないけど重要な作業を見つけてみて。私の経験上、それが90%の仕事だから。
> フロントエンドでは、ビルドパイプライン、バンドラー、独自のツールチェーンを持つCSSフレームワーク、プログレッシブウェブアプリ、コアウェブバイタル、SEO、レイアウトシフト、srcset/レスポンシブ画像… 俺が一番苦労してたのはIE6の互換性だったのを覚えてる。これらのものは、使いたいと思わなければ持ってないよ。俺は25年間ウェブサイトを作ってきたけど、今も始めた頃と同じコア技術を使ってる。確かに、言語自体の現代的な改善は利用してるけど、「ホットな新トレンド」を永遠に取り入れたことはないし、そのおかげで自分はより良い、少なくともまともだと思ってる。いや、君のマーケティングやeコマースのウェブサイトには、ほぼ確実にJSバンドリングツールチェーンは必要ないし、CSSプリプロセッサやCSSボイラープレート/フレームワークも必要ない。エンタープライズクラスのPHPフレームワークや依存関係マネージャー、CI/CDパイプラインもほぼ確実に必要ないよ。
何を使ってるの?聞いてもいい?
これを何度も見るのはめっちゃ変だね。大規模なウェブプロジェクトを書いたことがないんじゃない? 同意できるのは、PHPやサーバーサイドレンダリングは一般的には必要ないってことだけだね。
その技術は単に技術的な問題を解決するだけじゃなくて、組織的な問題も解決するんだよ。もし一人か二人でウェブサイトを管理しているなら、特別なツールなしでも全然大丈夫。でも、1000人が複雑なビジネスロジックを持つ製品を複数のプラットフォームで管理するとなると、みんなが合理的な生産性で働けるようにするために、特別なツールが必要だよ。
AIが書いたものを読むのが嫌なだけじゃなくて、AIを褒めるものを読むのも嫌だって気づいた。みんな同じこと言ってるし、ただ退屈なんだよね。
私の問題は、コードレビューが仕事の中で一番楽しくない部分だってこと。純粋に苦痛で、精神的にも疲れる。バイブコーディングしてない限り、今はたくさんのコードレビューをしなきゃいけない。高レベルの計画や指導(これは楽しいけど)以外はほとんどそれだけ。セキュリティの境界やデータ漏洩や無効なアクセスに影響を与える可能性のある部分をレビューすることにしてる。それ以外はほとんどスキャンするだけ。たまに、n+1クエリやミューテーション、グローバルな可変変数みたいなバカなことを見つけるけど、ほとんどは十分にうまくいってるから、あまり徹底的には見ないかな。でも、AIエージェントなしでこれらのコードベースを引き継ぎたくはないね。人間のメンテナンスでは考慮できないほどの壊れた窓が多すぎる。
ソロ開発者としては、PHP 4の時代のようにプログラムできるよ。PHPとウェブプラットフォームはほとんど後方互換性があって、セキュリティに役立つ新機能がたくさんあるし、ほとんど悪いものは廃止されたり削除されたりしてる(リクエストから自動的に設定される変数は使わない方がいいし、SQLインジェクションを避けるためにマジッククオートに頼るのもやめた方がいい)。フレームワークやパイプライン、複雑さは必要ない。選択肢は自分次第で、楽しい方を選べばいい。2005年のようにPHPとHTMLを混ぜて書いても大丈夫。誰も死なないし、今でも動くよ。もちろん、コードをテストしないとリグレッションを引き起こしたり、壊れた機能を出荷したりするリスクがあるけど、それは昔からそうだった。メンテナンスしにくいゴチャゴチャしたものを書くことも昔からあったしね。AIは必要ない。昔のように楽しかったプログラミングをして、楽しめばいい。もちろん、フレームワークが好きならそれを使えばいいけど、全体的なFizzBuzzエンタープライズアーキテクチャをやる必要はないよ。自分や未来の自分を楽しめない無駄なAIの複雑さで苦しめないで。自分に何をしてるんだろう?ただ昔ながらのPHP、HTML、CSS、そして好きな新しい部分のJavaScriptを書けばいい。私もそうしてる。今でも前と同じように動くよ、たぶんblinkタグを除いてはね。途中で身につけた良い習慣、例えばクリーンなコードを書くことやテストすることを取り入れればいい。新しい良い機能を活用して、悪い古い習慣を避ければ大丈夫。いいところは、10年後もそのまま動く可能性が高いし、消えた古い依存関係や発見された脆弱性に依存しないし、再現が難しいセットアップにも頼らないし、AIに直してもらったり、何が起こってるのか説明してもらったりする必要もない。役に立たないならパイプラインは本当に必要ない。コミットする前やプッシュする前、リリースする前にテストを実行すればいい。『AIは必要ない、昔ながらの手作りのものでも大丈夫』って本を書こうかな。
ここに合いそうな関連質問があるから試してみるね:シンプルなウェブサイトをAIでコーディングするのに、絶対に安く始める方法は?いくつか試したいアイデアがあって、頭の中からウェブに出したいんだけど、ウェブ開発の知識が2004年で止まってるから、何年もそれを変えようとは思ってなかった。これらは複雑なことじゃない(全部静的だと思う)けど…ウェブ開発が嫌いなんだ。初期の探索にお金を払うつもりはあまりないけど、もしうまくいきそうなら、もちろん払うよ。ローカルで動かせるそこそこ強力なマシンがあるけど、Windowsなんだ(残念ながら私はEEだから)、これが重要なんだよね。
Google Geminiは、かなり寛大な無料プランがあるよ。AI Studioで実験を始めるのがいいかも - https://aistudio.google.com/ - それから、彼らのGemini CLIやAntigravityツールを使ってエージェントをコーディングしてみて。君が言ってることには、ClaudeやChatGPTのウェブアプリの無料プランでも十分だと思う。
Cloudflareには、静的なウェブページだけが必要なら、ほぼゼロコストのホスティングサービスがあるよ。
Hacker Newsがもっと小さく感じた頃を覚えてる。スレッドは短かったし、コンテキストも頭に入ってた。リンクされた記事を読んで、コメントをざっと見て、前提知識がないままでも気軽に参加できた。あの時は特別だとは思わなかったけど、振り返るとシンプルだった。会話のスペース全体が管理しやすかった。考えがあれば、はっきりと表現して「返信」を押せば、理解してもらえると思えた。単独のコメント者として、全体の議論を頭の中に持っていられた。記事から議論、結論まで。少なくとも、そんな感じだった。多分、私はそれを美化してるけど、言いたいことはわかる。複雑さが私の追跡能力を超えてしまった。今はHacker Newsでうまくコメントするのが難しい。記事は密度が高くなってるし、ドメインも深くなってる。スレッドはすぐに分裂する。誰かが論文を引用し、別の誰かが反論の論文をリンクし、さらに別の人が数十年前のメーリングリストの投稿を参照して、突然議論が数年分の背景知識を前提にすることになる。最新の技術、歴史的な文脈、一般的な反論、専門用語、そして暗黙のルールを知っていることが求められる一方で、簡潔で、寛大で、オリジナルであることも求められる。どの分野も成熟してきた—おそらく良い方向に—but、恥をかかずに参加するためにはより深い専門知識が必要になった。時間が経つにつれて、私は本当に興味があるスレッドから退いてしまった。何も言うことがなかったわけじゃなくて、認知負荷が高すぎたから。ソロで考える者として、ついていくのが難しくなった。競争の場を平等にするために、AIが登場した。完璧ではないけど、ClaudeやChatGPTのようなツールは、長い間感じていなかったものを与えてくれた:レバレッジ。今ではすぐに、長い記事を要約したり、過去の作品を思い出したり、意見が naïve かどうかを確認したり、自分の考えを投稿する前に明確にしたりできる。突然、背景の複雑さはあまり重要でなくなる。数分で「未完成の直感」から「一貫したコメント」に移行できるし、タブを完全に放棄することもなくなる。以前はスキップしていた会話に再参加できる。パターン認識「おお、思考を外注してる—全部ダメだろ!」って思うかもしれないけど、私は何千もの素晴らしいHNコメントを読んできた。思慮深いもの、慎重なもの。いつ引き下がるべきか、いつ引用すべきか、いつ黙るべきかを知っている人たち。そのパターンは今、私の頭の中にある。AIを使えば、その経験に頼れる。トーンをチェックできるし、「これは公平か?」や「何を見落としてる?」と聞ける。議論を他人に押し付ける前にストレステストできる。AIが間違ったことを提案したら、それが間違っているとわかる。良い提案があれば、その理由も認識できる。反復は早い。行き来の洗練があっても、自分がすでに考えていることを表現するのが劇的に効果的になる。目標は変わってない:議論に役立つ何かを貢献すること。ハードルはまだ高い。でも今は、垂直の壁ではなく、はしごがある。好奇心の余地がある。再び好奇心のための精神的なスペースができた。頭の中が「コンテキストを見逃したか?」「これは知られている悪い意見か?」「これがペダンティックに脱線するか?」で常にオーバーロードされているわけではない。AIにそのチェックを任せて、アイデアに集中できる。それが探求の余地を残してくれる。より良い質問をするために。アイデアをつなげるコメントを書くために、すべての文を防御的にヘッジするのではなく。再び公の場で考える楽しみのために参加するために。コメントを早く打つことや、議論に勝つこと、カルマを稼ぐことが目的ではなかった。興味深い人々と興味深い問題に関わることが目的だった。書くことはただのインターフェースだった。そして今日のツールを使えば、そのインターフェースはやっと軽くなった。AIは本当にHacker Newsでのコメントを再び楽しくしてくれた。