ホームClaude Code Navi › Claude Codeで「実際に作ってみた系まとめ」──HP制作・データ収集・WSL2環境構築まで、実践者の生々しい記録
📰 キュレーション記事 初心者

Claude Codeで「実際に作ってみた系まとめ」──HP制作・データ収集・WSL2環境構築まで、実践者の生々しい記録

🎓 生成AI活用の勉強会・無料相談・最新情報をお届けします

オンライン勉強会の案内や、無料相談、ChatGPT・Claude活用の具体例をメールでお届けします。登録は無料、いつでも解除できます。

generative-ai.co.jp 編集部

Claude Codeの話題が盛り上がる中、「実際に何ができるのか?」という疑問を持つ方も多いはず。今回は、Zenn・Qiitaに投稿された記事の中から、「作ってみた」「やってみた」系の実践記録に注目しました。自社HPのリニューアル、PM業務のAI化設計、そしてWSL2を知らずに2ヶ月使い続けたという驚きのエピソードまで。リアルな成功と失敗が詰まった記事を厳選してご紹介します。

Claude Codeで実際にホームページを作り直してみた

まずは、もっとも分かりやすい「実際に作った」事例から。GWの空き時間を使って、自社HPをClaude Codeでリニューアルしたという記事です。

K
kameda05
Qiita
放置されていた自社ホームページのデザイン変更とコンテンツ更新を、AIコーディングエージェント「Claude Code」を使って実施。実際の作業プロセスと、コーディングにAIを活用した際の具体的な手応えを記録した実践レポートです。

元記事を読む →

非エンジニアにとって「HPをAIで作る」というのは夢のような話ですが、この記事からは実際のハードルや工夫が見えてきます。「GWの空き時間」というリアルな時間感覚も参考になるはず。

AIに仕事を任せる前に「データ設計」をした話

次は、もう少し戦略的なアプローチ。PM業務をAIに任せたいという目標のもと、まず「何を記録すべきか」を設計した記事です。

U
umtt
Qiita
PM業務をAIに委譲するための第一歩として、「自分の意思決定を再現できるデータ」を集める設計を実施。思考の入力・中間・出力を網羅するために4種類のデータソースを選定し、その限界についても率直に語っています。

元記事を読む →

「AIに任せる」前に「自分の仕事を可視化する」というステップが不可欠。この記事は、ビジネスパーソンがAIを業務に組み込む際の思考プロセスとして非常に参考になります。

WSL2を知らずに2ヶ月使ってた──初心者の正直な記録

最後は、技術的な「知らなかった」を正直に語った記事。Claude Codeを2ヶ月使い続けて、ようやくWSL2の存在に気づいたという体験談です。

K
kitepon
Zenn
Claude MAXを契約して毎日コーディングに活用していたものの、WSL2の存在を知らないまま2ヶ月が経過。後から「機能を半分も知らなかった」と気づいた初心者ならではのエピソードを率直に綴っています。

元記事を読む →

「知らなくても使える」のがClaude Codeの良さでもありますが、知っていればもっと便利に使えたという後悔も。この正直さが、これから始める人にとって最高の道しるべになります。

番外編:AIにUIを作らせる前に「動くリファレンス」を用意する

実装を始める前の準備について、実践的なアドバイスを書いた記事もピックアップしました。

S
sayurl
Zenn
Claude CodeやCodexを使えばUI実装は速くなるが、「コードとしては動くけど体験としては違う」というズレが起きる。そのズレを防ぐために、AIに指示を出す前に「動くリファレンス」を作るという実践的なTipsを紹介。

元記事を読む →

AIは「言われた通り」には作れても、「求めている体験」を察するのは苦手。この記事は、AIとの協働で成果を出すための実践知が詰まっています。

この記事で学べること

1

Claude Codeで「実際に何ができるか」のリアルな事例

自社HPのリニューアルやPM業務のデータ設計など、具体的な成果物と作業プロセスが見える実践記録から、Claude Codeの実力と限界が分かります。

2

初心者がつまずくポイントと、その乗り越え方

WSL2を知らずに使い続けた話や、AIに指示を出す前の準備の重要性など、「知らなかった」を正直に語った記事から、事前に知っておくべきポイントが学べます。

3

AIを業務に組み込むための「設計思考」

AIに任せる前に「自分の仕事を可視化」し、「データを設計」するというステップ。ビジネスパーソンがAIを実務に活かすための思考プロセスが具体的に分かります。