小さな学生が独自ドメインでサイトを作るまで

こんにちは。小川　智也です。
今日は自分が独自ドメインでサイトをつくるためにしたことを紹介したいと思います。

プロフィール

• 名前　小川 智也
• 小学6年生
• 得意言語はHTML&Javascipt
• 自称天才
• Tech Kids Grand Prix 2022 近畿大会決勝進出 ( 動画 )

HTMLはマークアップ言語でありプログラミング言語ではないという声も多いですがここでは便宜上HTMLもプログラミング言語とします

※小さい学生は小学生のことです☆

主な手順

(0. 天才になる)

1. ローカル環境でサイト制作の知識を得る
2. 公開用のサイトを作る
3. 独自ドメインを取る
4. レンタルサーバーを借りる
5. サーバーに独自ドメインを設定しSSL化
6. FTPでサイトをうp
7. ☆完成☆

1.ローカル環境でサイト制作の知識を得る

PCとVSCodeとChromeさえあれば誰でもエンジニア！
たぶん。初心者はBootStrap使えばすぐにそれっぽいサイトできる
ある程度HTML&JS&CSSが学べたら次のステップへ
↑HTML&CSS&BootStrapのみで作った簡易レジ おがとも.jp で公開中

2.公開用サイトを作る

軽く自己紹介とそれっぽいの作ればおk
そのうちデザイン整えたりコード読みやすくすればいい。
昔はメモ帳で特にインデント揃えずにやってた(今は揃えないと気持ち悪くて嫌)

3.独自ドメインを取る

お名前.comとか有名所で取るのが一番。.comとか.netは1円～ある

初年度の取得費用。短いドメインにしたいから .jp で取ったけど更新費用高くて貯金しないとと焦ってる

4.レンタルサーバーを借りる

無料サーバーと有料サーバーの2つあるけど最初は無料でいいと思う。何なら今も無料サーバーだし(未成年で毎月払う金もないから)
XREAだとPHPやデータベース、メールとかも使えて無料だけど広告が入る。
HTMLだけだったらStarFreeとかXfreeが広告はいらなくていい。今はStarFree使ってる。
正直言って自分のサイトはアクセス数少ないしそんなに重くないから無料サーバーで十分。

↑無料でも2GB使える

5.サーバーに独自ドメインを設定しSSL化

※ここではCloudflareとお名前.comを使う前提でお話します。ほかもだいたい同じ感じなので勘でやってください

StarServer(Free) の場合

普通のとこだとドメインのDNSでAレコードをサーバーのIPに向ければいいんですがStarServerはクソめんどいです。
まずネームサーバーを独自のやつにします。

コピペ用
ns1.star-domain.jp
ns2.star-domain.jp
ns3.star-domain.jp
そして変えたら浸透するまで時間がかかるので推しの子をみて時間が立つのを待ちましょう()
変えたら下の画像のようにして「確認画面」を推します。(ドメイン名には自分のドメインを入力)

そしたら多分確認が出てくるのでOKとかそんな感じのボタンを押したら完了です！
追加できたらネームサーバーは変えてもいいと思うので下のようにCloudflareにすることをおすすめします。

StarServer(Free) 以外の場合

まずCloudflareのアカウントを持っていない場合は作り、ドメインを追加します。そしたらネームサーバーを変えろ的なことを言われるのでドメインの管理画面などでネームサーバーを以下のものに変更します。

コピペ用
brianna.ns.cloudflare.com
mack.ns.cloudflare.com

そしたらネームサーバーをチェックを押して少ししたら「おめでとうございます！あなたのサイトは保護されています」みたいになるのでおkです

そしたらサーバーの管理画面の方で追加を行います。
たぶんサーバーのIPにAレコード向けろとか言われるはずなので管理画面からサーバーのIPを探し、コピーします。
そしたらCloudflareにもどり追加したドメインをクリックし、画面左にあるDNSをクリックします。
「＋レコードを追加」を押し次のようにします

このとき「プロキシ ステータス」がオレンジ色でプロキシ済になっているとだいたいレンタルサーバーが反応してくれないので灰色のDNSのみにします。

サブドメインを使う場合は「名前(必須)」の「＠」と入力されているところをサブドメインの名前にします。(internet.example.comだったらinternet)

StarServer(Free)でWeb・メール認証、Cloudflareに変えた人へ

AレコードをサーバーのIPに向けないと接続できないので注意！最初メール認証でやったのですが繋がらなくて焦って完了画面にも何も書いてないので勘でAレコードをサーバーのIPに向けたら行けました。(当たり前だけど)
サーバーのIPは管理画面の[サーバー情報]>[IPアドレス]です。

6.FTPでサイトをうp

いよいよ最終段階です。サーバーによってはWebFTPがあるので1,2個のファイルならWebFTP、アップロードするファイルが大量にあるならWinSCPなどのFTPソフトを使いましょう。
StarServerならさっきの画像のIPアドレスの上にあるホスト名がFTPのホスト名で、ユーザー名はドメイン名、パスワードはメールに記載のものか、忘れたら再設定してそれを入力しましょう。たぶんSFTPには非対応。

7.☆完成☆

おめでとうございます！これであなたも立派な「エンジニア」ですね！
この記事がいいと思ったら「いいね」や「ストック」よろしくお願いします！