会員制の動画共有サイトの構築した
こんにちは。
今日は、会員制Webページの構築についてです。
まずは、構築したきっかけから。
お急ぎの方は読み飛ばして下さい。
とある日の会話にて
ある日、こんなことを言われました。
依頼主『君はプログラミングできるから、ホームページ作れるよね。』
自分『はい?簡単そうに言いますけどそれは…』
依頼主『ホームページは会員だけが見られるようなもので、セキュリティは万全にしといてね。』
自分(もう断る雰囲気じゃないじゃん…)
みなさん、こんな無茶ぶりされたことありませんか!?笑
私はありましたよ、つい最近。
プログラミングできるから、ホームページも作れるって…
その理論でいくとプログラマー全員がホームページ作れて、Webデザイナーが仕事を失うことになるんですよ!
というツッコミを入れたいところですが、いつもお世話になってる方なので断れません。
ということで、はじめて会員サイトを作ってみました。
会員向けサイトの仕様
今回構築したサイトの仕様は以下の通りです。
- サーバーは有料のレンタルサーバーで、十分なスペック
- ログイン機能にて、会員以外は見れないようにする
- ユーザー名とパスワードは事前に個々に送信し、全ユーザー共通
- ユーザーの新規登録は必要ない
- ホームビデオを共有
- SSLによるセキュリティ対策
では、詳しく見てみましょう。
①サーバーは有料のサーバーで、十分なスペック
サーバーは既に借りていたので、その空きスペースを使用。十分なスペックというのは無料サーバーでありがちな
- 一度にアクセスが集中すると落ちる
- サイズの大きなファイルはサーバーに置けない
- 転送量帯域が制限されている
- 転送速度が遅い
といったことが無いことを指します。
動画を共有するためのホームページなので、動画が見られないようでは困ります。
②ログイン機能にて、会員以外は見れないようにする
ホームページは全体を通して、ログインしなければ見られないようにします。
これは依頼主曰わく、知らない人に公開するような動画ではないから、だそうです。
認証方法として方法は多々考えられますが、今回はセッション認証でいこうと思います。
③ユーザー名とパスワードは事前に個々に送信し、全ユーザー共通
今回は、知り合いのみが見られるものにする、ということですから、パスワードは個々に配布することが出来ます。
ユーザー名とパスワードは、個々に発行すると認証がやや複雑になりますので、共通のものを使用することにします。
④ユーザーの新規登録は必要ない
③より、共通のものを知り合いにのみ配布しますから、ホームページ上で会員登録をするような機能は必要ありません
参考にしたサイト
テンプレート
ログイン画面
ログイン画面には、こちらのデザインを使用しました。
シンプルでカスタマイズしやすそうだったので、これを採用しました。
Pugというもので書かれていて、コンパイルするとHTMLを吐き出すようです。
そんなのあるんだなあ。Pugならこれなら私でも出来るかも、なんて思ったりしました。
Pugについての記事はこちら。
メインページ
メインページは『Verti』というテンプレートを使用しました。以下のページはテンプレートのデモページです。
Verti by HTML5 UP
こちらはHTML5UPにて公開されているテンプレートです。HTML5UPについては以前書きましたので、そちらをご覧ください。
ログイン機能の実装
こちらの記事が大変参考になりました。
SSLにて保護している場合のセッション認証の方法を参考に今回のスタイルに合わせました。
最後に
実際に作ったページはお見せできませんが、割と見た目の良いホームページができました。
毎日2時間程度の空き時間に少しずつ進めて、3日で終わりました。テンプレートを使うと本当に手早くできますね。
ということで、今回はここまで。
この内容、誰かの役に立つのかな?笑
ではまた。