リアルタイム性を追求した簡易版 SNS

アプリケーション概要資料(概要説明/UML 図/データベース定義書)

Transcript

1. 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 SMS アプリ「T-Room」 制作者：野口晋義
2. T-Room 1 目次 1 概要 2 2 開発環境 2 3 動作環境 2 4 掲示板概要 3 5 アプリ名 3 6 機能説明 4 7 新規登録画面 4 8 ログイン画面 5 9 タイムライン画面 6 10 投稿ページ 7 11 スレッド表示 8 12 資料 9 13 クラス図 9 14 ユースケース図 10 15 シーケンス図 11 16 データベース定義書 12 17 制作を終えた感想 エラー! ブックマークが定義されていません。 18 よかった点 エラー! ブックマークが定義されていません。 19 反省点 エラー! ブックマークが定義されていません。 20 21 22 23
3. T-Room 2 プロジェクト概要 1 2 3 制作経緯・ソースコード 4 コロナ渦でリモート授業が多くなり、先輩後輩の交流機会・他学科との交流機会の損失に 5 問題を感じていました。その中、在籍校の学生限定 SNS の開発を試みました。 6 Twitter のようなリアルタイム性の高い SNS を作ることで、学科や学年の枠組み 7 を超えて交流が生まれ、クリエイティブ感覚を養うきっかけになる考えました。 8 9 本開発物の GitHub: https://github.com/kn21304024/tRoom.git 10 11 12 13 開発環境 14 OS : Windows10 15 言語 :Java1.8.0_241・JavaScript 16 データベース :Oracle Database 12c 17 サーバー :Tomcat8.5 18 19 動作環境 20 ・Google chrome バージョン: 98.0.4758.102（Official Build） （64 ビット） 21 22
4. T-Room 3 SNS 機能概要 1 新規ユーザー登録、ログイン、ログアウト、スレッドの作成、投稿されたスレッドの閲覧 2 他ユーザーの投稿へのリアクションができます。 3 東京テクニカルカレッジ専用のメールアドレスでしかログインできないようになっています。 4 5 6 7 8 9 10 11 12 13 14 アプリ名 15 16 【T-Room】 17 18 [由来] 19 専門学校東京テクニカルカレッジの学生専用の掲示板にしたいと考えていたので、 20 学生が交流する空間という意味で Room と名付け 21 テクニカルカレッジの頭文字から T を取り T-Room となりました。 22
5. T-Room 4 機能説明 1 新規登録画面 2 3 4 ・新規登録画面では名前、メールアドレス、パスワードをそれぞれ入力し、登録ボタンを押すとユー 5 ザー情報が登録できます。登録に成功した場合ログイン画面に移動します。 6 各入力欄に空白があると、エラーメッセージを飛ばします。 7 メールは東京テクニカルカレッジ専用のメールアドレスしか登録できないようになっており、それ以 8 外のメールアドレスの場合エラーメッセージを飛ばします。判定は、 「@ga.ttc.ac.jp」が語尾にある 9 かどうかで判定しています。 10 パスワードは 6 文字以上入力しないと登録できないようになっており、6 文字以下の場合エラーメッ 11 セージを飛ばします。 12 SQL インジェクション対策もしています。 13 14
6. T-Room 5 ログイン画面 1 ・ログイン画面では新規登録画面で登録したユーザー情報を入力することにより、ログインができま 2 す。ログインに成功した場合タイムライン画面に飛びます。 3 各入力欄に空白があるとエラーメッセージを飛ばします。 4 メールアドレス、またはパスワードが間違えていた場合、エラーメッセージを飛ばします。 5 6 7 8
7. T-Room 6 タイムライン画面 1 2 タイムライン画面では投稿されたスレッドを閲覧、ログアウトができます。 3 投稿されたスレッドは 10 秒ごとに更新されていくようになっております。 4 また上下スクロールで更新されるようになっております。 5 6 ログアウトボタンを押すと、今あるセッションを破棄しログアウトしています。そしてログイン画面 7 に移動します。 8 新規投稿ボタンを押すことで、新規投稿画面に移動します。 9 10
8. T-Room 7 投稿ページ 1 2 投稿画面では、カテゴリーから該当するカテゴリーの選択、タイトル、内容を入力することができま 3 す。 4 タイトルが空白の場合エラーメッセージを飛ばします。 5 投稿を押すと、新しいスレッドが生成されて、タイムライン画面に反映されます。 6 7 8 9 10 11 12 13 14
9. T-Room 8 1 スレッド表示 2 3 タイムラインに投稿されているスレッドを選択すると、投稿者名、投稿タイトル、カテゴリー、何時 4 間前に投稿されたか、投稿内容を閲覧することができます。 5 ×のボタンを押すとタイムライン画面に戻ります。 6 7 リアクション機能も追加しました 8
10. T-Room 9 資料 1 クラス図 2 3
11. T-Room 10 1 ユースケース図 2 3 4
12. T-Room 11 1 シーケンス図 2 3 4
13. T-Room 12 1 データベース定義書 2 3 4
14. T-Room 13 現時点での所感 1 2 工夫した点 3 4 ・Ajax 通信を用いてリアルタイム性を追求 5 ・操作しやすい UI 6 7 8 9 今後の展望 10 11 ・カテゴリー別のソート表示・検索アルゴリズムの搭載 12 ・レコメンド機能・シングルサインオン機能の搭載 13 ・現在搭載している機能を元に肉付けを行い、機能を追加し 3 か月後のリリースを 14 目標に開発を継続する。 15 16 17