Spring BootとVue.jsで構築する漢方薬膳サービスシステム

1. システム概要

本システムは、Java言語、Spring Bootフレームワークをバックエンドに、Vue.jsをフロントエンドに採用し、MySQLデータベースを用いてデータ管理を行うWebサービスプラットフォームです。ユーザーフレンドリーなインターフェースはAJAX技術を活用して構築されています。開発はIntelliJ IDEAなどの統合開発環境で行われ、Tomcatサーバーを通じて情報のやり取りが実現されます。本システムは、一般ユーザーと管理者という二つの主要な役割をサポートします。

  • 一般ユーザー: アカウント登録、情報の閲覧、メッセージの送信などの機能を利用できます。
  • 管理者: ユーザー情報の管理、新しいニュースや記事の公開、薬方情報、記事、記事タイプの管理など、システム全体の運営に関わる権限を行使します。

近年、情報化管理の進展は人々の日常生活においてコンピューターとインターネット技術の重要性を高めています。本プラットフォームは、漢方薬膳に関する情報提供と管理を効率化することを目的としています。主要な機能モジュールは、要件分析に基づき設計され、データベース設計を通じて関連データがMySQLに格納されます。開発プロセスでは、IDEAやAJAX技術などのツールを活用し、機能モジュールが実装されます。システムは機能テストを通じて継続的に改善され、安全かつ便利な情報管理環境を提供します。

2. データベース設計

本システムは、リレーショナルデータベースとしてMySQLを採用し、関連する全ての情報を管理します。概念データモデルからリレーショナルモデルへの変換を行う論理設計段階は、データベース全体の設計において極めて重要です。この段階で、システムに必要なデータ構造がテーブル形式で定義され、開発者はデータの最適化と管理を効率的に行えるようになります。ユーザーがシステムを通じて操作を行う際、関連するデータテーブルは動的に更新され、情報の整合性が保たれます。

3. 主要機能

システムは、役割に応じた様々な機能を提供します。

3.1 管理者機能

管理者は、専用のログインインターフェースを通じてシステムにアクセスし、以下の管理機能を利用できます。

  • 薬方管理: 薬方情報の閲覧、追加、編集、削除を行います。
  • 記事管理: 新しい記事の公開、既存の記事の編集や削除、記事詳細の確認を行います。
  • 記事タイプ管理: 記事の分類に使用されるタイプ(カテゴリ)の追加、編集、削除、閲覧を行います。
  • ユーザー管理: 一般ユーザーのアカウント情報の管理を行います。

これにより、管理者はプラットフォーム上のコンテンツとユーザーを包括的に管理できます。

3.2 一般ユーザー機能

一般ユーザーは、以下の機能を通じてプラットフォームの情報を活用できます。

  • アカウント登録・ログイン: プラットフォームのパーソナライズされたサービスを利用するためのアカウントを作成し、ログインします。
  • 情報閲覧: 漢方薬膳に関する薬方情報や記事を閲覧します。
  • メッセージ送信: プラットフォーム管理者や他のユーザーと情報を交換するためのメッセージ機能を活用します。

4. バックエンドAPIコード例

以下に、Spring BootとSpring Data JPAを用いたバックエンドのRESTful APIの主要な操作例を示します。ここでは、AppUserというユーザーエンティティを例にとります。

4.1 ユーザーエンティティ定義

import javax.persistence.*; // Spring Boot 3+ではjakarta.persistence.* を使用
import java.io.Serializable;

@Entity
@Table(name = "app_users")
public class AppUser implements Serializable {

    @Id
    @GeneratedValue(strategy = GenerationType.IDENTITY)
    private Long id;

    @Column(unique = true, nullable = false)
    private String username;

    @Column(nullable = false)
    private String password;

    // コンストラクタ
    public AppUser() {}

    public AppUser(String username, String password) {
        this.username = username;
        this.password = password;
    }

    // ゲッターとセッター
    public Long getId() { return id; }
    public void setId(Long id) { this.id = id; }
    public String getUsername() { return username; }
    public void setUsername(String username) { this.username = username; }
    public String getPassword() { return password; }
    public void setPassword(String password) { this.password = password; }

    @Override
    public String toString() {
        return "AppUser{id=" + id + ", username='" + username + "'}";
    }
}

4.2 ユーザーリポジトリインターフェース

import org.springframework.data.jpa.repository.JpaRepository;
import java.util.List;
import java.util.Optional;

public interface AppUserRepository extends JpaRepository<AppUser, Long> {
    // ユーザー名でユーザーを検索
    Optional<AppUser> findByUsername(String username);

    // ユーザー名の一部でユーザーリストを検索
    List<AppUser> findByUsernameContainingIgnoreCase(String username);
}

4.3 ユーザーコントローラー

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.http.HttpStatus;
import org.springframework.http.ResponseEntity;
import org.springframework.web.bind.annotation.*;

import java.util.List;
import java.util.Optional;

@RestController
@RequestMapping("/api/users")
public class AppUserController {

    @Autowired
    private AppUserRepository userRepository;

    /**
     * 全てのユーザー、またはユーザー名でフィルタリングされたユーザーを取得します。
     * GET /api/users?username=test
     * @param username オプションのユーザー名フィルタ
     * @return ユーザーリストを含むレスポンスエンティティ
     */
    @GetMapping
    public ResponseEntity<List<AppUser>> retrieveUsers(@RequestParam(required = false) String username) {
        List<AppUser> users;
        if (username != null && !username.isEmpty()) {
            users = userRepository.findByUsernameContainingIgnoreCase(username);
        } else {
            users = userRepository.findAll();
        }
        return ResponseEntity.ok(users);
    }

    /**
     * 新しいユーザーを作成します。
     * POST /api/users
     * @param newUser 作成するユーザーデータ
     * @return 作成されたユーザーを含むレスポンスエンティティ、またはエラー
     */
    @PostMapping
    public ResponseEntity<?> registerUser(@RequestBody AppUser newUser) {
        if (userRepository.findByUsername(newUser.getUsername()).isPresent()) {
            return ResponseEntity.status(HttpStatus.CONFLICT)
                                 .body("指定されたユーザー名は既に存在します。");
        }
        AppUser savedUser = userRepository.save(newUser);
        return ResponseEntity.status(HttpStatus.CREATED).body(savedUser);
    }

    /**
     * 既存のユーザーをIDで削除します。
     * DELETE /api/users/{id}
     * @param id 削除するユーザーのID
     * @return ステータス204 (No Content)
     */
    @DeleteMapping("/{id}")
    public ResponseEntity<Void> removeUser(@PathVariable Long id) {
        if (!userRepository.existsById(id)) {
            return ResponseEntity.notFound().build();
        }
        userRepository.deleteById(id);
        return ResponseEntity.noContent().build();
    }

    /**
     * 複数のユーザーをIDリストで一括削除します。
     * DELETE /api/users/batch-delete
     * @param userIds 削除するユーザーのIDリスト
     * @return ステータス204 (No Content)
     */
    @DeleteMapping("/batch-delete")
    public ResponseEntity<Void> removeMultipleUsers(@RequestBody List<Long> userIds) {
        userRepository.deleteAllById(userIds);
        return ResponseEntity.noContent().build();
    }
}

タグ: Java Spring Boot vue.js MySQL REST API

5月23日 11:59 投稿