WEBサイトを制作したけれど、どうやって公開するんだろう?
そんな疑問を、ここで解決してしまいましょう。
WEBサイトを公開するには、サーバーを借り、ドメインを取得する必要があります。
ドメインやサーバーの取得方法ついては以下の記事をに目を通してみてください。
https://base91.net/server/
https://base91.net/domein-show-web/
準備が整ったら、今度はサーバーにファイルをアップロードする必要があります。
自分で作ったWEBサイトのデータをサーバーに送らなければ、公開はできません。
では、どうやってサーバーにファイルをアップロードするのでしょうか。
そこで、登場するのがFTPソフトです。
FTPソフトとは、自分のパソコンとサーバーを繋ぐ「どこでもドア」のようなものです。
直接、FTPソフトを通じて、自分のパソコンからサーバーの中が覗けます。
また、中を除くだけではなく、データのアップロードやダウンロードもできるのです。
まずは、FTPソフトをダウンロードしてみましょう。
Macであればサイバーダックというアヒルアイコンのソフトが有名ですね。
Windowsであれば、FFFTPを使っている人が多いのではないでしょうか。
※ windowsでもサイバーダックはあります。
それぞれ、ダウンロード&インストールして準備を整えましょう。
ダウンロード&インストール完了したら、今度はサーバーの「FTP情報」を調べます。
「FTP情報」とは、ソフトとサーバーを繋ぐための鍵みたいなものです。
主に「ホスト」「ユーザー名」「パスワード」で1組になっています。
FTP情報をソフトに登録することで、サーバーと繋がるようになります。
ただ、どこにあるのか、サーバーによっては、分かりづらいこともあるんですよね。
大抵の場合、サーバーの管理画面にFTP情報が掲載されているはずです。
または、登録時に送られてきたメールに記載されていることも多いです。
みつけたら、FTPソフトに情報を登録していきましょう。
登録が無事に完了すると、ソフトを通じてサーバーと繋げるようになります。
サイバーダックの場合
ここでは、サイバーダックの例をあげて、接続方法をご紹介します。
FFFTPの接続方法は、後ほど掲載予定ですが、検索してもたくさん見つかるはずです。
あまり大きな差はありませんので、ぜひ検索して挑戦してみてください。
なお、今回はmac+サイバーダックの組み合わせです。
windowsだと、表示が異なることがありますのでご了承ください。
さて、進めていきましょう。
まず、サイバーダックを開きます。
すると、何も無い、横線が入った画面が現れます。
この横線が入ったエリア、どこでも良いので、右クリックしましょう。
macの場合、キーボードのcontrolキーを押しながら左クリックでも大丈夫です。
するとポップアップウィンドウがあらわれます。
新規ブックマークを押します。
すると、上記のような画面が出てくるのですが、ここで入力するのは2つ。
「サーバ」「ユーザー名」に、FTP情報の「サーバー情報」「ユーザー名」を入れましょう。
その後、左上の「×」ボタンを押してウィンドウを閉じます。
すると、先程何もなかった横線の入ったエリアに情報が追加されました。
この追加された情報をダブルクリックしてみましょう。
もし、「非セキュアなFTP接続」画面が出てきたら「続ける」を押してください。
続けていくと、ログイン失敗、という画面が出てくるのですが大丈夫です。
FTPパスワードを入力してログインしてください。
すると、下記のような画面が表示されるはずです。
今回は仮にエックスサーバーを使ったとします。
入力情報があっていれば、フォルダ / ファイルが現れ、ログイン成功となるはずです。
サーバーの中身とは言え、扱いは普通のファインダーと一緒です。
ドラックアンドドロップでファイルをアップロードできますし、ダウンロードもできます。
僕の場合、サイトを色々と管理しているので、少しファイル数が多く表示されています。
エックスサーバーの場合「オリジナルドメイン1つにつき1つのフォルダ」が自動で作られます。
startoutであれば、startout.workの中が該当のデータになります。
しかし、最初の段階では、ほぼ何もありません。
あるのは「サーバーから付与されたテスト用のドメイン」だけとなります。
大抵のサーバーは、最初に「テスト用のドメイン」が1つ付与されます。
サーバーを契約した時のメールや管理画面を確認してみましょう。
エックスサーバーの場合、「アカウントID.xsrv.jp」が提供されます。
上記の場合、quadraがIDとして、「quadra.xsrv.jp」がテスト用ドメインです。
URLにアクセスするときは「http://quadra.xsrv.jp」になります。
どのフォルダにアップロードすればいいの?
サーバーへのアップロード自体は、対象のファイルをドラック&ドロップするだけです。
しかし、各ドメインに「対応したフォルダ内」にアップしなければ反映されません。
別の箇所にアップしても、あてがわれたドメインがないからです。
まず、ドメインに対応したフォルダを開いてみましょう。
初期の場合であれば、テスト用のドメインフォルダを開いてください。
すると、エックスサーバーの場合、上記のような画面になります。
各フォルダは、メール機能やサーバーの設定などが入っています。
ここで、僕たちが触るフォルダは1つだけです。
public_htmlフォルダを開きましょう。
その他は、触ってはいけません。
エックスサーバー以外も、同じような構造になっている場合は多々あります。
ファイルをアップロードして良いフォルダが大抵決まっているのです。
多くの初心者さんがつまずくポイントですね。
ドメインと、そのドメインに紐づくフォルダは決まっています。
中には、ログインしてそのままアップロードできる画面の場合もあります。
しかし、そういった場合は稀です。
アップロードできるフォルダは大抵、似たような名前になっています。
public_htmlやwwwなど、それに親しい名前になっている場合が多いです。
わからない場合は各サーバーの情報をGoogle検索してみましょう。
では、public_htmlを開いてみます。
エックスサーバーの場合、最初に上記のファイルが入っていました。
このファイルが何かと言うと、
上記の画面のファイルです。
「何もアップロードされていません」を表示するページのファイルが入っているのです。
index.htmlとdefault_page.pngは消しても問題ありません。
記念としてダウンロードしておいても良いでしょう。笑
ここまできたら、あとはご自身の作ったWEBサイトデータをアップロードするだけです。
アップロードするフォルダやファイルが間違っていなければ、それで公開完了となります。
FTP以外にもSFTPなどセキュリティが強化された接続方式もある。
今回は、最もよく使われる「FTP」という形でサーバーに接続しました。
ただ、サーバーにファイルを転送する方式は、FTPだけではありません。
よりセキュリティが強化された「SFTP」をはじめとした別の方式である場合もあります。
それは、サーバーの設定によります。
といっても、使うソフトが変わるわけではありません。
サイバーダックでは、FTP情報を設定する際に方式を変更できます。
一番上にFTP(ファイル転送プロトコル)と書かれているのが分かるでしょうか。
こちらをクリックすると、色々な方式が現れます。
転送の形式によって、サーバーに接続する方法も少しだけ異なります。
例えば、SFTPの場合、パスワードじゃなく、鍵となる「ファイル」をもらうケースもあります。
鍵となるファイルを接続時に登録することで、サーバーへの接続が許可される場合も多いです。
ただ、ひとまずここではFTPによるノーマルな形だけ覚えておいてください。
SFTPを始めとしたその他の転送方法は、必要な時に調べてみると良いです。
あまり色々やりすぎると、頭もごちゃごちゃしてしまいますからね。
これで、通常のアップロード方法は、ご理解頂けたかと思います。
ぜひぜひ、どんどんファイルを公開して、試してみてください!