作記録

記憶代わり

React と Spring Boot が合わないと僕が思う点まとめ

Spring Boot Starter Thymeleaf を使う事と比較して... 認証・認可に関して考慮する事が増える SPA用のURL・サーバー用のURLを考えるのがめんどい APIのレスポンスモデルとフロントエンドで利用するモデルの型を一致させるのがめんどい コンポーネントに状態…

Conoha の DBサーバーのプライベートネットワーク接続までの情報まとめ

1. 下記記事を参考にDBサーバーを立ち上げる DBサーバー(アプリケーションサーバー)を使う|ConoHa VPSサポート 2. 下記記事を参考にネットワークを作成する。 DBサーバー接続用ネットワークを使う|ConoHa VPSサポート Ubuntuでのネットワーク設定 この記…

STOMPとは

結論 STOMP(Simple Orientated Messaging Protocol)とは、STOMPクライアントがSTOMPメッセージブローカーと双方向に通信するためのプロトコル仕様である。 STOMP https://stomp.github.io/stomp-specification-1.2.html STOMP と WebSocket の違い STOMPは…

WebSocketとは

結論 WebSocket という名前は、大きく分けて2つの意味で利用される。 プロトコルとしてのWebSocket RFC 6455: The WebSocket Protocol インターフェースとしてのWebSocket enum BinaryType { "blob", "arraybuffer" }; [Exposed=(Window,Worker)] interface …

ConohaでVPSをレンタルしてからアプリケーションをデプロイするまで

使用する技術等 名称 verstion 用途 Ubuntu 20.04.2LTS VPSのOS Nginx - リバースプロキシ Spring Boot - アプリケーション 大きな流れ firewallを設定する OSのユーザーを作成する Javaをインストールする Spring Boot Applicationをデプロイする Nginxを導…

Nginxの起動に関して

1 - 利用する技術 Ubuntu version 20.04.4 LTS Nginx version 1.20.2 2 - インストール 公式document を参考に、NginxをUbuntu上にインストールする。 3 - Nginxファイルの確認 上記2のインストール時点で、下記の2つのファイルがインストールされているは…

Jack The Newest の Jack Titor リリース!!

しました。 iTunes・Apple Music https://music.apple.com/jp/album/jack-titor/1610049895 YouTube Music https://music.youtube.com/watch?v=WHU4nLJXRYk&list=OLAK5uy_nuU7LIcL2tnmNwSDFOwmu8B1mpyO0jke4 LINE MUSIC https://lin.ee/XkgyE3d その他、聴け…

IntelliJ IDEA + Spring Boot Dev Tools + Thymeleaf でHTMLファイルの自動更新をする

1 - 使用技術のバージョン 技術 バージョン InteliJ IDEA 2021.3.2 Spring Boot Dev Tools 2.6.4 Spring Boot Starter Thymeleaf 2.6.4 2 - IntelliJ IDEAの設定 2.1 - 自動的にプロジェクトをビルドするようにする 下記の画像の通り Preference > ビルド、…

Macを新しく購入した際に最初にやっていること

Macを新しく購入したので、毎回やっている設定をメモ。(本当はスクリプトを書くと良いんだろうけど面倒臭いから、まずは日本語でやる。) 1. トラックパッドの軌跡の速さをMAXにする 少しの指の動きでカーソルの操作が出来るのでMAXにする。 システム環境設…

Typescriptのカレンダーモジュール

結論 ts-calendar という Typescriptのカレンダーモジュールを作って npm に公開しました。 www.npmjs.com 経緯 ライブラリを使うと Tailwind CSS と相性が悪かったり、やりたい事出来なそうな感じだったので自身で実装しました。 使用方法 github.com React…

レスポンシブ対応で途中の要素だけを横の列に抜き出す

