フレームワーク

【食事内容管理Webアプリ】FullCalendarのイベントドラッグ&ドロップ

FullCalendarに用意されているExternal Event Dragging機能を使用して、イベントをカレンダーにドラッグ&ドロップする機能を追加します。この機能が実装されればメニューの登録作業がさらに楽になりそうですね!
Java

【食事内容管理Webアプリ】メモ内容の表示

前回作成したモーダル画面には日付や料理名のほかに「メモ」の入力欄を用意していましたが、その情報を画面に表示する機能がなく確認することができませんでした。そのため今回は登録されたメモの内容を表示できるように改良していこうと思います!
Java

【食事内容管理Webアプリ】データ登録処理の追加

前回はデータ登録用のモーダル画面を作成したので、今回はそのモーダル画面に入力した内容をデータベースに登録できるようになることを目標にモーダルのformタグとサーバ側のJavaおよびテーブルの修正を進めていきます。これでもう立派なWebアプリになりそうです!
フレームワーク

【食事内容管理Webアプリ】FullCalendarのボタン追加

今回はカレンダーに表示するメニュー情報をデータベースに登録するために必要なモーダル画面とその表示・非表示機能を実装します。せっかくなので表示・非表示機能についてはFullCalendarのToolbarを絡めて実装していこうと思います!
Java

【食事内容管理Webアプリ】データベースから値を取得する

今回は実際にデータベースを用意して、各テーブルに登録されたデータの取得および画面出力を行いました。そのため今後はテーブルにデータさえ登録されていればFullCalendarによって出力されたカレンダーに自動でメニューを表示させることができますね!
自作アプリ

【食事内容管理Webアプリ】FullCalendarによるカレンダー作成②

FullCalendarによるカレンダー作成の続きです。前回までの実装では表示するメニューがJavaScriptに直書きした内容のみとなっていましたが、今回はサーバから渡されたデータを表示するように改修していきます。
フレームワーク

【Spring Boot】ThymeleafでJavaScriptに値を渡す方法

ThymeleafからJavaScriptに値を渡す方法についてまとめました。本記事ではth:inlineを用いてJavaScriptに値を渡す方法を挙げています。th:inlineの使い方から実際の実装例まで記載したので参考になれば幸いです。
フレームワーク

【Spring Boot】ThymeleafのリンクURL式 html編

Javaでサイトを作成するときに便利なThymeleaf。今回はそんなThymeleafに用意されている機能の一つ、"リンクURL式"の記載方法をまとめました。変数を用いてURLを組み立てる際に簡潔に記載できるのでマスターしていきましょう。
フレームワーク

【Spring Boot】Thymeleafの選択変数式 html編

Javaでサイトを作成するときに便利なThymeleaf。今回はそんなThymeleafに用意されている機能の一つ、"選択変数式"の記載方法をまとめました。フォーム送信の実装によく使用するのでマスターしていきましょう。
フレームワーク

【Spring Boot】Thymeleafのフラグメント式 html編

共通の要素やページのヘッダー、フッターは毎回書かずに一箇所で管理して、必要な時に出力できると便利です。今回はhtmlに記載された要素・コンテンツを別の場所に出力する際に使用するThymeleafの"フラグメント式"について紹介します。