つまづきながらも、Claude Codeを学ぶための開発環境を整えてみた


こんにちは! エムシーです!
今日学んだのは、開発の道具をそろえる話でした。並べるだけなら簡単だと思っていたのです。
ところが僕は、道具を入れる前の設定でつまずきました。止めてきたのは、パソコンを守るためのソフト「ウイルスバスター」です。
パソコンに自信がない方や、プログラミングを始めたばかりの方に読んでほしい話です。
(※この記事は、僕のMacでの体験談です。画面や結果は、人によって違う場合があります)
道具は4つでセットだった
教材では、開発には4つの道具をセットで使うと紹介されていました。4つも要るのか、とため息が出ましたが・・・
・VS Code(ブイエス・コード)
・ターミナル(VS Codeの中でも開けますが、教材では別の道具として数えていました)
・Claude Code(クロード・コード)
・Node.js(ノード・ジェイエス)
Claude Codeは「AI助手」で、Node.jsは「実行エンジン」とたとえられていました。
Node.jsはJavaScript(ジャバスクリプト)をブラウザの外で動かすための土台だそうです。
ブラウザの外で動かす? なんだか今一つよく分からないままで操作を進めました。
新しい専門用語が次々と出てきます。予習の時のような余裕は、もはやなくなってきました。
Node.jsはLTS(エルティーエス:長期サポート版)を選ぶと安全だと書いてありました。新しいほど良いと思っていた僕には、意外な話です。
僕のMac(マック)ではHomebrew(ホームブリュー)を使って入れました。
Claude Codeが全てやってくれたので、自分で操作したという実感がないのですが・・・
node -v(ノード・ブイ)と npm -v(エヌピーエム・ブイ)でバージョン番号が出れば成功だと知りました。数字が出ただけで、なんだか嬉しかったです。
何が何だか分からない感じのまま、Claude Codeの力 だけで何とかクリアはできました。
名前だけでは 意味も分からない道具たち
拡張機能は発行元(パブリッシャー)を必ず確かめると書いてありました。偽物もあるのか、と思うと少し怖くもなりました。
ESLint(イーエスリント)とPrettier(プリティア)という拡張機能も入れました。
ESLintは、コードの書き間違いを見つけて教えてくれる道具です。Prettierは、コードの見た目を自動できれいに整えてくれる道具らしいです。
GitHub CLI(ギットハブ・シーエルアイ)も入れました。ターミナルからGitHubを操作するための道具だそうです。
正直、最初は中身も分からないまま、言われた順にClaude Codeが次々と揃えてくれました。
Time Machine(タイム・マシーン)のバックアップが動いているかも確かめました。戻せる復元先があると、何をするにも少し安心なので・・・
音声入力は便利だが 誤変換が問題
Macの音声入力(🌐キー)を、VS CodeとClaude Codeで使えるようにしました。
ついでに Air Pods(エアポッズ)のマイクに自動で切り替わる設定もしました。
打つより話すほうが早いので、まるで直接AIと会話している感覚です。
ただ、僕の滑舌や発音のせいか、誤字脱字の変換がたくさんありました。確かに早さに関しては魅力的ですが、毎回中身の見直しは必要でした。
行く手を阻まれ、少しエラーにも慣れました
思わぬところでつまずきました。ウイルスバスターのフォルダシールドの設定です。守ってくれるはずのものに阻まれました。(まあ、セキュリティソフトは、それが仕事なのですが)
ウイルスバスターのフォルダシールド(フォルダ・シールド)は、大切なフォルダを勝手に書き換えられないよう守る機能だと調べて分かりました。
止められた時は、画面に出た文章のスクリーンショットを、そのままClaude Code(クロード・コード)に貼って何度も往復して聞きながら解決してもらいました。
Macの「フルディスクアクセス」の許可も必要でした。Claude Codeを信じて、許可・承認・許可・承認・許可の連発でした。
(※「フルディスクアクセス」は強い権限です。僕は何を許可しているのか確認しながら進めました。皆さんも、内容を確かめてから許可してください)
PATH(パス)が通っていないと、コマンドが「見つかりません」と出ると知りました。コマンドが行方不明になるのか、と不安になります。
多くはターミナルを開き直すだけで直ると書いてありました。解決策は意外と簡単なのか・・・
( 全てのケースが、常に簡単な作業だとは言い切れませんが・・・ )
「permission denied」(パーミッション・デナイド)は、権限が足りないサインだと知りました。断られるのには理由があったのか、と少し納得しました。
エラー文はそのままClaude Codeに貼って聞けばいいと書いてありました。自分でコードを読めなくても大丈夫なのか、と またまた肩の力が抜けて安心しました。
セッションとCLAUDE.mdを知った
Claude Codeとのやり取りは「セッション」という単位でまとまっていると知りました。
新しいセッションを始めると、会話の記憶はリセットされます。前の話を覚えていないのか、と少し寂しくなることもあります。
ただ、同じセッションを長く使うとだんだんと反応が遅くなるらしいです。
(なるほど! だから同じチャットを長時間続けると、返事が遅くなってたのか・・・)
Claude Codeが変えた所を色分けで見せる「差分表示」と、実行前に許可する「承認」もありました。承認がなかったら、身に覚えのないことがいっぱい起きそうです。
CLAUDE.md(クロード・ドット・エムディー)は、最初から完璧でなくてもよく、「徐々に育てるもの」だと書いてありました。なので、さらに気が楽になりました。
禁止事項は「〜しないで」より「〜したいときは確認して」と書くと、AIには伝わりやすいと知りました。人に何かを頼むときや、誰かに何かを教える時ともよく似ています。
.claude/settings.json(クロード・セッティングス・ジェイソン)も知りました。
確認なしで実行してよい操作とそうではないものを分けられるそうです。信用できる流れのやり取りで、いちいち承認するのが面倒な時には助かります。
Claude Codeに、まとめページ・確認テスト・小テスト15問・総合問題集30問を作ってもらいました。身に付いた感じがないので、せめて用語だけでも覚えておこうと思ったからです。
【今日のおすすめ】
道具は4つでセットだと先に知っておく
拡張機能は発行元(パブリッシャー)を必ず確かめる
エラー文は、そのままClaude Codeに貼って聞く
CLAUDE.md は 初めから完璧を目指さず、実際に使いながら少しずつ育てていく

最後までお読みいただき 本当にありがとうございました!

