・簡単なやり方で確認したい
・レンタルサーバーはよく分からない
私もHTML/CSSの学習をしていたときは、
スマホで確認ってどうやるの…？？
って感じでした。
ですが、
スマホで確認する「簡単な方法」があります。
それは、
「GitHub」を使って公開する です。
「GitHub（＝ギットハブ）」とは何か？
今回は詳細を省きますが、簡単に言うと、
「プログラミングコードを共有できる」
サイト（Webサービス）です。
もちろん「無料」です。
だとすると、
みたいな感じですね。
「共有」ができるので
知り合いや友達とかにも、気軽にサイトを見せることができます。
つまり、
「共有用のURL」が発行されるので
それを「スマホから開く」ことで
実機のスマホで確認できるというわけですね。
さっそく、あなたの作ったWebサイトを「GitHub」で公開してみましょう。
GitHubの登録
まずは、GitHubの登録を行いましょう。
「github.com」にアクセスします。
✅以下、①～⑥の通りに登録を進めてください。
②パスワード、ユーザー名を決める
③認証パズルを解く
④認証コードを入力する
⑤ユーザー名、パスワードを入力する
⑥登録完了
①登録用のメールアドレスを入力する
②パスワード、ユーザー名を決める
15文字以上、または数字と小文字を含む8文字以上にする必要があります。
【ユーザー名】
英数字または単一のハイフンのみを含めることができます。
ハイフンで始まったり終わったりすることはできません。
③認証パズルを解く
④認証コードを入力する
⑤ユーザー名、パスワードを入力する
⑥登録完了
ブックマークをしておきましょう。
Webサイトを公開する
ここからは、ちょっと慣れが必要です。
が、慣れてしまえば
3分くらいで出来るようになります。
✅以下、①～⑪の通りに登録を進めてください。
②リポジトリ名を決める
③「Create repository」をクリック
④「uploading an existing file」をクリック
⑤ファイルをアップロードする
⑥「Commit changes」をクリック
⑦「Settings」をクリック
⑧「Pages」をクリック
⑨「Branch」をmainにする
⑩「Save」をクリック
⑪URLをクリック
①「Create repository」をクリック
②リポジトリ名を決める
公開するWebサイトURLの一部
（ドメイン名だと思ってもらえば大丈夫です）
練習なので「test」にしました
③下までスクロールして「Create repository」をクリック
④「uploading an existing file」をクリック
⑤ファイルをアップロードする
各ファイル（html、css、imgファイル等）を範囲指定して入れてください。
大枠のフォルダ（上記「練習サイト」）のまま突っ込むとうまくいきません。
⑥下までスクロールして「Commit changes」をクリック
上記画像のページで
各ファイルがアップロードされているか確認してくださいね。
⑦「Settings」をクリック
⑧左の項目「Pages」をクリック
⑨「Branch」を main にする
⑩「Save」をクリック
お疲れさまでした。
これで準備完了です(”◇”)ゞ
あとは、公開されるまでに２～３分掛かるので、休憩してましょう。
休憩が終わったら
ページを再読み込みしてください。
⑪URLをクリック
どうでしょうか。
自作したWebサイトは開けましたか？
もし、エラーが出たり、
何らかの理由で開けなかった場合は
この記事の下にあるコメント欄 に
質問をいただければ、私の分かる範囲で回答します。
実機のスマホで確認する
Webサイトを公開できたら
そのURLをスマホに送るだけです。
一番簡単な方法は、
「gmail」に下書きする です。
gmailから
↓
「サイトURLを打ち込む」
↓
「下書きに保存」 されます。
あとは、スマホの方からgmailアプリを開いて、下書きを確認してみてください。
サイトURLを打ち込んだメールがあると思います。
レンタルサーバーも使おう
ここまで「GitHub」の使い方とメリットをご紹介してきました。
「GitHub」があれば、レンタルサーバー要らなくない？
と思われる方もいると思いますが
今後、プログラミングの勉強を続けるのであれば、サーバー知識は必須です。
レンタルサーバーも使ってみることを
「強くおすすめ」します。
例えばですが、
「WordPress（ワードプレス）」って
聞いたことはありますか？
おそらく、プログラミングの勉強をしている方であれば、一度は耳にしたことがあるでしょう。
その「ワードプレス」を使うにも、レンタルサーバーは必要です。
また、プログラミングに限らず
私のように、このブログ記事を書くにしても、ワードプレスは必要になります。
もちろん、簡単なことではありません。
サーバーに上げるには「ドメイン」も必要になってきたり、分からないことが出てくるかと思います。
でも、GitHubの使い方を覚えられたのなら、サーバーも絶対に使いこなせるので安心してください。
大丈夫です。
一つずつ解決していけば、大丈夫です。
Google検索や、YouTubeとかにも
解説しているものがたくさんあります。
私の記事に辿り着いたように
「分からないところ」を一つずつ検索して、解決して潰していきましょう。
レンタルサーバーですが
「エックスサーバー」をおすすめします。
国内シェアNo.1のレンタルサーバーなので、情報もゴロゴロ転がってます。
また、エックスサーバーは、
「無料お試し期間」が設けられています。
申し込み日から10日間、
サーバーを自由に使うことができます。
なので、まずは
あなたがGitHubで公開したWebサイトを、エックスサーバーに上げる練習をしてみましょう。
一度できてしまえば、
2回目以降は、問題なくできるようになります。
最初は覚えることが多くて大変かもしれませんが、頑張ってくださいね。
エックスサーバーの無料お試しについては、
↓こちらから確認してみてください。
コメント