フレンド申請機能つき掲示板

目的

springbootの機能を一通り学習するために作ったアプリケーションになります。

作成した機能

• ログイン機能
• 投稿機能
• 投稿に基づいたコメント機能
• フレンド申請機能

インストール方法

1. git cloneする
2. Eclipseにプロジェクトをインポートする。
3. DBを作成する。
4. アプリのDB接続設定を確認する。
5. Eclipseでプロジェクトを起動する。

設計

使用した技術、及び実行環境は以下になります。

##　実行環境

• OS : macOS version 13.3.1(a)
• IDE : Eclipse 2022-12
• Java : 17
• SpringBoot : 3.0.4
• MySQL : 8.0.33

DB設計

パッケージ構成図

src
└─main
    ├─java
    │   └─com
    │       └─example
    │           └─eg_sns
    │               ├─controller      # コントローラクラスの管理。
    │               ├─core            # コアクラスの管理。アプリ基底処理及び、設定に関する処理のプログラム群。    
    │               │   └─annotation
    │               ├─dto             # DTOクラスの管理。入力フォーム関連。    
    │               ├─entity          # DBエンティティクラスの管理。
    │               ├─repository      # DBアクセスリポジトリ。
    │               ├─service         # リポジトリをラップしたサービスクラス等。他、必要に応じて外部連携等コンポーネント管理。
    │               └─util            # ユーティリティクラスの管理。
    │                 
    └─resources
        ├─static                          # 静的ファイル。js、css等。
        │   └─assets
        └─templates                       # テンプレートファイル。
            ├─account
            ├─common
            ├─error
            ├─home
            ├─login
            └─profile

画面説明

ログイン画面

ログイン画面です。

• ログインID、パスワードを入力しログインします。
• ログインID、パスワードは必須入力です。

• ログインID、パスワードを入力しなかった場合、jsでバリデーションを行いエラーとします。

• HTMLの改ざんを考慮し、jsのバリデーションを改ざんされた場合、サーバサイドでバリデーションを行います。

アカウント作成画面

アカウント作成画面です。

• 「お名前」「ログインID」「パスワード」を入力し、ログインします。
• 「お名前」「ログインID」「パスワード」は必須入力です。

• 「お名前」「ログインID」「パスワード」を入力しなかった場合、jsでバリデーションを行いエラーとします。

• HTMLの改ざんを考慮し、jsのバリデーションを改ざんされた場合、サーバサイドでバリデーションを行います。

• 正常に入力が行われた場合、完了画面へ遷移しアカウントが登録されます。

ホーム画面

投稿画面

投稿画面です。

• 「タイトル」「本文」を入力し「写真」を選択し、投稿します。

• 「タイトル」「本文」を入力しなかった場合、また「写真」を選択しなかった場合、jsでバリデーションを行いエラーとします。

• 投稿に成功した際、ホーム画面に遷移し、フラッシュメッセージを表示します。

コメント画面

投稿にコメントをする画面です。

• 「コメント」を入力します。

• 「コメント」を入力しなかった場合、jsでバリデーションを行いエラーとします。

• HTMLの改ざんを考慮し、jsのバリデーションを改ざんされた場合、サーバサイドでバリデーションを行います。

プロフィール画面

プロフィール画面になります。ログインしているユーザー自身のプロフィール画面の場合、プロフィールやパスワードを変更できます。

• プロフィール編集画面になります。

• 「お名前」「メールアドレス」を入力しなかった場合、jsでバリデーションを行いエラーとします。

• パスワード編集画面になります。

「現在のパスワード」「新しいパスワード」を入力しなかった場合、jsでバリデーションを行いエラーとします。

フレンド申請画面

• 他のユーザーのプロフィール画面の場合右上の 「友達申請」のボタンを押すと友達申請できます。

• 友達申請はキャンセルすることも可能です。

errorページ画面

ページが存在しない、システム内で不具合が発生した場合のエラー画面を提供します。

• システムの不具合等により、予期せぬ例外が発生した場合表示します。

• 遷移したページが見つからなかった場合に表示されるページです。