記憶術ドミニクシステムを今すぐ体験できるwebアプリをリリースしました。
ドミニクシステムオンラインVPSが、追加されました。
VPS上で動作しているので安定しています。
リスト登録から、文章登録までしっかりと動作します。
今後は、こちらで利用してください。

Heroku版の注意点

jawsDBとの相性が悪いようで、ログインして利用すると、サーバーエラーが頻発するので、ゲストで利用してもらえるとありがたいです。
単語登録や人名とアクションの変更は、アクセス数の少ないときなら使えるようですが、あまり利用しないようにお願いします。データベースサーバーが接続を拒否してきます。

heroku上で実際に動作しているものとは、コードが多少違います。
どうしても、早く動作させたい場合は、eclipsなどから、TomcatServerで起動するとオンライン版より早く安定的に動作します。
動作には、MySQLデータベースの制作と接続が必要です。大した構造ではないので安心してください。
データベースの構造は、この記事の下の方にあります。

ドミニクシステムとは、トランプ１組を一分で丸暗記するのに使われる記憶術です。
細かなことはについては、使い方を読んでください。
プログラムのコードは、Github:Dominicです。

ローカル環境で試す方法

開発環境はosはWindows10、サーバーは、tomcat:9、開発データベースは、MySQL8.0.21を使用しています。
webサーバーは、heroku、データベースはjawsDBを利用しています。webサーバーはローカルで試す場合不要です。
環境を揃えたほうが、確実に動作しますが、おそらく、tomcat9以上が入っていれば大丈夫なはずです。

詳細？な手順

1. GitHubから、ソースをダウンロードする
Pleiades All in One Eclipse(2020 java Full Edition)などで、プロジェクトを読み込む。
tomcatが入っていることが重要です。
3.MySQLをインストールする
4.データベースを製作する。
製作には、web-content内のSQLフォルダに、SQL(createDatabase.sql)が用意してあるので、MySQLWorkBenchなどから、インポートして利用してください。
もちろん、下の方にあるデータベースのカラムから作っても大丈夫です
5.データベース接続に接続する。
c3p0を利用しています。なので、resources/environment.propertiesに、データベース名、ユーザー名、パスワードを登録してください。
'#'でコメントアウトしてあるので、'＃'を削除をすると有効にできます。
6.Eclipseから、プロジェクトを実行＞1.サーバーで実行する。

アプリ概要

記憶術ドミニクシステムを誰でもすぐ使えるシステム
- 数値と人名が、頭の中でつながっていない段階から、記憶訓練を行えるようになる
ドミニクシステムの人名リストの表示と編集
- リストを自分で用意しなくていい
- 先にリストを作る必要性がなく、訓練をしながらリストを構築できる
記憶文章の検索と自動構文および編集
- 文章を考える手間が、すくなくなる。
ログイン機能
- ユーザーのリストを保存するために利用。

検索画面

数値と言葉を入力することで、記憶文章を生成できます

検索結果

文章を修正して、登録ボタンを押せば、保存することができます。

人名表示画面

数値に対応する人物の画像と行動が表示されます。
変数ボタンを押して、名前と行動及び画像を変更することが可能です

単語帳画面

登録した記憶文章を確認・編集することができます。

システム概要

会員（ログインユーザー）とゲスト（非ログインユーザー）ともに、Webブラウザを使用し、本システムにアクセスする。
本システムは、Webサーバー上に配置する。
利用者の利便性向上のため、ゲストであっても保存以外の機能を有効にする。
利用者は、メインページで数字と単語を入力することで、ドミニクシステムの記憶文章を獲得できる。検索結果をその場で単語帳に登録することができる。
人名リスト、単語帳にアクセスし変更することができる。
人名と数字を関連付けさせる練習を行うことができる。
会員のデータは、データベースに保存する
デフォルトのデータは、データベースに保存し、web上で変更可能にする
ブラウザにデータを保存はしない。
ゲストが、データを保存したい場合に会員登録を要求する
会員はログインすることによって、どこからでも自身のリストと単語帳を確認できる

技術目標

フロントエンドとバックエンドをajaxで完全に分離する。
デザインは、頑張らない。HTMLやCSSはメインにしない。ただし、JavaScriptは、例外的に好きにいじる。
5年放置しても安全にする。（メールアドレスの収集やSNS連携をしない）
どのような出来であれ、公開する。

使用言語・ツール

使用言語	使用IDE
java	eclipse
MySQL	MySQLWorkBench
JavaScript + jQuery	Visual Studio Code
html + css	Visual Studio Code + Chrome
ER図	draw.io

利用サーバー+データベース
heroku
jawsDB
両方とも無料枠範囲内で利用する。
自分にコードの効率化圧力をかけるため。

使用ライブラリ

ライブラリ	使用目的
Jackson Databind	JSON形式への変換
JSTL	JSPでのページ構築
javax.servlet	サーブレットの展開と維持
jBCrypt	パスワードの暗号化
c3p0	データベース接続の構築
mchange-commons	c3p0が必要とするライブラリ
connect-j	javaとMySQLの接続
Bootstrap 4	HTMLのデザイン
jQuery	AJAX通信の管理
jQuery.inview.js	画面表示の検知

アプリ構造設計

画面のデザインは、機能に絞って書かれたものです。
ニューモフィズムのデザインを取り入れて実装します。
画面接続性は、初期に制作されたもので、実際の構造とは、差異があります。
トレーニングモードは、時間的に実装を凍結しました。
データベースは、仕様を満たす形で作られています。
実装で利用されていないテーブルとカラムが存在します。
カラムを削除しないでください。内部的には利用されている場合があります。
カラム表とER図が違う部分は、更新された部分です。カラム表を正として読んでください。

