【経験談】はじめての自宅サーバー（Ubuntu Server on RasberryPi）によるＷｅｂサイト外部公開

## 更新情報
2025.5.24　「開発する際に使った（学んだ）技術等」「なぜ自宅サーバーか」を加筆しました。

## はじめに
この記事は、40歳頃からプログラミングを始めたぼくが、はじめての自宅サーバではじめてちゃんとしたWebサイトを公開することを達成した経験談となります。

ちなみに完成したサイト（絶賛更新中）はこちらです。
サイトのProfileのページには、ぼくのスキル</font>の状況や学習の経歴なども書いてあるので、興味のある方はぜひごらんになってください。

https://tekuport.com

:::note 
読んだ人に伝えたいこと
-
- **自宅サーバーいいですよ！意外にできちゃいます！！**
- **自宅ネットワーク楽しいですよ！奥が深いです！！**
- **自宅サーバーめちゃくちゃ勉強になりますよ！！！**
※個人の見解です。
:::

<br>
少しでもそういったことが伝わる記事になっていれば幸いです。

## 開発する際に使った（学んだ）技術等
　正しい表現じゃないかもですが、こんな感じです。
 
::: note
使った技術たち
-
<font color=red>※　初めて使った技術は（初）と書いてあります。</font>
### 機械的なもの
　サーバー本体：RasberryPi4（初）
　ルーター：Yamaha RTX830（初）
### コンピュータ言語的なもの
　サーバーOS：Ubuntu Server（初）
　仮想環境構築：Docker
　プロキシサーバー：Nginx~~Nginx Proxy Manager（初）~~
　Webサーバー：Nginx（初）
　Webサイト：React（+MUI（初））

 ※　Nginx Proxy ManagerではできないことがあったためNginxでリバースプロキシの機能を実装しました。
:::
 

## Webサイトを作った理由

体験談の前に、なぜぼくがWebサイトを作ったか理由をすこし。

ぼくには、やりたいことがありまして。

それは、

<Br>

**「自分のスキルを活かして、だれかの役に立つ活動をする。」**
<br>

とはいえ、なかなかそういった活動をするベースもなく、ニーズを汲み取る機会もない。

そんなぼくに必要なものが、次の２つであると考えました。
<br>

::: note info
必要なもの
=
- 自分のスキルを伝える環境
- 自分の活動を伝える環境
:::
<br>
これらの環境を満たすもの、それが自分のWebサイトを作ることだという考えに至ったためWebサイトを作りました。

某AIが「プラットフォーム」とぼくのサイトを表現してて、けっこうしっくりきてます😆

## なぜ自宅サーバーか
おそらくただサイトを作るだけならレンタルサーバーやVPS使えばいいのに。
セキュリティもそっちの方が安全じゃない？

と、思われた方も多いと思いますが、まず第一に**コストを抑えたい**、そして
**多くの学びを得たい**、と考えていろいろ調べた結果

