# dodoododo/pbl3-japanese-dictionary architecture

> Architecture diagram of the GitHub repository dodoododo/pbl3-japanese-dictionary, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-09-26). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/dodoododo/pbl3-japanese-dictionary
- Repository: https://github.com/dodoododo/pbl3-japanese-dictionary

## Overview

JapanEasy is a React/Spring Boot Japanese-English learning dictionary. Learners search words, inspect results, and can branch into JLPT study, kana practice, games, saved words, and flashcards; accounts and administration support personalization and content management. The sampled code confirms the app’s word-search and popular-word requests, and the backend word, user, and saved-word service layers. Other capabilities are documented or routed in the frontend, but their specific API wiring is not sampled, so those links are left out.

Main entry points: [`JapanEasyDict/src/App.jsx`](https://github.com/dodoododo/pbl3-japanese-dictionary/blob/main/JapanEasyDict/src/App.jsx) (App router), [`JapanEasyDict/src/components/LoginFormComponents/LoginForm.jsx`](https://github.com/dodoododo/pbl3-japanese-dictionary/blob/main/JapanEasyDict/src/components/LoginFormComponents/LoginForm.jsx) (Login forms), [`JapanEasyDict/src/components/BookmarkComponents/BookmarkPage.jsx`](https://github.com/dodoododo/pbl3-japanese-dictionary/blob/main/JapanEasyDict/src/components/BookmarkComponents/BookmarkPage.jsx) (Saved words), [`JapanEasyDict/src/components/KanaComponents/Kana.jsx`](https://github.com/dodoododo/pbl3-japanese-dictionary/blob/main/JapanEasyDict/src/components/KanaComponents/Kana.jsx) (Kana practice)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_web["Web experience"]
  node_app["App router<br/>[App.jsx]"]
  node_search["Word results"]
  node_authui["Login forms<br/>[LoginForm.jsx]"]
  node_bookmarkui["Saved words<br/>[BookmarkPage.jsx]"]
  node_adminui["Admin tools<br/>[Admin.tsx]"]
end

subgraph group_learning["Study features"]
  node_jlpt["JLPT study<br/>[JLPTPage.jsx]"]
  node_kanji["Kanji levels<br/>[KanjiList.jsx]"]
  node_flashcards["Flashcards<br/>[FlashcardPage.jsx]"]
  node_kana["Kana practice<br/>[Kana.jsx]"]
  node_kana_data["Kana character data<br/>[hiragana.js]"]
  node_game["Kana matching game<br/>[DnDGame.jsx]"]
end

subgraph group_api["Dictionary API"]
  node_word_api["Word endpoints"]
  node_word_service["Word operations<br/>[WordService.java]"]
end

subgraph group_accounts["Accounts and saved words"]
  node_user_api["User endpoints"]
  node_user_service["Account operations<br/>[UserService.java]"]
  node_saved_api["Saved-word endpoints"]
  node_saved_service["Saved-word operations"]
end

subgraph group_data["Persistence"]
  node_word_repo["Word repository"]
  node_user_repo["User repository"]
  node_saved_repo["Saved-word repository"]
  node_sql[("SQL database")]
end

node_learner(("Learner"))

node_learner -->|"uses"| node_app
node_app -->|"renders results"| node_search
node_app -->|"opens login"| node_authui
node_app -->|"routes to"| node_bookmarkui
node_app -->|"routes to"| node_adminui
node_app -->|"routes to"| node_jlpt
node_app -->|"routes to"| node_kanji
node_app -->|"routes to"| node_flashcards
node_app -->|"routes to"| node_kana
node_app -->|"routes to"| node_game
node_kana -->|"displays characters"| node_kana_data
node_app -->|"fetches search and popular words"| node_word_api
node_word_api -->|"delegates"| node_word_service
node_word_service -->|"queries and saves"| node_word_repo
node_word_repo -->|"reads and writes"| node_sql
node_authui -->|"account requests"| node_user_api
node_user_api -->|"delegates"| node_user_service
node_user_service -->|"reads and saves"| node_user_repo
node_user_repo -->|"reads and writes"| node_sql
node_bookmarkui -->|"saved-word requests"| node_saved_api
node_saved_api -->|"delegates"| node_saved_service
node_saved_service -->|"reads and saves"| node_saved_repo
node_saved_repo -->|"reads and writes"| node_sql

click node_app "https://github.com/dodoododo/pbl3-japanese-dictionary/blob/main/JapanEasyDict/src/App.jsx"
click node_search "https://github.com/dodoododo/pbl3-japanese-dictionary/blob/main/JapanEasyDict/src/components/SearchResultsComponents/SearchResultNew.tsx"
click node_authui "https://github.com/dodoododo/pbl3-japanese-dictionary/blob/main/JapanEasyDict/src/components/LoginFormComponents/LoginForm.jsx"
click node_bookmarkui "https://github.com/dodoododo/pbl3-japanese-dictionary/blob/main/JapanEasyDict/src/components/BookmarkComponents/BookmarkPage.jsx"
click node_adminui "https://github.com/dodoododo/pbl3-japanese-dictionary/blob/main/JapanEasyDict/src/components/AdminComponents/Admin.tsx"
click node_jlpt "https://github.com/dodoododo/pbl3-japanese-dictionary/blob/main/JapanEasyDict/src/components/JLPTComponents/JLPTPage.jsx"
click node_kanji "https://github.com/dodoododo/pbl3-japanese-dictionary/blob/main/JapanEasyDict/src/components/JLPTComponents/KanjiList.jsx"
click node_flashcards "https://github.com/dodoododo/pbl3-japanese-dictionary/blob/main/JapanEasyDict/src/components/FlashCardComponents/FlashcardPage.jsx"
click node_kana "https://github.com/dodoododo/pbl3-japanese-dictionary/blob/main/JapanEasyDict/src/components/KanaComponents/Kana.jsx"
click node_kana_data "https://github.com/dodoododo/pbl3-japanese-dictionary/blob/main/JapanEasyDict/src/components/data/hiragana.js"
click node_game "https://github.com/dodoododo/pbl3-japanese-dictionary/blob/main/JapanEasyDict/src/components/views/DnDGame.jsx"
click node_word_api "https://github.com/dodoododo/pbl3-japanese-dictionary/blob/main/jp-dictionary-BE/src/main/java/com/jpdictionary/demo/controller/WordController.java"
click node_word_service "https://github.com/dodoododo/pbl3-japanese-dictionary/blob/main/jp-dictionary-BE/src/main/java/com/jpdictionary/demo/service/WordService.java"
click node_user_api "https://github.com/dodoododo/pbl3-japanese-dictionary/blob/main/jp-dictionary-BE/src/main/java/com/jpdictionary/demo/controller/UserController.java"
click node_user_service "https://github.com/dodoododo/pbl3-japanese-dictionary/blob/main/jp-dictionary-BE/src/main/java/com/jpdictionary/demo/service/UserService.java"
click node_saved_api "https://github.com/dodoododo/pbl3-japanese-dictionary/blob/main/jp-dictionary-BE/src/main/java/com/jpdictionary/demo/controller/SavedWordController.java"
click node_saved_service "https://github.com/dodoododo/pbl3-japanese-dictionary/blob/main/jp-dictionary-BE/src/main/java/com/jpdictionary/demo/service/SavedWordService.java"
click node_word_repo "https://github.com/dodoododo/pbl3-japanese-dictionary/blob/main/jp-dictionary-BE/src/main/java/com/jpdictionary/demo/repository/WordRepository.java"
click node_user_repo "https://github.com/dodoododo/pbl3-japanese-dictionary/blob/main/jp-dictionary-BE/src/main/java/com/jpdictionary/demo/repository/UserRepository.java"
click node_saved_repo "https://github.com/dodoododo/pbl3-japanese-dictionary/blob/main/jp-dictionary-BE/src/main/java/com/jpdictionary/demo/repository/SavedWordRepository.java"

classDef toneNeutral fill:#f8fafc,stroke:#334155,stroke-width:1.5px,color:#0f172a
classDef toneBlue fill:#dbeafe,stroke:#2563eb,stroke-width:1.5px,color:#172554
classDef toneAmber fill:#fef3c7,stroke:#d97706,stroke-width:1.5px,color:#78350f
classDef toneMint fill:#dcfce7,stroke:#16a34a,stroke-width:1.5px,color:#14532d
classDef toneRose fill:#ffe4e6,stroke:#e11d48,stroke-width:1.5px,color:#881337
classDef toneIndigo fill:#e0e7ff,stroke:#4f46e5,stroke-width:1.5px,color:#312e81
classDef toneTeal fill:#ccfbf1,stroke:#0f766e,stroke-width:1.5px,color:#134e4a
class node_app,node_search,node_authui,node_bookmarkui,node_adminui toneBlue
class node_jlpt,node_kanji,node_flashcards,node_kana,node_kana_data,node_game toneAmber
class node_word_api,node_word_service toneMint
class node_user_api,node_user_service,node_saved_api,node_saved_service toneRose
class node_word_repo,node_user_repo,node_saved_repo,node_sql,node_learner toneIndigo
```

## Components

### Web experience

- [App router](https://github.com/dodoododo/pbl3-japanese-dictionary/blob/main/JapanEasyDict/src/App.jsx): `JapanEasyDict/src/App.jsx`
- [Word results](https://github.com/dodoododo/pbl3-japanese-dictionary/blob/main/JapanEasyDict/src/components/SearchResultsComponents/SearchResultNew.tsx): `JapanEasyDict/src/components/SearchResultsComponents/SearchResultNew.tsx`
- [Login forms](https://github.com/dodoododo/pbl3-japanese-dictionary/blob/main/JapanEasyDict/src/components/LoginFormComponents/LoginForm.jsx): `JapanEasyDict/src/components/LoginFormComponents/LoginForm.jsx`
- [Saved words](https://github.com/dodoododo/pbl3-japanese-dictionary/blob/main/JapanEasyDict/src/components/BookmarkComponents/BookmarkPage.jsx): `JapanEasyDict/src/components/BookmarkComponents/BookmarkPage.jsx`
- [Admin tools](https://github.com/dodoododo/pbl3-japanese-dictionary/blob/main/JapanEasyDict/src/components/AdminComponents/Admin.tsx): `JapanEasyDict/src/components/AdminComponents/Admin.tsx`

### Study features

- [JLPT study](https://github.com/dodoododo/pbl3-japanese-dictionary/blob/main/JapanEasyDict/src/components/JLPTComponents/JLPTPage.jsx): `JapanEasyDict/src/components/JLPTComponents/JLPTPage.jsx`
- [Kanji levels](https://github.com/dodoododo/pbl3-japanese-dictionary/blob/main/JapanEasyDict/src/components/JLPTComponents/KanjiList.jsx): `JapanEasyDict/src/components/JLPTComponents/KanjiList.jsx`
- [Flashcards](https://github.com/dodoododo/pbl3-japanese-dictionary/blob/main/JapanEasyDict/src/components/FlashCardComponents/FlashcardPage.jsx): `JapanEasyDict/src/components/FlashCardComponents/FlashcardPage.jsx`
- [Kana practice](https://github.com/dodoododo/pbl3-japanese-dictionary/blob/main/JapanEasyDict/src/components/KanaComponents/Kana.jsx): `JapanEasyDict/src/components/KanaComponents/Kana.jsx`
- [Kana character data](https://github.com/dodoododo/pbl3-japanese-dictionary/blob/main/JapanEasyDict/src/components/data/hiragana.js): `JapanEasyDict/src/components/data/hiragana.js`
- [Kana matching game](https://github.com/dodoododo/pbl3-japanese-dictionary/blob/main/JapanEasyDict/src/components/views/DnDGame.jsx): `JapanEasyDict/src/components/views/DnDGame.jsx`

### Dictionary API

- [Word endpoints](https://github.com/dodoododo/pbl3-japanese-dictionary/blob/main/jp-dictionary-BE/src/main/java/com/jpdictionary/demo/controller/WordController.java): `jp-dictionary-BE/src/main/java/com/jpdictionary/demo/controller/WordController.java`
- [Word operations](https://github.com/dodoododo/pbl3-japanese-dictionary/blob/main/jp-dictionary-BE/src/main/java/com/jpdictionary/demo/service/WordService.java): `jp-dictionary-BE/src/main/java/com/jpdictionary/demo/service/WordService.java`

### Accounts and saved words

- [User endpoints](https://github.com/dodoododo/pbl3-japanese-dictionary/blob/main/jp-dictionary-BE/src/main/java/com/jpdictionary/demo/controller/UserController.java): `jp-dictionary-BE/src/main/java/com/jpdictionary/demo/controller/UserController.java`
- [Account operations](https://github.com/dodoododo/pbl3-japanese-dictionary/blob/main/jp-dictionary-BE/src/main/java/com/jpdictionary/demo/service/UserService.java): `jp-dictionary-BE/src/main/java/com/jpdictionary/demo/service/UserService.java`
- [Saved-word endpoints](https://github.com/dodoododo/pbl3-japanese-dictionary/blob/main/jp-dictionary-BE/src/main/java/com/jpdictionary/demo/controller/SavedWordController.java): `jp-dictionary-BE/src/main/java/com/jpdictionary/demo/controller/SavedWordController.java`
- [Saved-word operations](https://github.com/dodoododo/pbl3-japanese-dictionary/blob/main/jp-dictionary-BE/src/main/java/com/jpdictionary/demo/service/SavedWordService.java): `jp-dictionary-BE/src/main/java/com/jpdictionary/demo/service/SavedWordService.java`

### Persistence

- [Word repository](https://github.com/dodoododo/pbl3-japanese-dictionary/blob/main/jp-dictionary-BE/src/main/java/com/jpdictionary/demo/repository/WordRepository.java): `jp-dictionary-BE/src/main/java/com/jpdictionary/demo/repository/WordRepository.java`
- [User repository](https://github.com/dodoododo/pbl3-japanese-dictionary/blob/main/jp-dictionary-BE/src/main/java/com/jpdictionary/demo/repository/UserRepository.java): `jp-dictionary-BE/src/main/java/com/jpdictionary/demo/repository/UserRepository.java`
- [Saved-word repository](https://github.com/dodoododo/pbl3-japanese-dictionary/blob/main/jp-dictionary-BE/src/main/java/com/jpdictionary/demo/repository/SavedWordRepository.java): `jp-dictionary-BE/src/main/java/com/jpdictionary/demo/repository/SavedWordRepository.java`
- **SQL database**

### Other components

- **Learner**

## Connections

- Learner → App router: uses
- App router → Word results: renders results
- App router → Login forms: opens login
- App router → Saved words: routes to
- App router → Admin tools: routes to
- App router → JLPT study: routes to
- App router → Kanji levels: routes to
- App router → Flashcards: routes to
- App router → Kana practice: routes to
- App router → Kana matching game: routes to
- Kana practice → Kana character data: displays characters
- App router → Word endpoints: fetches search and popular words
- Word endpoints → Word operations: delegates
- Word operations → Word repository: queries and saves
- Word repository → SQL database: reads and writes
- Login forms → User endpoints: account requests
- User endpoints → Account operations: delegates
- Account operations → User repository: reads and saves
- User repository → SQL database: reads and writes
- Saved words → Saved-word endpoints: saved-word requests
- Saved-word endpoints → Saved-word operations: delegates
- Saved-word operations → Saved-word repository: reads and saves
- Saved-word repository → SQL database: reads and writes