お名前.comでドメイン取得からfirebaseに繋ぐまで

※ firebaseにデプロイまでは完了してる前提で話を進めます。

# お名前.comでドメインを取得する
取得したいドメインを選ぶところまでは問題なく進めるかと思います。
僕が迷ったのはここ。
![スクリーンショット 2020-08-13 0.58.47.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/67190/21f96d40-da4a-bdee-1d8a-8c7079ca2385.png)
どれもよく分からん。
ここら辺参考にさせてもらいながら、僕は「Whois」だけ使わせてもらうことにしました。
（300円）

[whois情報公開代行ってなに？必要？個人情報を守るために必要なこと。](https://unzip.co.jp/homepage/blog/hp_knowledge/351/)
[お名前.comのドメインプロテクション設定は必要なのか](https://shu-sait.com/domain-protection-hituyou/)

めちゃくちゃ伝えておきたいのが、
**firebaseのhostingを利用する場合はSSL証明書、必要ないです！これは外しときましょう。**
↓の記事のおかげで24,000円払わずにすみました。@isatan@githubさんありがとうございます！
[Firebase Hosting なら SSL は無料です [BitScheduler開発日誌]](https://qiita.com/isatan@github/items/aeee970f8758672043a2)

あとは迷うことなくスルスル〜と購入まで進めることができるかと思います。
ドメイン取得に関してはここまでです。


# TXTレコードを取得する
Firebaseのコンソールから「Hosting」を開きます。
その中に「カスタムドメインを追加」ってボタンがあるのでそこをクリックすると
![スクリーンショット 2020-08-12 23.16.48.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/67190/5a9d888d-9f8f-1ff4-aa36-686b6eb79db2.png)
こんな感じのモーダルが開くので、先ほど取得したドメインを入力します。
「〜を既存のウェブサイトにリダイレクトする」のチェックボックスにはチェックしないで次に進みます。

するとTXTレコードが発行されるので一旦firebase側の作業はここでストップ。
すぐに戻ってくるのでページはそのまま開いておいてください。


# お名前.comでTXTレコードを設定する
[お名前.com Navi](https://navi.onamae.com/)から、DNSタブを開き、「ドメインのDNS関連機能設定」に進みます。
ここで、今回設定したいドメインを選択して「次へ」
<img width="915" alt="スクリーンショット 2020-08-12 23.30.39.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/67190/7bebf272-97a0-391f-c5b9-97366f677021.png">
※最初よく分かんなくて「お申込み」に進んじゃって危うくお金払っちゃうとこでした><
分かりにくいぜお名前.com

次のページでDNS設定の中に色々と項目が出てくるのですが、
「DNSレコード設定を利用する」の設定するへと進みます。
<img width="932" alt="スクリーンショット 2020-08-12 23.35.41.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/67190/fb8edf40-c533-c9a1-157d-82aa78c6abb7.png">

ここでようやくレコードを設定できます。
<img width="933" alt="スクリーンショット 2020-08-12 23.39.53.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/67190/1c82b180-a2e5-4007-5490-05eeb1ef4f27.png">
緑枠で囲った箇所の「TYPE」を**TXT**に変更して、「VALUE」に先ほどfirebaseで取得したTXTレコードをそのまま貼り付けて、「追加」

ページ下に移動して
「DNSレコード設定用ネームサーバー変更確認」にはチェックを入れて、確認画面へと進み、
問題なければ「設定する」を押しちゃいましょう。


# Aレコードを取得する
先ほどTXTレコードが発行されたモーダルが
<img width="719" alt="スクリーンショット 2020-08-12 23.57.14.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/67190/8feaa742-5c28-9c18-b464-a209bf7ac5d9.png">
こんな状態でいてくれていると思います。
さっきのお名前.comの設定完了から5~10ほど待って「所有権を証明」をクリック。

証明が完了すると、今度はAレコードが表示されます。
<img width="718" alt="スクリーンショット 2020-08-13 0.04.15.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/67190/9238b239-651e-7430-0790-e2029cb3368c.png">
こんな感じ。

# お名前.comでAレコードを設定する
さっきと同じ手順でDNSレコードの設定画面へと進めてください。
で、先ほど**TXT**にしてレコードを設定した箇所を、
今度は**A**でfirebaseコンソール上に表示された2つを設定します。
<img width="677" alt="スクリーンショット 2020-08-13 0.12.59.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/67190/dceb0d00-9c6f-a4ac-e33c-90f5946c92fe.png">

最終的にはこういう状態になるかと。
<img width="665" alt="スクリーンショット 2020-08-13 0.18.59.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/67190/294ffdb4-f3b9-dd2a-f80e-50adca909cab.png">

# firebaseコンソールで確認
「終了」でモーダルを閉じるとドメイン欄に先ほど追加したドメインが入っているかと思います。
<img width="791" alt="スクリーンショット 2020-08-13 0.28.25.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/67190/846b5c22-9bb6-a779-ee96-b2d53b597cb5.png">

ご親切に「www.独自ドメイン」も追加するか尋ねてくれるのでこちらもお好みでどうぞ。
ここの設定も簡単で表示されたAレコードを、
またまたお名前.comから今度は「ホスト名」のところに**www**と入力して発行されたAレコードを2つ追加するだけです。
<img width="669" alt="スクリーンショット 2020-08-13 0.33.42.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/67190/e0a3a1df-75b2-3f00-9b4b-8ef1fb5b9e68.png">

firebaseコンソール上で、今回追加したカスタムドメインは最初「保留中」と表示されているかと思います。
反映されるまでには最大で24時間かかると書かれていましたが、僕の場合は保留中と書かれながらも1時間も経たないうちにドメインからアクセスできるようになっていました。
* wwwドメインも最初、「設定が必要です」と表示されてましたが、少しおいとくとそのうち「保留中」に変わってアクセスできるようになってました。

これで終わりです！
お疲れ様でした！