【初心者向け】C#忘れそうなので、TODOアプリでASP.NET Coreを復習してみた【開発環境構築編】

Posted at 2025-07-16

こんにちは、いま蚊にさされてめっちゃかゆい🍞焼きたてパン（@kitchen-craft）です。

前回の記事では「C#でTODOアプリを作る理由」について語らせてもらいましたが、今回はいよいよ実際に開発を始めるための準備編です！
前回の記事をまだお読みでない方は、以下のリンクからぜひ読み始めてもらえたら嬉しいです！　↓↓↓↓↓↓↓↓↓

🧭 目次

🎯 この記事の対象
❓ そもそも「開発環境構築」って？
- 🧠 補足：コンパイルってなに？
  - 💬 一言で言うと
  - 📚 実際にコンパイルしてみよう!!
- 具体的にはこんなことをやります：
✅ Step 1：Visual Studio 2022 とは？？
✅ Step 2：Visual Studio 2022 のインストール手順
✅ Step 3：必要なワークロードを選ぼう！
✅ Step 4：インストールスタート！
✅ Step 5：Visual Studio を起動してみよう！
🎉 これで開発環境の構築が完了！
🛠 このシリーズでは、以下の流れでTODOアプリを作っていきます：

🎯 この記事の対象

そもそも開発環境構築ってどういうこと...??

C#だけでは開発できへんのか???

『ASP.NET core』とはなんぞ...??

蚊にさされた時は刺されたところを温めるといいらしいで!!

そんなあなた（わたし）に向けて、ゼロから開発環境を整える手順を画像付きで紹介していきます!!
途中わからないところや質問などあれば気軽にコメントしてくださいm(__)m
私が焼きたてのかぎり返信していきます!!

❓ そもそも「開発環境構築」って？

『開発環境構築』っていうとちょっと難しそうに聞こえるけど、要は
「プログラムを書いて、それが動くように準備すること」 です 💻

