Web サイトの公開

サイトのコードやファイルの準備ができたら、そのサイトをほかの人が見つけられるように、ファイルやコードをすべてオンラインに置く必要があります。この記事では、シンプルなサンプルコードを少しの手間でネット上に公開する方法を説明します。

どんな選択肢があるのか?

ウェブサイトを公開するというのは簡単に語れることではありません。なぜなら、ウェブサイトの公開の仕方には、さまざまな方法があるからです。この記事での私たちの目標は、そのすべての方法を記述することではありません。むしろ、我々は初心者の視点から、大まかに 3 つの手法の長所と短所をお話しし、その次に、今のところはこれでうまくいくという方法で一通りやってみます。

ホストとドメイン名を手に入れる

もし、あなたが公開したウェブサイトのすべてをコントロールしたいと思うなら、次の 2 つに関してお金を払う必要があるでしょう。

  • ホスト — つまり、ホスティング会社の ウェブサーバー上のファイルを置く場所のこと。あなたが、ウェブサイトをその場所に置けば、ウェブサーバーが、ユーザーのリクエストに応えて、コンテンツを扱ってくれます。
  • ドメイン名 — ほかの人があなたの ウェブサイトを見つけるための、他と同じもののないアドレスのことです。たとえば、http://www.mozilla.orghttp://www.bbc.co.uk などがそれにあたります。あなたはドメインレジストラー (ドメイン名を扱う管理者) から、何年の間ドメイン名を借りることになります。

多くのプロの手によるウェブサイトはこんな風にして、公開されているわけです。

加えて、あなたは、実際にウェブサイトに関するファイルをサーバーに送るために、File Transfer Protocol (FTP) プログラムが必要です (詳しくは、どれくらいお金がかかるか: ソフトウェアのページにて)。FTP プログラムは、プログラムごとに様々ですが、一般的に ウェブサーバーのホスティング会社が提供する詳細情報 (例えば、ユーザーネーム、パスワード、ホスト名) を使用してログインする必要があります。ログインすると、FTP プログラムは、あなたの pc のローカルファイルと、サーバー上のファイルを二つのウィンドウで表示します。その画面において、あなたはファイルを送ったり戻したりできます。

ホスティングとドメインを見つけるための TIPS(ヒント)

  • 私たちはここで、特定の商業的なホスティング会社やドメイン名レジストラーを宣伝するわけではありません。ホスティング会社とドメイン名レジストラーを見つけるためには、単に「ウェブホスティング」や「ドメイン名」で検索すれば見つかるでしょう。全てのドメイン名レジストラーが、あなたが希望するドメイン名が利用できるのか、他の誰かがすでに登録しているのかをチェックする機能を持っているでしょう。
  • 自宅、またはオフィスの インターネットサービスプロバイダー が、小規模なウェブサイトのためのホスティングを提供しているかもしれません。そのホスティングは、利用可能な機能が限られているでしょうが、最初のお試しとしては十分でしょう — 彼らと連絡を取って、訊いてみましょう。
  • Neocities, BloggerWordPress などのような、無料のサービスも少数ながらあります。ここでも、支払うほど得るものは多くなりますが、最初のお試しの場所としては十分です。無料サービスでは、たいていアップロード用の FTP ソフトが不要で、ウェブの画面上で単にドラッグアンドドロップするだけで OK です。
  • 時々、会社がホスティングとドメインの両方を、まとめて提供していることもあります。

GitHub や Google App Engine のようなオンラインツールを利用する

特定のツールを使って、あなたのウェブサイトをオンラインに公開することもできます。

  • GitHub は、「ソーシャルコーディング」サイトです。そこでは、あなたは Git バージョン管理システムの中のストレージで、コードリポジトリをアップロードできます。そうすることで、あなたはコードプロジェクトに協力することができて、このシステムは既定でオープンソースです。つまりは、世界のだれでも、あなたのコードを利用したり、そこから学んだり、改善したりすることができるのです。GitHub には GitHub Pages と呼ばれる、とても便利な機能があります。それはあなたにウェブ上に、ウェブサイトのコードを公開するのを助けてくれます。
  • Google App Engine は、アプリケーションを Google のインフラ上で、ビルドや実行させることができる強力なプラットフォームです。マルチレイヤ― ウェブアプリケーションをゼロから作ったり、静的な ウェブサイトをホストしたり、いずれの場合でもそうです。ウェブサイトを Google App Engine でホストするには? を見てみましょう。

これらのツールは、多くのホスティングと違って、利用するのは無料です。しかし、使える機能はやはり限られています。

CodePen のような、ウェブベースの IDE を用いる方法。

ウェブ開発環境を真似た ウェブアプリはたくさんあります。それらで HTML や CSS、JavaScript を入力し、それらのコードを ウェブページとしてレンダリングした結果を表示できます — すべてが 1 つのブラウザータブの中で。一般的に言って、これらのツールはとても簡単で、とても勉強になり、コードの共有に向いていて(例えば、テクニックを共有したり、別のオフィスの同僚にデバッグの助けを求める)、(基本的な機能は) 無料です。

生成したページを固有のアドレスでホストします。しかしながら、基本的な機能はかなり限られたものであり、そのアプリは大抵において、アセット (画像など) のためのホスティングスペースを提供していません。

これらを試してみて、一番あなたに合ったものを見つけてみましょう。

GitHub 経由での公開

では、GitHub Pages 経由でどれくらい簡単にサイトを公開できるかを実際にやってみましょう。

  1. まず、 GitHub にサインアップして、あなたのメールアドレスを確認しましょう。
  2. 次に ファイルを入れるためのリポジトリを作りましょう。
  3. このページ上の、Repository name ボックスに username.github.io の形で、ユーザー名を入力しましょう。username のところに、あなたの名前が入ります。
    例えば、私たちの友人である bob smith ならば、
    bobsmith.github.io と入力することになります。
    さらに、README つきでこのリポジトリ―を初期化 (Initialize this repository with a README)をチェックして、リポジトリ―の作成 (Create repository)をクリックします。
  4. ウェブサイトのフォルダーをリポジトリ―の中にドラッグアンドドロップしたら、Commit changes をクリックしましょう。
     

    : フォルダーの中に index.html の名前のファイルがあるかを確認しましょう。

  5. では、あなたのウェブサイトをオンライン上で見るために、ブラウザーから username.github.io に移動しましょう。例えば、ユーザーネームが chrisdavidmills なら、chrisdavidmills.github.io に移動しましょう。

    : あなたのウェブサイトに行けるようになるには少し時間がかかるかもしれません。すぐに行ってもダメなようなら、少し待ってからもう一度試してみましょう。

もっと詳しく知りたい人は GitHub Pages Help を見てください。

参考文献

このモジュール