フロント画面
単語帳画面
画面遷移
データベースカラム
データベースER図

システム導入の背景と目的

記憶術「ドミニクシステム」の習得には、2つのものが必要です。100名の顔のわかる人名と数字との関連付けという処理が必要で導入が難しいものです。未経験者が始めるには、リストを構築してからでないと、導入できないという弱点があります。
　そのため、未経験者でも、すぐにドミニクシステムの訓練を始められるオンラインシステムには、必要性と需要がある。

　新システムの導入することによって、ドミニクシステムの浸透を図ると同時に、記憶力の向上を利用者に提供する。リストの構築にかかる手間を極力排除し、違和感のある部分をユーザごとに修正できるようにする。皆が設定した候補を見ながら素早く自分に合ったリストを得られるようにする。

制作過程

javaSliverの試験を優先していたので、即興で作られています。

概ね以下の手順で制作しました
1. 製作資料を制作する。上記のものと画面全部・データベースのカラムとER図
2. フロントを作る。時間の都合上、検索画面のみ先行完成
3. データベースを作る。データベースは、中途半端な分割が難しかったので、先に完成させました
4. javaでデータベースの検索結果を返すwebAPIを制作する。今回はPUTやDELETEを使わず、1つのアドレス＝1つの動作にする。
5. javaScriptで、フロント側からAJAXでwebAPIを呼び出す。

フロント画面とデータベースの完成まで、２週間前後。残りの画面を3週間ほどでコーディングしました。

1日8時間計算で換算、実作業は分散している場合も、一日で作業している場合もあります。
開発開始時期11月初旬
企画書を制作する　2日
フロント側のデザインを決定する　1日
データベースを設計する　2日
データベースの制作　0.5日
index画面（検索機能のみがある画面）HTML+CSS 3日
発表会まで一週間を切ったので機能を絞る
index画面のJavaScript 2日
バックエンドAPIの制作　3日
11月下旬　
ドミニクシステムの人名リストの表示と編集
記憶文章の検索と編集
ログイン機能の完成　
この時点では、リスト画面は何も制作されていない。
バックエンドののAPIはほぼ完成している。
12月中旬までは、SPRINGFrameの研修を優先したので制作中断
リスト画面（人名リストのる画面）　3日
リスト画面　JavaScript　2日
単語画面　　1日
使い方画面　1日
バックエンドAPIへの接続　2日
各画面のレスポンシブ対応2日
動作確認　0.5日
12月31日、ギリギリ年内で、ローカル完成。
Herokuへの対応を行う
Heroku導入対応・アップロード　1日
ネットワークエラーの原因調査２日
データベースと接続設定に問題があることが判明
c3p0の設定の調整　１日
SQLの実行回数が多すぎることが抜本的原因であることが確定。
ゲストユーザーの場合データベースへの接続をしないように変更１日
この文章を書く1日。
リリース

Q.なぜゲストだけ、データベースにアクセスさせない対応にしたのか

A.現在取れる以下の対応を比較検討した結果です。

エラーの状態

jawsDBのconnnectionが上限に到達し、接続の途中でも通信を終了している。
デーベースサーバーがコネクション上限に達したエラーを返すようになる。
一定期間放置すると解除される。
一つのAJAX通信で複数のSQLの実行する途中で、中断され、ローカルでは見ないレコードが帰ってきています。
TomcatのコネクションプールとC3p0の動作が違うことが表面的原因のようです。
コネクションを内部でリレーして使い回すように変更した結果ある程度動くようになりました。
さらに、C3P0の設定をいじって、だいぶ改善したんですけど、実用には足りない状態です。
もし、２時間位で解決する良い方法があったら教えて下さい。

取れる方法は、大きく分けて3つ

お金を払う方法

jawsDBを有料プランに切り替えて高速化する。
高速化のためには、月119ドル程度のものが必要で、支払いたくない。

環境を変える方法

VPSサーバーを借りて、データベース接続を高速化する。
VPSサーバーはSSDかつ、内部にデータベース・サーバーがあるので、ローカル環境と同等の動作をするはず。
想定作業時間は3日。次の制作物が、SPRINGFrame使うので、本番環境でためしながら開発できるのは、ありがたい。ただし、次の制作物にすぐに移りたいので、3日は痛い。

コードを変える方法

データベースの構造を抜本的に変更する。
おそらく6日くらい。勉強にはなるが、このまま変更するより
2週間ぐらいかけてSpringBootに移植してしまうほうが、後々楽なのでやりたくない。

ORマッパーのHivernateを導入する
C3p0がうまく動かない原因としてHibernateが入っていないことがあります。そのため、Hrbernateを導入して、データベースのマッピングをすれば、解決する可能性がある。
ただし、Mavenプロジェクトにしていないので、変換作業をするか、自力で導入する必要がある。変換する場合、1から作り直すより時間がかかる。
自力導入は、別のトラブルを引き起こす可能性が高い。同様のやり方をする人が少ないので、ネット検索が使えない。大きなトラブルを自力でなんとかする必要がる。

ゲストモードだけ取りあえず使えるようにする。
すぐ作れる、3時間位。
ユーザーが自分のリストが作るのが難しいままである。
ただし、私はローカルで使えるので、問題が出ない。
想定接続ユーザー数は、私一人だけである。

上記の案を検討した結果、すぐに治せるゲストモードだけ治すことにしました。

今後の修正予定

~~VPSサーバーを使いだしたら、移動させるかもしれない。１ヶ月くらいかかるかも。~~

VPSサーバー版を導入しました。しっかりと動作します。

「ドミニクシステムオンライン」サーバー追加しました