20260117_LTを強化しようLT#1

「新しいタブ」再定義 shu

自己紹介 名前：shu 年次：社会人3年目 興味：サイバーセキュリティ、AWS 普段：自社サービスの運用改善みたいなこと

皆さんご存じの「新しいタブ」 ブラウザ開いたら表示されるやつ。 好きなページを開いてくれるようにも設定できますね。 でも案外こんな状態じゃないですか？

特筆することが何もないですね。 ひろーいスペース…… ぽつんと置かれた、あんまり使わない検索窓（主観）

「新しいタブ」、何かできないかな？ ブラウザ開いたら表示されるやつ。 せっかく頻繁に目に入る場所なんだから、うまく活用したい！ どこかのWebページを常に開いてくれるようにしてもいいけど、もっといい活用はないか…

11:13:30 ←時計 ボタン↓ yyyymmdd yyyy/mm/dd 2026/01/16(金) リンク集 あった ToDoリスト

やったこと：Chrome拡張機能自作 バイブコーディングでChrome拡張機能を作る、以上。 拡張機能に必須のファイルは3つなのでエージェントじゃなくて対話形式でも十分作ることができる。 （作ったのがちょっと前且つデータが今は手元にないので、プロンプトは後日追記しておきます…） → まとめのあとに追記しておきました！（記憶と全然違うプロンプト投げてました、すいません）

自作すると嬉しいこと 自分の好きな機能要件・非機能要件をいくつも盛り込める。 ・UIはダークモードかつアクセントカラーは好きな青紫色 ・秒表示のある時計と、日付をコピーできるボタンのセット ・タスクを一覧でみれる、かつ簡単な進行管理（未着手・着手・完了）もできるToDoリスト ・ブックマークバーには入れたくないけど、思い立ったらさっと開きたいリンクまとめ 業務用端末など制限のある環境でも使える。

まとめ 「新しいタブ」を「自分だけのポータルサイト」にして、活用してみませんか？ まずはそこのChatGPTやGeminiに相談してみましょう！

以降追記

プロンプトの話 今回は対話形式で要件をかためたあとに、コードを出してもらいました。 一番最初に投げたプロンプト(原文ママ) 「ブラウザを開いたときに新しいタブではなく、指定のHTMLページを開きたくて、そのHTMLページを使い 勝手がいいようにカスタマイズしたいから、要件定義を手伝ってください。」 すると、結構な量の質問を返してくれたので、それに答えながら要件をかためました。

プロンプトの話 2往復くらいやりとりすると、コードを出したそうにしてくるので一旦それは止めます。深い理由はなく、要件 の修正を重ねるときにやり取りが長文になって煩わしいからです。プロンプトは簡潔に投げました。 「コード提示はこちらがお願いするまでしないでください。」 ある程度いい感じになったなと思ったタイミングでこれを投げてフィニッシュです。 「拡張とページの最小実装コードをください。作成する必要があるファイルごとにわけて、コードブロックで囲 んで出力してください。」

最終的なフォルダ構成 /（拡張フォルダ） manifest.json newtab.html css/ base.css layout.css components.css js/ app.js todo.js favicon.js assets/ icons/ placeholder.svg delete.svg plus.svg 思ったより量書いてもらってて おもしろいですね(?) コードはもうちょっと機能改良の余地があるので それが解決したらどこかに…？