💾

環境構築でミスったことまとめ

2024/11/15に公開

導入

こんにちは。
最近Reactの環境構築に成功した高専生です。

今回は僕が環境構築でミスったことをまとめようと思います。読み進めると「その程度のこと?」と思うかもしれませんが温かい目で見守ってくださると幸いです。

構築ルート√

ここ数日で以下の環境構築を行いました。
・C/C++をVScodeで使えるようにする
・node.jsのインストールと設定
・Reactの環境構築
上記を見て思うところはあるかもしれませんが、その違和感は後ほど弁明します。

WSLに嫌われている

最初に「C/C++をVScodeで使えるようにする」ということを進めました。「今までやっていなかったの?」と思う人がほとんどでしょう。そうです、環境構築が苦手すぎてReplitとかブラウザのコンパイラを使っていました。ただ、優秀な後輩たちがメキメキと開発を進めているのを見て危機感が募りました。

定期テスト終了後にさっそく取りかかりました。WSLの初期設定は済んでいましたが、ファイルの管理ができていませんでした。エクスプローラーを隅々まで見てもどこにもない…。しかし、WSL接続中にファイルの場所を見たところ解決しました(なぜやらなかった??)。え?Ubuntuの中じゃないのと思いますよね。そうです、ネットワークの設定をオフにしていたのでそもそも表示されていませんでした!

初心者が環境構築で上手くいかない場合はそもそもPCの設定が原因だったりするそうです。難しいですよね…。

npmはNumpyじゃないよ(2年前の僕へ)

続いて、node.jsをインストールしてReactを勉強しようとしました。最初のインストールまでは結構楽に進んでいましたが、ここで問題が。記事のコードをコピペしてターミナルで動かしたらエラーを吐く…。エラーメッセージを読むと、驚きの事実が。それは「npmコマンドをインストールしていない…??」とのこと。この世にあって当たり前のものなんてないと理解しました。

加えて、成功したと思ってReactの設定をしようとした矢先にまたエラーが…。今度の原因は「node.jsのバージョンが古い…??」とのこと。そそくさと更新して次に向かいました。

君は完璧で究極のReact

最後に、Reactの環境構築に挑みました。ターミナルを実行すると何やら長文のエラーが…。ごちゃごちゃしすぎて詳細は分かりませんでしたが「VScodeがWSLを起動しようとする際に何かしらの問題が生じて接続ができていない」とのこと。ん?やばくね、と思い再度VScodeを見るとびっくり。全部使えなくなってました。諦めてChatGPTにエラーメッセージをぶちこむと再起動しろとのこと。何回か繰り返した結果、ちゃんと接続されました。Windowsで困ったら再起動、これは鉄則ですね(データは飛びますが)。

備考ですがyarnコマンドも上手く動きませんでした…。一旦放置してます。

まとめ

今回の環境構築はかなり試行錯誤の連続でした。でも、苦労した分色々な知識が身に付きました。やはりコードを眺めてるだけじゃなくて、実際に手を動かさないとスキルは身に付かないと思います。これからはアウトプットを大切にしていきたいです。

ここまで読んでいただきありがとうございました。

参考記事

https://zenn.dev/matsushimum/articles/325600f75e6af6
https://zenn.dev/web_tips/articles/abad1a544f3643

Discussion