情 報 文 化 演 習 山 本 昌 弘 教 授 2010 年 1 月 29 日 ( 金 ) 国 際 文 化 学 部 国 際 文 化 学 科 06G0318 藤 嶋 恵 里 奈 卒 業 制 作 論 文 エクセルシオールカフェ 池 袋 2 丁 目 店 BBS 1 / 43
目 次 1. 制 作 動 機 価 値... 3 2. 開 発 環 境... 5 2-1.PHP とは... 5 2-2.Apache とは... 7 3. システムの 概 要 と 主 な 機 能... 8 3-1.ログイン 画 面... 8 3-1-1.ログイン 認 証 システム... 8 3-1-2.エクセルシールカフェ 公 式 ホームページ...12 3-2.トップ 画 面...13 3-3. 掲 示 板...15 3-4.みんなのカレンダー...20 3-4-1 WRITE...20 3-4-2 SEARCH...24 3-5.フォトアルバム...27 3-5-1 閲 覧...27 3-5-2 管 理 人 による 写 真 投 稿...29 3-6. 投 票...35 3-7.シフトの 下 書 き...38 4. 終 わりに( 感 想 反 省 課 題 謝 辞 )...43 5. 参 考 文 献 URL...43 2 / 43
1. 制 作 動 機 価 値 システムの 制 作 動 機 意 義 私 がゼミの 卒 業 制 作 物 を 考 案 する 際 の 前 提 条 件 は システムにあまり 詳 しくない 私 自 身 が 楽 しみながら 作 れること 結 果 としてシステムの 勉 強 に 繋 がること 他 者 の 役 に 立 てるシステム 作 り の3 点 であった 自 分 自 身 の 性 格 と 先 輩 方 の 助 言 を 参 考 にして 身 近 な 環 境 にあり 好 きなこと といった 観 点 から 私 自 身 のアルバイト 先 の 電 子 掲 示 板 を 作 ろうと 思 い 浮 かべた そしてアルバイトで 働 いてきた 問 題 点 が 解 決 できるようなシステム 作 りを 目 指 した システムの 課 題 として 考 えられるのは 1シフト 帳 及 び 連 絡 ノートの 電 子 化 2スタッフ 同 士 のイベント 告 知 を 可 能 にする なぜこの2 点 が 課 題 なのか 1 私 が 働 いているカフェでは 希 望 シフト 制 であり そのシフトは 紙 に 印 刷 されて 発 表 され ている 私 は 大 学 のテスト 週 間 などで 2 週 間 ほど 休 みをもらった 後 などに 次 の 働 くシフトは いつだろう とはるばる1 時 間 かけて 発 表 されたシフトをわざわざ 見 に 行 かなければならないことがあった 定 期 的 に 働 いているスタッフももちろんいて そのスタッフに 聞 くことも 可 能 である しかし 私 の 性 格 上 そのような 行 動 は 慎 んでいた 発 表 されたシフトが 家 で 見 ることが 出 来 たら と 考 えることがあった 3 / 43
また 店 長 からの 新 商 品 等 の 連 絡 事 項 は 紙 のノートで 行 っていた これは 勤 務 前 に 必 ず 読 むことが 義 務 付 けられている 上 に 記 したように 長 期 で 休 んでしまった 後 にはノートへの 書 き 込 みも 多 く 家 で 連 絡 ノートが 見 られたらいいと 考 えていた 2 私 が 働 いているカフェにバレエダンサーや バンド 活 動 をしているスタッフがいる 彼 らは 年 に 何 度 かイベントを 行 っている こうしたイベントに 何 度 か 応 援 にいったことがあった イベント 告 知 などがスムーズに 行 えたら 便 利 になると 考 えていた 課 題 が 解 決 されると(システムの 意 義 ) 1のシフト 帳 及 び 連 絡 ノートの 電 子 化 を 可 能 にさせることによって わざわざアルバイト 先 にシフトを 確 認 しに 行 き 連 絡 ノートがたまっているからという 理 由 で 早 く 出 勤 する 必 要 がなくなり 時 間 の 有 効 活 用 が 図 れる 2のスタッフ 同 士 のイベント 告 知 を 可 能 にすることによって スタッフ 間 の 交 流 が 盛 んになり チームワークとしての 絆 が 深 まる お 店 の 運 営 には 何 よりチームワーク スタッフ 同 士 の 信 頼 関 係 が 必 要 である スタッフの 交 流 を 深 められるようなサイトにしたい このためシステムのターゲットはアルバイトのスタッフに 限 定 した そして 最 終 目 標 として 売 り 上 げ 貢 献 に 結 びつくようなサイトにしていきたい こうして エクセルシオールカフェ 池 袋 2 丁 目 店 BBS の 制 作 が 決 定 した 4 / 43
2. 開 発 環 境 2-1.PHP とは 2-2.Apache とは 2-1.PHP とは 正 式 名 称 は PHP: Hypertext Preprocessor であるが 一 般 的 に PHP と 省 略 して 用 いられる この PHP とは Personal Home Page Tools の 頭 文 字 に 由 来 する PHP : Hypertext Preprocessor(ピー エイチ ピー : ハイパーテキストプリプロセッサ ー)とは 動 的 に HTML データを 生 成 することによって 動 的 なウェブページを 実 現 する ことを 目 的 としたプログラミング 言 語 およびその 言 語 処 理 系 である 動 的 に Web ページを 生 成 する Web サーバの 拡 張 機 能 の 一 つ また そこで 使 われるスクリ プト 言 語 レイアウトの 雛 型 となる HTML ファイル 内 に 処 理 内 容 を 記 述 したスクリ プトを 埋 め 込 み 処 理 結 果 に 応 じて 動 的 に 文 書 を 生 成 し 送 出 することができる 正 式 名 称 の PHP : Hypertext Preprocessor にもあるように 動 的 に 生 成 されるページの 作 成 に 向 いている また XML のサポートや 各 種 データベースとの 連 携 に 優 れている 点 などから 近 年 普 及 しつつある プログラムの 表 記 法 は C 言 語, Java, Perl の 各 言 語 から 転 用 したもの がベースとなっているが PHP 独 自 のものもある 言 語 使 用 やプログラムはオープンソー スソフトウェアとして 無 償 で 入 手 することができる PHP は HTML 埋 め 込 み 型 のサーバサイド スクリプト 言 語 として 分 類 される この 言 語 処 理 系 自 体 は C 言 語 で 記 述 されている ウェブサーバ 上 で 動 作 し ウェブサーバ 上 の 文 書 が 要 求 されるたびに この 文 書 に 記 述 さ れた PHP のプログラムを 実 行 し その 結 果 をウェブブラウザに 対 して 送 信 する ウェブブラウザに 送 信 されるデータは 通 常 の HTML であり PHP のプログラムを 含 まな い この 点 で HTML 埋 め 込 み 型 のクライアントサイド スクリプト 言 語 (JavaScript)と 本 質 的 に 異 なっている 平 易 な 文 法 のため 初 心 者 でも 習 得 しやすく また 大 規 模 な 開 発 にも 多 く 用 いられている 多 くのフレームワークやライブラリが 存 在 し 開 発 の 手 助 けとなっている 数 多 くのオープンソースウェブアプリケーションに 利 用 されている 一 方 しばしば 脆 弱 性 の 報 告 がなされ 過 去 に 深 刻 なセキュリティホールが 何 度 か 報 告 されている 5 / 43
PHP は Common Gateway Interface(CGI)をサポートしており CGI をサポートする Web サーバ 上 で PHP スクリプトを 実 行 することができる この 他 にも FastCGI を 通 じて Web サーバから 起 動 したり 利 用 する Web サーバがモジュール 機 構 を 提 供 していれば モ ジュールとして Web サーバに 組 み 込 んだ 状 態 で 動 作 させることが 可 能 である その 為 PHP モジュールに 脆 弱 性 があった 場 合 簡 単 に Web サーバの 権 限 を 奪 取 され サーバを 破 壊 さ れることもある PHP は PHP4 以 降 Zend Engine をスクリプト 言 語 を 処 理 するエンジンとして 利 用 してい る Zend Engine は PHP3 の 開 発 者 によって 設 立 された Zend Technologies Ltd.により 開 発 されたソースコードが 公 開 されているスクリプティングエンジンで PHP5 では Zend Engine2.0 になった Zend Engine は 基 本 的 に1つのプロセスがインタプリタのコンテキ ストを1つだけ 持 つものとして 設 計 されている したがってマルチスレッドを 用 いたスク リプティングはサポートしていない Zend Engine を 除 く PHP 本 体 は PHP 組 み 込 み 関 数 の 実 装 を 含 むほか Web サーバやコ マンドラインインターフェイスとスクリプティングエンジンの 間 を 仲 介 する SAPI(Server API)レイヤ マルチスレッドで 動 く Web サーバのモジュールとして 利 用 される 場 合 にグ ローバル 変 数 のセマンティクスを 提 供 する TSRM(Thread Safe Resource Manager) さま ざまなプラットフォームの 入 出 力 機 構 や API の 差 異 を 吸 収 するための Streams レイヤから 成 る 開 発 者 は SAPI の 提 供 する SPI を 実 装 することで さまざまな Web サーバのモジュールと して PHP を 動 作 させることができる 標 準 では 以 下 の Web サーバ 用 の SAPI が 提 供 され ている 6 / 43
2-2.Apache とは 最 も 人 気 の 高 い Web サーバソフトウェアの 一 つ 1995 年 に NCSA httpd 1.3 をベー スに 開 発 が 始 まり UNIX 系 OS を 中 心 に 幅 広 い 人 気 を 獲 得 した Apache はフリーソフトウェアとして 無 償 で 公 開 され 世 界 中 のボランティアのプログラマ たちの 手 によって 長 年 に 渡 って 開 発 が 続 けられている もともと NCSA httpd の 細 かいバ グを 修 正 したり 新 しい 機 能 を 追 加 するためのパッチ(Patch) 集 として 公 開 されていたが 途 中 から 単 体 の Web サーバソフトとして 公 開 された 7 / 43
3. システムの 概 要 と 主 な 機 能 3-1.ログイン 画 面 3-2.トップ 画 面 3-3. 掲 示 板 3-4.みんなのカレンダー 3-5.フォトアルバム 3-6. 投 票 3-7.シフトの 下 書 き 3-1.ログイン 画 面 3-1-1.ログイン 認 証 システム 3-1-2.エクセルシオールカフェ 公 式 ホームページ 3-1 ログイン 画 面 ログイン 画 面 では ログインページ と エクセルシオールカフェ 公 式 ホームページ へ の 二 つのリンクが 表 示 される 8 / 43
3-1-1.ログイン 認 証 システム- 失 敗 例 成 功 例 3-1-1.ログイン 認 証 システム 画 面 ID とパスワードを 使 ってログインができる ID とパスワードを 間 違 えてしまうと 3-1-1.ログイン 失 敗 画 面 このような 画 面 が 表 示 される 9 / 43
登 録 通 りの ID とパスワードを 入 力 することで 3-1-1.ログイン 成 功 例 この Top 画 面 のリンクがあるページへと 進 むことができる Top ページの 説 明 は3-2で 行 う 3-1-1.ログイン 認 証 のソースコード 10 / 43
解 説 d_file.dat にファイルを 指 定 ;ここにID パスワードがある echo print 28 $p_flag>0 値 が 取 れたので 先 に 進 める おめでとうございます 31 else 値 が 取 れないのでやり 直 し 11 / 43
3-1-2.エクセルシールカフェ 公 式 ホームページ ここで 公 式 ホームページを 設 けたのは 新 商 品 の 確 認 などを 行 うためである 12 / 43
3-2.トップ 画 面 3-2.トップ 画 面 ログイン 認 証 に 成 功 すると このような Top ページに 移 動 する 機 能 は 大 きく 分 けて 5 種 類 掲 示 板 機 能 カレンダー 機 能 アルバム 機 能 投 票 機 能 個 人 のスケジュール 機 能 の5つである 各 々の 項 目 の 説 明 は3-3 以 降 で 行 う またこのTOPページに 現 在 の 日 時 が 表 示 されるようにした 3-2. 現 在 の 日 時 ソースコードの 表 示 13 / 43
<?php $nowdate = getdate();?> <p> 現 在 の 日 時 :<? printf("%04d/%02d/%02d %02d:%02d:%02d",$nowdate[year], $nowdate[mon],$nowdate[mday],$nowdate[hours],$nowdate[minutes],$nowdate[second s]);?> 14 / 43
3-3. 掲 示 板 3-3. 掲 示 板 画 面 この 掲 示 板 は アルバイト 同 士 の 情 報 交 換 及 びシフトの 代 わり 探 し 等 を 目 的 に 作 った 新 規 投 稿 のボタンをクリックすると 15 / 43
3-3. 新 規 投 稿 画 面 このような 画 面 が 表 示 される ここで 投 稿 者 が 任 意 で 名 前 タイトル 削 除 キーを 入 力 し メッセージを 投 稿 することに なる 投 稿 したメッセージに 削 除 と コメント 機 能 もつけた なお 削 除 にはパスワードが 必 要 になる 16 / 43
3-3. 削 除 コメントボタン 画 面 3-3. 削 除 画 面 正 式 なパスワードを 入 力 することで 投 稿 したメッセージが 削 除 される 17 / 43
次 にコメント 機 能 の 説 明 をする 投 稿 に 対 してコメントをしたい 場 合 は コメント ボタンを 押 すと 3-3. 記 事 へのコメント 画 面 このような 画 面 が 表 示 される コメントを 投 稿 すると 18 / 43
3-3.コメント 完 了 画 面 このように 書 き 込 みのすぐ 下 に 表 示 される 19 / 43
3-4.みんなのカレンダー 3-4-1 WRITE 3-4-2 SEARCH このカレンダー 機 能 は アルバイトの 仲 間 同 士 で 情 報 を 共 有 する 目 的 アルバイトの 仲 間 の 誕 生 日 などの 記 念 日 をみんなでお 祝 いしたい =>チームワークの 向 上 といった 目 的 で 作 成 した 3-4-1 WRITE 3-4-1.カレンダーTOP 画 面 画 面 の WRITE ボタンを 押 すと 20 / 43
3-4-1. 記 念 日 の 登 録 画 面 このような 画 面 が 表 示 される このページでは 誰 の 記 念 日 をお 祝 いしたいのか お 祝 いしたい 人 の 生 年 月 日 記 念 日 の 種 類 メッセージ 投 稿 者 の 名 前 パスワード を 記 入 する 登 録 が 完 了 すると 21 / 43
3-4-1. 記 念 日 登 録 完 了 画 面 この 画 面 になる 尚 書 き 込 みはログ 保 存 用 ファイルに 保 存 される ソースコード 表 示 22 / 43
23 / 43
3-4-2 SEARCH ここではSEARCH 機 能 の 説 明 をしていく 3-4-2.カレンダーSEARCH 画 面 1のSEARCHボタンをクリックし 2でキーワード 検 索 をすることができる ここでは 先 ほど 登 録 したばかりのリーダーの 誕 生 日 を 検 索 してみると 24 / 43
3-4-2.SEARCH 完 了 画 面 このように 表 示 される ソースコードの 表 示 25 / 43
26 / 43
3-5.フォトアルバム 3-5-1. 閲 覧 3-5-2. 管 理 人 による 写 真 投 稿 次 にフォトアルバム 機 能 の 説 明 に 入 る まずはじめに 私 がこのサイトにフォトアルバム 機 能 を 設 けた 理 由 は アルバイト 仲 間 の 思 い 出 の 共 有 によるチームワークの 向 上 である 3-5-1 閲 覧 3-5-1.アルバム TOP 画 面 アルバムをクリックすると 27 / 43
3-5-1.アルバム 内 部 画 面 このように アルバム 内 の 写 真 閲 覧 ができる 28 / 43
3-5-2 管 理 人 による 写 真 投 稿 3-5-2.アルバム 投 稿 / 管 理 人 ログイン 画 面 ログインボタンをクリックすると IDとパスワード 認 証 ページが 開 かれる 29 / 43
3-5-2.アルバム 管 理 人 ログインページ IDとパスワードが 一 致 すると 3-5-2.アルバム 管 理 人 画 面 30 / 43
新 規 アルバムの 作 成 写 真 の 登 録 や 編 集 ができるページにうつる アルバムに 新 しい 写 真 を 投 稿 するには 3-5-2.アルバム 写 真 一 覧 へ 画 面 右 側 の 写 真 一 覧 ボタンをクリックする すると 31 / 43
3-5-2.アルバム 内 部 画 面 このように 登 録 した 写 真 がみられる 3-5-2. 写 真 の 登 録 へ 32 / 43
そして 画 面 右 側 の 写 真 の 登 録 をクリックする 3-5-2. 写 真 の 登 録 画 面 ここで 写 真 のタイトル コメント 登 録 画 像 を 投 稿 する 新 規 投 稿 をクリックすると 33 / 43
3-5-2. 写 真 登 録 完 了 画 面 このように 一 番 上 に 新 しく 写 真 が 追 加 されている ソースコード 表 示 34 / 43
3-6. 投 票 この 投 票 機 能 は アルバイト 仲 間 の 遊 び 場 的 な 要 素 で 取 り 込 んだ 3-6. 投 票 TOP 画 面 ここは 一 番 好 きなドリンク というテーマにそって 投 票 を 行 うことができる 場 所 であ る 投 票 する あるいは 投 票 結 果 をみる をクリックすると 35 / 43
3-6. 投 票 結 果 画 面 このような 画 面 が 表 示 される 順 位 投 票 項 目 投 票 理 由 得 票 数 が 表 示 される また 管 理 者 パスワードを 登 録 すると 36 / 43
3-6. 投 票 管 理 人 画 面 項 目 追 加 項 目 削 除 項 目 修 正 理 由 削 除 が 行 える 特 記 事 項 はないので 説 明 は 省 略 する 37 / 43
3-7.シフトの 下 書 き 最 後 にシフトの 下 書 き 機 能 の 説 明 に 入 る 皆 で 共 有 できるカレンダー 機 能 のほかに シフトを 提 出 した 際 に データとして 残 せたら 便 利 であろう という 気 持 ちからこの 機 能 を 導 入 した 管 理 人 のみが 閲 覧 編 集 できるように ユーザー 認 証 とパスワードを 設 置 した 3-7.シフト 下 書 きログイン 画 面 ユーザー 認 証 とパスワードが 一 致 すると 38 / 43
3-7.シフト 下 書 き TOP 画 面 このページにうつる たとえば 2 月 のシフトの 下 書 きを 入 力 するとする 39 / 43
3-7.シフト 下 書 き 次 の 月 へ 画 面 右 上 にある 次 の 月 へ をクリックする すると 2010 年 2 月 のページに 移 動 する 日 にちをクリックして シフトの 下 書 きとして 入 力 する 40 / 43
3-7.シフトの 下 書 き 登 録 画 面 画 面 右 下 の 登 録 ボタンをクリックすると 41 / 43
3-7.シフトの 下 書 き 登 録 完 了 画 面 このように 登 録 される 登 録 の 際 に 文 字 色 などを 変 更 することも 可 能 である 尚 登 録 されたスケジュールは 別 のファイルに 保 存 される ソースコード 表 示 42 / 43
4. 終 わりに( 感 想 反 省 課 題 謝 辞 ) 二 年 間 山 本 昌 弘 教 授 の 下 でシステムとプログラミングについて 学 べたことは とても 貴 重 な 経 験 であったと 思 う このゼミを 通 じて 一 つの 作 品 を 作 る 難 しさと 同 時 にシステムが 動 くことの 喜 びを 味 わう ことができた 作 品 に 関 しては 当 初 の 予 定 と 変 わってしまった 部 分 があることが 残 念 だ 当 初 のシフトを 家 で 見 ることが 出 来 たら という 思 いは 叶 わなかった 原 因 の 一 つとして やはりエクセルシオールカフェがチェーン 店 であることが 考 えられる 連 絡 ノートの 改 善 点 として 制 作 途 中 でメーリングリストが 出 来 てしまったこと 結 果 として 店 の 運 営 が 便 利 になったことである この 作 品 づくりを 通 じて 作 品 を 残 せた 喜 びは 忘 れることができません 作 品 が 残 せたこと 山 本 先 生 に 数 多 くの 助 言 やご 指 導 をいただき 本 当 に 感 謝 しています 5. 参 考 文 献 URL 本 当 に 使 える PHP 厳 選 Web アプリケーション 集 著 者 :TMS 発 行 :LOCUS 初 心 者 のための 簡 単 HTML http://saru-html.pupu.jp/ PHP pro http://www.phppro.jp/qa/97 43 / 43