:::note 
メリット
- ランニングコストがレンタルサーバやVPSより小さい（というか電気代ぐらいしかかからない）
- レンタルサーバやVPSでは得られない学びがある（VPS使ったことないですが）
- ~~ゆくゆくwebアプリとか様々なものを公開していくにあたり~~現在僕の独自サービスやプロフィールを見れるWebサイト（[TEKUPORT](https://tekuport.com/)）とFlutterで作成したWebアプリ（[鈴鹿Navi](https://suzukanavi.tekuport.com/)）を公開しており、容量が許す限りいくらでもアプリ等を追加できて自由度が高い
:::

:::note warn
デメリット
- イニシャルコストがかかる（ルータやらラズパイやら）
- セキュリティ対策を誤ると大変ぽい
:::

と考え、総合的に、コストパフォーマンス（パフォーマンスには「学び」が含まれます。）に自宅サーバー、自宅ネットワーク。自分で全部やるのがが最適という結論に至りました。

また、デメリットに記載したイニシャルコストやセキュリティ対策に関しては、それらのコストから得られるパフォーマンス（学び）が大きく上回ると考え、ぼく的には「コスパいいね！」という感覚に至っています。

## サイト公開に至るまでのざっくりスケジュール
　ざっくりとこんなスケジュールで公開に至りました。学び始めて毎日コツコツやってたのですが、意外に早く公開まで行けました。
　もちろん途中いろいろ課題にぶちあたりましたが、時にネットで知り合った人を頼るなどして、なんとか乗り越えられました。

| 時期| 内容 |
|:-----:|:-|
| 2024.2|ラズパイ、VPNルータ購入。自宅ネットワーク再構築開始。サーバーってなにかを学習。|
|  2024.3 | React学習（少し学んだことがありましたが、ほぼ忘れてたので(;^_^A）。学習しながらサイト制作開始。 |
|2024.4|Webサイト公開|

## 自宅サーバーってぶっちゃけどう？
　個人的な見解ですが、控えめにいって**めっちゃいい**です。

:::note
いいと思ったポイント
-
- めちゃくちゃ学びが多い
- ランニングコストは意識せずに、好きなだけWebサイトやWebアプリを容量の限りつくりまくれる環境をGET（Dockerは必須と思いますが）
- ペットのように愛着がわいてくる
- （外部公開をしてるので）ついでにネットワークの勉強もできる
:::


 
　正直ぼくは最初

- サーバー難しそう
- サーバーって高そう
- コマンドなんて操作できなさそう

　きっと無理だ！と思ってましたが、やってみた結果

 - RaspberryPiって意外に安い（正直ひと昔前に比べるとめちゃくちゃ高くなってますが…）
 - いらなくなったパソコンでもサーバー作れる。
 - ググれば大抵のことはわかる。
 - 調べながらコマンド打ってたら抵抗なくなってくる（いましは、ChatGPTが教えてくれますしね。）

　といった感じで、結局事前の勝手な想像とは違いました。
　ぼくの場合、Webサイト作って外部公開しているので、セキュリティリスクがありますが、単にサーバーを学んでみたい、触ってみたいって方には、ぜひ自宅内だけでもサーバーを立ててみては？と思っちゃいます。
 
## 自宅サーバーをやってみて学んだこと

### サーバとは？
 
そもそもここ。
エンジニアの方だときっと一丁目一番地のことだと思うんですが、僕は最初どっち使ったらいいんだろ？と、ここで立ち止まりました。

そして今の僕の理解はこちらです。

:::note
サーバーとは
--
desktopとか不要なものを取り除いた軽量に動作する基本的にCLIで操作するもの
:::

ようは、使っている人に素早く情報とかを提供するために特化したものそれがサーバなんだな。
あくまで個人的な解釈ですが、「なぜデスクトップ環境が不要なのか」だって目的はクライアントさんが快適に使うことじゃなく、サーブ（提供）するために全力投球ですから！

的な解釈に至りました。

サーバーの目的を阻害するものはいらない。ですね。

結果Ubuntu Serverをもちろん使いました。CLIと書きましたが、結局VSCODEでSSLでつないで使ってますけどｗ

### 自宅サーバ公開のための自宅ネットワーク構築

サーバーを公開するために、ネットワークを学ぶ必要がありました。
正直リスク度外視で単純に公開するだけなら、おそらくインターネットを引き込んでいるどこのご家庭でも、コストなしにすぐできるんじゃないかなと思います。

が、インターネット
自由に情報が行きかう世界。なにも防御をせずに出てってしまうとえらいことになります（と、ネットでよく書かれています。）

けど、怖がっててもなにもできないですし、なにか問題がおきてもきっとそれが経験になると思い、現在トライしてます。

ただし、以下の２点はさすがに許容できないと思っていろいろ勉強しました。

:::note alert
ダメ絶対！
- 
- 自宅内ＬＡＮに知らない人が外部から侵入
- サーバーを乗っ取られてひと様に迷惑をかける
:::

自宅内ＬＡＮは、いろいろ情報資産がありますし、なにより自分だけじゃなく家族のデバイスとかもいるわけで、迷惑はかけられない。自宅サーバー外部公開するなら、そこはちゃんと守れなきゃ！

ということで主な対策は以下のような感じでとりました。

:::note
自宅内ＬＡＮの主な防衛策
-
- 業務用ルーター　Yamaha RTX830導入
- ルータでIPマスカレード。ＬＡＮ外部から直接ＬＡＮ内に侵入できないように。
- 自宅サーバーは家庭ＬＡＮ内にはいれずにＤＭＺに配置
- 自宅内ＬＡＮからＤＭＺのサーバと通信する機器は限定かつ公開鍵認証方式のみ許可
:::

今後もいろいろログ監視など、チャレンジしていきますが、とりあえず序盤はこんな感じの対策してます。

もし、ネットワーク詳しい方で、だめだめそんなんじゃなどアドバイスがありましたら、ぜひご教示いただけると幸いです。

そして、公開サーバの乗っ取り対策はこちら。
個人情報とかおいてあるわけではないので、おかしくなったら、速攻でＬＡＮ抜いて初期化でもいいのですが、なによりひと様に迷惑はかけたくないので、防衛策を講じています。
ここらへんは、鋭意いろいろ勉強中で防衛策は適宜更新していく予定ですが、いったんはこんな感じです。

:::note
公開サーバ乗っ取り防止策
-
- ポートは最小限しか解放しない。
- アクセスできる端末を限定。
- 公開鍵認証方式のみ許可（パスワード認証は拒否）
:::


### 自宅サーバーの中のネットワーク構築
先に書いたのは、リアルなデバイス間のネットワークでしたが、こちらは、自宅サーバー内のネットワーク構築です。

自宅サーバの運用をする上で、将来的に

<br>

**入口になるＷｅｂサイトを軸にしていろいろなＷｅｂアプリをたくさん作っていきたい**
<br>
と考えていたため、Dockerを活用し、ざっくり次のような構成になっています。

:::note
サーバー内のネットワーク
-
■入口担当
　リバースプロキシサーバー：Nginx proxy manager

■Ｗｅｂサーバ担当
　Ｗｅｂサーバー：Nginx
 
:::

**Nginx**ほんと優秀。
正直少し前までなんて読むかも知らなかったNginx。
リバースプロキシサーバーなんてものも正直ぜんぜん知らなかったのですが、

外からきた通信をまずリバースプロキシでキャッチして、行先を確認。
行先のWebサーバーにパスをするといったなんとも簡単な作りですが、個人的にはとても分かりやすくていいなと思ってます。

また、**Nginx Proxy Manager**なるGUIで操作できるツールとも出会いまして、こちらもとても使いやすいので、ぜひ触ったことがない人は一度使ってみてはいかがでしょうか？

すごくUIもわかりやすく、なによりLet's Encryptの設定がちょこっとの入力とクリックだけでできてしまうという。めちゃくちゃおすすめです。

ちなみに、今後は、Webサーバを増やしていろんなアプリサービスを提供していけるように計画をしています。

### ＤＤＮＳやらドメインまわりのあれこれ
サイトを公開するにあたり、グローバルIPアドレスと独自ドメイン、そしてDDNSをどうするか。
ちょっといろいろ考察しました。

一般のご家庭でＷｅｂサイトを公開しようとした場合、おそらくだいたいの人が

- グローバルＩＰアドレスは動的（変わりえる）
- ＤＤＮＳどうしよう（動的ＩＰアドレスに対応したＤＮＳサービス？的な）

になると思います。

たぶんいろいろなやり方があるのだろうと思いますが、ドメイン周りは次のような感じになりました。
ちなみにＭｙＤＮＳ様という素晴らしいＤＤＮＳサービスをドネーションのみで運営されているところがありまして、本当に感謝してもしきれません。

:::note
ドメイン周りのあれこれ
-
- 独自ドメインは、XserverDomain
- ＤＤＮＳは、ＭｙＤＮＳ様（感謝しきれないので「様」付けです！）
:::


## おまけのWebサイト
記事を書いてて、Ｗｅｂサイトがどうこうはもうおまけだな。
と、おもいましたが、今回Ｗｅｂサイトを制作してみて（ちゃんとしたサイトを作るのは初めてだったのですが）

**React✕MUI相性抜群！**

これにつきます。

デザインが苦手な方は特におすすめの組み合わせなので、ぜひぜひ興味のある方は、トライしてみてください。

## さいごに
ここまで読んでいただきありがとうございました。
ここまで書いてきて、思うがままに書いたので、読みづらい点等あったかと思いますが、本当にありがとうございました。

ぼくは、先に書いたように自分の技術を「だれかのために」提供したいと考えています。

もし、この記事を読んで、「自宅サーバー」やってみたい！
「自宅ネットワーク」やってみたいなど、思われた方

ぼくは、ぼくのスキルを提供することは惜しみません（営利活動や反社会的など一部の活動には協力できませんが…）ので、もし、なにかサポート等できることがありましたら、ＳＮＳなどでコンタクトをとっていただければ幸いです。