結論 CSS Grid Layout を使うと良さそうな気がする。 参考 developer.mozilla.org 目標 ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ コード レスポンシブ対応を加える前 <head> <meta name="viewport" content="width=device-width,initial-scale=1"> <style> body { color: white; } div:not(:first-child) { margin-top: 25px; } .blue { width: 100px; height:</meta></head>…

要件定義の素人なら、とりあえずRDRAをやった方が良いと思う

タイトルは、最近システムを開発する業務でサラリーを頂く身になって感じる事。 RDRAとは、神崎善司さんが考案した Relationship Driven Requirement Analysis = 関連により駆動される要求分析のことである。 vsa.co.jp やり方は、↓この本に書いてあるから読…

フロントエンドのコンポーネントの設計

順番 開発初期段階では、コンポーネントの設計をする前にコンポーネントを考慮せずにパッと HTML と CSS で実装すると良いような気がしています。 なぜなら、コンポーネントは HTML が出来始めると作り直したい箇所が出てくるからです。 ページ数が多い場合…

CSSの擬似クラス、擬似要素について

事前定義 HTMLの要素 h1, p, div などを指す。 HTMLの属性 # top.html ファイル <h1 class="title">事前定義</h1> 上記の class="title" を属性と言う。 なお、classを属性名、titleを属性値と言う。 セレクター # top.css ファイル h1 { color: red; } .title { margin: 10px; } 上…

モデル

結論 モデルは、目を通して脳が描写した世界ではなく、事実と事実の積み重なった概念から作ることが出来る。 リソースモデル 0 -> 1 になる対象。 0 -> 1 の例は、製造・制作など。 イベントモデル リソースモデルに関連する事実。

現状のシステムの設計イメージ

今作ってるシステムからの学び

忘れないようにメモ。 1. 先に +, -, *, / などの計算とif文の判断をドメインモデルに閉じ込める。それが出来たらDB設計をしてapplication層を作り始める。 2. 後々キーが分かりづらくなるから自然キーではなくサロゲートキーを使った方が良さそう 3.エラー…

ドメイン駆動設計はやめた方がよいんじゃないか...

結論 ドメイン駆動設計を意識しているせいで余計な事ばかりしているケースが多い... 説明 最近の僕の感想は、 「ドメインに興味を持てないならドメイン駆動設計はやめた方がいいと思う」 です。 と言うのは、よいドメインモデルを見つけ出して、そのドメイン…

Spring Frameworkの@Transactionalについて

結論 Spring Frameworkでよく見受けられる下記のような設計をするのであれば@Transactionalは、application層ではなくinfrastructure層で使うべきだと思う。 presentation層(@Controller) application層(@Service) infrastructure層(@Repository) 説明…

CSSの書き方

結論 .example { /* position, margin などの位置関係 */ position: fixed; bottom: 0; /* 要素の大きさ関係 */ height: 100px; width: 100%; padding: 1% /* flex系 */ display: inline-flex; justify-content: center; align-items: center; /* その他 */ …

ドメインオブジェクトだけを先に書く

結論 application層のServiceやRepository、infrastructure層のDBアクセスの実装は一旦無視する。 メモリに永続的に保存出来ると仮定する。 Junitのテスト上でドメインオブジェクトだけで機能を実装するようにする(永続化を無視しているので現実には出来な…

ドメインを独立させる

結論 WEBシステムが提供出来る価値を大きく分けると下記の通り。 記録 参照 計算 判断 表示 このうち、計算・判断・表示は、ドメイン = 領域 の関心事に近い事である。 それをドメインモデルで表現する。 記録と参照はシステム自体の関心事に近い事である。

footerを固定させずページ最下部に表示させる

参考 https://codepen.io/cbracco/pen/zekgx ちょっと改変 html { height: 100%; box-sizing: border-box; } *, *:before, *:after { box-sizing: inherit; } header { padding: 0; } body { position: relative; margin: 0; padding-bottom: 6rem; min-heig…

コトを記録するように振り切る

jtnsaku.hatenablog.com 上記のオブジェクトをまとめるオブジェクトについて書きました。 これは、コトの記録もモノの記録も同じ世界線にある前提です。 しかし、コトを記録することに振り切った設計にした方が良い気がしてきました。 なぜなら、この世界は…

HttpServletRequestで取得出来る情報について

HttpServletRequestで取得出来る情報例 HTTP Mehod: GET URL: http://localhost:8080/test?category=book&year=2000 getMethod(): get getQueryString(): category=book&year=2000 getRequestURI(): /test getRequestURL(): http://localhost/test getLocalA…

ビジネス

前置き 現状の僕は、僕の周りの人と比較してお金に対する興味が薄いと思います。 例えば、友達が「年収●●円だ!」と聞いても「そうなんだ」としか思いません。 そんな事よりも、その会社が楽だとか、良い人が多いとか、こういう仕事をしているとかそういう話…

Material designのbreakpoint systemについて

参考 material.io まとめ 自分の言葉でまとめると下記のようになる。 画面サイズが0~599dp(extra small breakpoint ex: スマホ) bodyは画面サイズに合わせて広がる。 marginは16dpで固定。 カラム数は4。 画面サイズが600~904dp(small breakpoint ex: タブレ…

MyBatis Spring-Boot-Starter(MyBatis Integration with Spring Boot)について

1. 本記事で利用した技術のVersion openjdk 11.0.9 mybatis-spring-boot-starter 2.2.0 PostgreSQL 13.1 2. MyBatis Spring Boot Starter GitHub github.com 3. 公式 MyBatis document MyBatis https://mybatis.org/mybatis-3/ja/index.html MyBatis-Spring …

テスト駆動開発メモ

テスト駆動開発の目的 動作する綺麗なコードを書く事。 テスト駆動開発のサイクル 1. システムが達成したい機能の目的をイメージする。 例えば、システムで多国籍通貨をレポートさせたい という目的をイメージする。 2. その目的を達成する為の振る舞いを考…

PATHについて

PATHとは PATHとはOSの環境変数の1つである。 OSの環境変数とは OSを利用して実行されている全てのユーザーがアクセス出来る変数である。 例として下記のものが挙げられる。 PATH OS USERNAME PATHが利用される例 ①Node.js がインストールされているシステ…