リクエストパラメータの単項目／関連項目バリデーションとは別に業務的なチェック処理を追加して、エラーメッセージを返却するところまでを追加する /src/main/java/com/example/demo/domain/mapper/UsersMapper.java メールアドレスが重複するレコードが登…

バリデーション処理の実装 1. アノテーションによるバリデーション処理の実装 2. 独自メッセージの使用 3. 独自バリデーター（単項目／関連項目）の作成 共通例外処理 1. @RestControllerAdviceを使って共通の例外ハンドラーを作成 /build.gradle spring-boo…

とりあえずバリデーションはなしでCURD操作に注力する build.gradle plugins { id 'org.springframework.boot' version '2.5.0' id 'io.spring.dependency-management' version '1.0.11.RELEASE' id 'java' } group = 'com.example' version = '0.0.1-SNAPSH…

eclipseの準備 Eclipse マーケットプレースから下記のプラグインをインストール Spring Tool4(aka Spring Tool Suite 4) Gradle IDE Pack プロジェクトの作成 Spring Starter Projectからプロジェクトを作成 Type:Gradle Packaging:Jar Java Version:11 Lang…

docker-composeでMySQLを利用できる環境を作る ※mysqlのイメージをそのまま利用するとWindowsでは下記の警告が発生し、my.cnfが読み込めなかった。この為、Dockerfile を介してパーミッションを変更する処理を追加した。 mysqld: [Warning] World-writable c…

nullの可能性のあるオブジェクトのラッパー。NullPointerExceptionを発生させない為に導入された仕組み。 Optionalオブジェクトの生成 public static Optional of(T value) public static <T> Optional<T> of(T value) 指定された非null値を含むOptionalを返します</t></t>…

void forEach(Consumer action) 要素を順に処理する ※forEachメソッドは並列ストリームでは順序を保証しない為、順序を保証したいならforEachOrderedメソッドを使うこと Stream.of("beckham", "zidane", "ronald").forEach(v -> System.out.println(v)); Opt…

関数型インタフェースとStream APIの復習をしたのでメモ 関数型インタフェース インタフェース メソッド 説明 Function<T, R> R apply(T t) T型の引数を受け取ってR型の結果を戻す Consumer< T > void accept(T t) T型の引数を受け取って処理する（戻り値なし） Su</t,>…

ロケールによってメッセージや項目名などの言語を切り替える仕組みですが、今回は単にVueテンプレートに埋め込む文字列を別ファイルに切り出したかったので使ってみます。 インストール yarn add vue-i18n@next 設定 src/main.ts import { createApp } from …

複数のモジュールを登録する方法 how to use modules in vuex4.0 · Issue #1833 · vuejs/vuex · GitHub src/store/index.ts import { store as authStore, key as authKey } from "@/store/AuthStore"; const stores = [ { store: authStore, key: authKey, …

Vue3ではprovide/injectによる状態管理が推奨されているようなので使うつもりはなかったが、Global Before Guardsを使ったログイン状態によるページ制御をしようとした際にVueRouterでどう参照するのかわからなかったので使ってみる。 Vuex4になってTypeScri…

ログインしてない状態で、ログインが必要なページが要求された場合にログイン画面へリダイレクトさせたい。 Vue RouterのGlobal Before Guardsという仕組みで実現できるようなのでやってみた。 Navigation Guards | Vue Router src/router/index.ts import {…

エラーメッセージを日本語にしたい main.ts import { createApp } from "vue"; import App from "./App.vue"; import router from "./router"; import ElementPlus from "element-plus"; import "element-plus/lib/theme-chalk/index.css"; import { setLoca…

vee-validateはバリデーション処理を行うためのライブラリ。 インストール yarn add vee-validate@next yarn add yup ※yupは必須チェックや桁数チェックなど、チェック処理をまとめたライブラリ Element+と組み合わせて使う バリデーションは、各項目へのバ…

ログイン画面はヘッダー、フッターを表示。それ以外の画面ではヘッダー、サイドメニュー、フッターを表示といった形で画面ごとにレイアウトを切り替えたい。 Nuxtだとlayout プロパティを使って切り替えれるみたいだけどVue.jsではそのような仕組みがないよ…

カスタムコンポーネントのv-modelは下記の通りと説明されているがどうも動作がおかしい、、、 <ChildComponent v-model="pageTitle" /> <ChildComponent :value="pageTitle" @input="pageTitle = $event" /> どうもVue 3になって仕様が変わったらしい。詳細は、、、 v-model | Vue.js <ChildComponent v-model="pageTitle" /> <…</childcomponent></childcomponent></childcomponent>

input, radio, select, checkboxあたりの部品に触ってみる Element Plus - The world's most popular Vue 3 UI framework <template lang="pug"> el-form el-form-item(label="Text") el-input( placeholder="Email Address" name="email" v-model="formModel.email" clearable ) </template>…

UIライブラリを探していたらまだVue.js 3系に対応しているものが少ないようで、その中でも比較的Element+が良さそうだったので触ってみた。 インストール Element Plus - The world's most popular Vue 3 UI framework yarn add element-plus ※例によってプ…

標準のSuspense機能では、下記のようなちょっと不便な点があるようなので他サイトを参考に独自のSuspense機能を作成する コンポーネント化する必要がある 初回のロードのみで再ロードに対応していない components/MySuspense.vue <template lang="pug"> div template(v-if="status</template>…

Suspenseとは？ コンポーネントを非同期で読み込むための機能らしい。 非同期で読み込む部分を<Suspense>でラップし、読み込むコンポーネントを<template #default>に定義し、フォールバックコンテンツを<template #fallback>に定義する service/UserService.ts /* eslint-disable require-jsdoc */ import axi</template></template></suspense>…