うーんそのままやないかい!!!!( `･д･)っ))ﾅﾝﾃﾞﾔﾈﾝｯ
...しかしこれが奥が深いというかなんというか...実際はプロジェクトによって実際の開発を行う環境っていうのは様々だし、使ったことないツールとかも覚えないといけないしで、
　

プログラミングしているときより難しいかもしれない...(-_-)
　

そんな開発環境についてですが、そもそもの話

💻実は開発環境が無くてもプログラミングを行うことは全然可能💻ﾅﾝﾃﾞｽ...

こうやって標準の『メモ帳』とかに

Hello World!!.txt

using System;

class HelloWorld
{
  static void Main(string[] args)
  {
    Console.WriteLine("Hello World!");
  }
}

ってコピペして、コンパイルして実行するだけで...

簡単に「🌸Hello World!! ~おはよう世界~🌸」を表示できてしまうんです実は。

🧠 補足：コンパイルってなに？

さて、『コンパイル』という言葉がさらっと出てきました。

　
なんかQiitaとかのエンジニアの記事サイトって当たり前のように難しい言葉が出てくるから簡単でもいいから説明しろよ！！ってプログラム習いたての時はめっちゃ思ってました...。
　
僕の記事ではなるべく 【初心者向け】 に投稿していくのでここではしっかり解説していきますね(^^)(^^)(^^)

「コンパイル」について理解している方は、以下の内容は飛ばしていただいて大丈夫です。
　

👈ここ"クリック"　🧠コンパイルについて🧠

💬 一言で言うと

📚コンパイルとは、プログラマーが書いたソースコードを、コンピューターが実行できるカタチに変換することです。

私が先ほど上にあげたソース

Hello World!!.txt

using System;     // 👈標準的なC#の機能を使うよ!!
class HelloWorld　// 👈ファイル(クラス）の名前だよ!!
{
  static void Main(string[] args)　// 👈ここからスタート(Main[メイン])するよ
  {
    Console.WriteLine("Hello World!");　// 👈コンソール(真っ黒い画面)に文字を表示するよ!!
  }
}

こんな風に１つ１つの処理の内容を理解していれば、開発者はこのプログラムの意味を理解できるけど、実はコンピューターから見たら

💻<ﾅﾝﾃﾞｽｶｿﾚﾊ...ﾜｶﾗﾅｲﾖ...

そのため、このソースをコンピュータが理解できるように 『翻訳（コンパイル』 してあげる必要があるんです。

📚実際にコンパイルしてみよう!!

ではせっかくなので、基本的なコンパイルの方法もご紹介します。

実は『C#』は「Windows」でのみ動く言語のため
Macユーザーでは以下の方法ではコンパイルできません...。
※ASP.NET coreやMonoと呼ばれるものでは可能ですが、ここでの説明は省きますm(__)mｺﾞﾒﾝﾅｻｲ....

さて、先ほどコンパイルを『翻訳📱』といいましたが、われわれ人間も世界中にある様々な言葉を調べるときに、Google翻訳🌐であったりDeepL翻訳📖であったり翻訳アプリなるものを使用していると思いますが、C#では

『.NET Framework』

という翻訳アプリ（コンパイラーと呼ぶ）を使用することになります。
実は、こちらはWindows Vista以降のWindowsOSであれば標準でインストールされていますので、実際に見に行ってみましょう👀

C:\Windows\Microsoft.NET\Framework

👆こちらのパスをコピーして、フォルダの上部に貼り付けてEnterで該当のページへ移動します。

どのフォルダの「v2.0.~」はバージョンを表しています。特に指定はありませんが、ここでは一番バージョンの高いものを使用します。

フォルダを開くと、よくわからないフォルダがズラリとでてきますが、**『csc.exe』**というアプリケーションを探してみてください!!

まさにこれが📚翻訳アプリ（コンパイラー）と呼ばれているものになります😃
ではさっそくこのフォルダの直下にメモ帳かなにかで『HelloWorld』というテキストファイルを作成して、先ほどのソースを貼り付けてみましょう。

こちらの準備ができましたら、またフォルダ上部のパスのところに
『cmd』 と入力してEnterを押してみてください🔑

すると真っ黒い画面が開くかと思いますが、こちらは
『コマンドプロント🖥』 と呼ばれるものとなります。

コマンドプロントの詳しいお話はまた今度にしますが、簡単に説明すると
『📕コマンド（キーボードからの入力）でパソコンの操作を行うもの』
だと思っていただければ大丈夫です。

では早速コンパイルしてみましょう!!(/・ω・)/
以下をコピーして、コマンドプロント🖥に貼り付けてみましょう!!

csc.exe HelloWorld.txt

そしたらEnterキーじゃぁあああ🔥！！！！

いろいろと怖そうな文字が並んでおりますが、メモ帳を作成したフォルダの中に
『HelloWorld.exe』 というアプリが作成されていれば成功です🌟

　
ダブルクリックで起動してもいいのですが、プログラム上では
『コンソール（黒い画面）に「Hello World!!」を表示する』
処理しか書いていないため、すぐにアプリが終了してしまいます...😢

　
しかしコマンドプロント🖥では「パソコンの操作を行うもの」と説明した通り、コマンドプロント上でも実行できるため、そちらで確認してみましょう!!

先ほどの手順で以下のコマンドをコピペ、Enterを押してみてください。

HelloWorld.exe

でた!!!「こんにちは世界」がでたぁああ🎆!!!!

　
これがコンパイルの作業となります。

　
...『コンパイル』について簡単に理解していたかとは思いますが、実際に自分の手でコンパイルをやっていくというのは、ソースの量が増えていくについてめちゃくちゃ大変になっていくと思います...😢

また、メモ帳やテキストエディタなどでソースを書くと、スペルミス✖であったり、
１からすべて自分の手で入力してプログラミングしていかないといけなかったり...

開発環境はキッチン🍳。
包丁🔪がなきゃ料理。

食材🍞(コード) があっても
まな板や包丁🔪(開発環境やツール) がなかったら
**料理🍳(アプリ)**はできぬ。

キッチンで何かを作っていくというイメージで『@kitchen-craft』ってIDにしました。
ちゃんと意味があったんです...。

具体的にはこんなことをやります：

✅プログラムを書くためのソフト（今回はVisual Studio2022）をインストール
✅書いたコードを動かすためのツールやライブラリを揃える
✅実際に動かすための設定（プロジェクト作成やフレームワークの選択など）

これらの準備ができてはじめて「アプリを作る」フェーズに進めます。

　
冒頭で『プログラミングしているときより難しいかもしれない...』という話をしましたが、

自分のパソコン上で環境を整える場合は、もうすぐに完成します💻

便利な時代になりました...。
それこそ20年前とかはさっきみたいに１つ１つコンパイルとかしていた時代なので、すぐに開発環境を整えられるようにしてくださった先人たちの皆さんには本当感謝ですね(人''▽｀)🌟

ではさっそく開発環境を整えていきましょう！！！

✅Step 1：Visual Studio 2022 とは？？

ところで、この記事のメインでもある 『🔵ASP.NET core』 というものですが、
この 『💡Visual Studio』 という 『🧰IDE（統合開発環境）』 についております!!!!

また色々と言葉が登場してまいりました...( ﾟДﾟ)
１つずつ簡単に説明してまいりましょう🔵

🖥 統合開発環境（IDE）ってなに？

「統合開発環境」とは、英語で Integrated Development Environment（IDE）のこと。簡単に言えば、プログラミングに必要な道具をひとつにまとめた超便利ツールです！
先ほど例えたところの『まな板』にあたる土台てきな所ですね。

🧰IDEには何が入ってるの？

IDEを使うと、以下の機能がすべて揃っています👇👇

機能	役割
ソースコード編集	コードを見やすく＆書きやすくする（自動補完も！）
コンパイラ	書いたコードをコンピューターが読める形に変換（コンパイル）さっき手でやってた作業!!
デバッガ	バグが起こったときに原因を見つけて修正するツール
実行環境（ビルド機能）	書いたプログラムを実際に起動させるボタン・機能など

他にも簡単に外部の📚ライブラリ（よく使う部品をまとめたもの）を利用できたり、チームとのやり取りがやりやすくなったり、いいことずくめ🌠

🔎 じゃあVisual Studioは？

『🔵Visual Studio』は、Microsoftが提供する超高性能なIDE。
C#開発だけじゃなく、Web・ゲーム・デスクトップアプリなど多彩なジャンルに対応していて、初心者からプロまで幅広く使われているIDEのひとつです！

🌐公式サイト
https://visualstudio.microsoft.com/ja/

Visual Studioでは、C#だけじゃなく、以下のような言語でも開発できます：

VB.NET（Visual Basic）
F#（関数型言語）
C++ / Python / JavaScript なども部分的に対応！

🔵Visual Studio 2022ですぐ弾けるフレームワークたち（ざっくり紹介）

『フレームワークとはなんぞ？』という疑問も残りますが、まずは🔵Visual Studio 2022をインストールするだけで始められちゃうフレームワークをざっくり紹介！！

フレームワーク	なにができる？
ASP.NET Core（MVC）	Webアプリを作る王道フレームワーク。今回はこれを使います！
Blazor	Web技術だけど、C#だけで画面もロジックも書けるやつ。まさにC#の未来枠
WPF / WinForms	Windows用のデスクトップアプリ（業務ツールっぽい画面）
Console App (.NET Core)	黒い画面に文字が出る超シンプルなアプリ（さっきやったやつ）

🎯 今回使うのは「🔵ASP.NET Core（MVC）」

これはWebブラウザで動くアプリをC#で作るための、Microsoft純正フレームワークです！

「MVC」っていうのは…

Model（データ）
View（見た目の画面）
Controller（操作まわり）

この3つを役割ごとに分けて作る考え方のこと！
ここについては実際にTODOアプリを作る過程で詳しく説明していくから…

🔧 見た目と中身をきれいに分けて作れる
🍱 お弁当箱みたいな設計！と覚えてくれたらOK！

🧠 補足：フレームワークってなに？

さて、またまた『フレームワーク』という言葉がさらっと出てきました。

こちらも「フレームワーク」について理解している方は、以下の内容は飛ばしていただいて大丈夫です。
　

👈ここ"クリック"　⚙フレームワークについて

🖼 黒い画面しか出せないアプリから「画面付きアプリ」ってどう作るの？

上記の説明では、メモ帳で作ったC#のソースを手動でコンパイルして、「Hello World!!」を黒い画面（コンソール）に表示させるところまでやりましたよね。

で、ふと思ったんです。

💬「これ、どうやったら“ふつうのアプリ”になるの？？」

スマホでもPCでも、普段私たちが使ってるアプリって、
ボタンがあったりフォームがあったり、いわゆる「画面（UI）」がありますよね。

でもあの黒い画面のままだと、
**“ガチの昔のDOSアプリ”**みたいで、現代のWebアプリとはちょっと違う…。
　

じゃあ📱「画面付きアプリ」を作るには？

そこで登場するのが ⚙フレームワーク です！

✅ フレームワークって何？

「アプリっぽい見た目や機能を、ゼロからじゃなくて“ある程度完成した部品”を使って作れるようにした便利セット」

たとえばWebアプリって、以下みたいな機能が絶対必要になります👇

📄 入力フォームとか
💾 データ保存とか
📍 URLでページ切り替えとか
✅ 入力のチェックとか

これを1から手作業で組むと、地味にしんどい…
（HTML、CSS、JavaScript、DB接続、サーバーの処理…全部必要）

でも ASP.NET Core（MVC） みたいなフレームワークを使えば、

「それら全部、だいたい用意しといたから、作りたい中身に集中していいよ！👍」

っていう感じになります。

🤔 IDEとフレームワークって、正直似てない？

めっちゃわかりますその気持ち。

「どっちも“開発に必要な便利セット”っぽくない？？」

でも実は、役割がちょっと違います👇

用語	役割	例
🧰 IDE（統合開発環境）	開発者がプログラムを書く場所・道具箱	Visual Studio、Rider など
🏗️ フレームワーク	アプリの“中身”や動きの土台	ASP.NET Core、React、Laravel など