2022-04-30

IntelliJ IDEA で 1 usage という表示や commiter を非表示にする

version

IntelliJ IDEA 2022.1

非表示にする対象

下記画面のオレンジで囲んだような 1 usage や sakuoden といったcommitter。

手順

Preference を開く
Editor > Inlay Hints を選択する
Code vision の Usages と code author のチェックを外す

2022-04-28

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

Spring Boot Starter Thymeleaf を使う事と比較して...

認証・認可に関して考慮する事が増える
SPA用のURL・サーバー用のURLを考えるのがめんどい
APIのレスポンスモデルとフロントエンドで利用するモデルの型を一致させるのがめんどい
コンポーネントに状態を持つため、フロントのコードが見づらくなる
上記を解決するReduxは、書くコード量が多くてめんどい。Container Component と Presentation Component に分けるのもめんどい。
APIにリクエストするのに、React Application側でfetchなどをラップしたClientを実装するのがめんどい
Formの状態をReactApplicationで実装する必要がある
Validationの実装でSPA側、サーバー側で検討するのがめんどい
Reactの変更が多い

2022-04-28

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

1. 下記記事を参考にDBサーバーを立ち上げる

DBサーバー（アプリケーションサーバー）を使う｜ConoHa VPSサポート

2. 下記記事を参考にネットワークを作成する。

DBサーバー接続用ネットワークを使う｜ConoHa VPSサポート

Ubuntuでのネットワーク設定

この記事のネットワークの設定は、CentOSを対象にしているためUbuntuでネットワークを設定する場合は下記のような network.yaml を作成する。

network:
 version: 2
 renderer: networkd
 ethernets:
  eth1:
   addresses: [**********]
   dhcp4: no
   dhcp6: no
   routes:
   - to: **********
     via: **********

key	設定する値
address	`VPSのネットワーク情報で表示NICが shared になっているときのIPアドレス` + /23
to	東京リージョンであれば、`172.21.74.0/23`。ここに記載
via	`VPSのネットワーク情報で表示NICが shared になっているときのゲートウェイのIPアドレス`

参考記事

https://intellectual-curiosity.tokyo/2019/01/21/conoha-vps%E3%81%A7db%E3%82%B5%E3%83%BC%E3%83%90%E3%83%BC%E3%82%92ubuntu-18-04%E3%81%AB%E3%83%97%E3%83%A9%E3%82%A4%E3%83%99%E3%83%BC%E3%83%88%E3%83%8D%E3%83%83%E3%83%88%E3%83%AF%E3%83%BC%E3%82%AF/

つまづいた点

●ユーザーリストのユーザーの接続許可ホストは、プライベートネットワークのDBサーバー接続用ネットワークのVPSのIPを書く。

private.***.tyo1.database-hosting.conoha.io ではなく 172.21.***.*** を書く。 https://teratail.com/questions/171630?link=qa_related_pc_sidebar

ユーザーの接続許可ホストに private.***.tyo1.database-hosting.conoha.ioを記載していた為、下記のエラーが出てConohaのDBサーバーに接続出来なかった。

ERROR 1044 (42000): Access denied for user '******'@'172.21.***.***' to database '******'

●ネットワーク設定の via 以下は、ゲートウェイのIPを利用する。これはvpsのsharedの表示INCで表示する

●yamlファイルは、空文字がズレると効かない

●yamlファイルは、ymlファイルだとダメ

2022-04-24

STOMPとは

結論

STOMP（Simple Orientated Messaging Protocol）とは、STOMPクライアントがSTOMPメッセージブローカーと双方向に通信するためのプロトコル仕様である。

STOMP

https://stomp.github.io/stomp-specification-1.2.html

STOMP と WebSocket の違い

STOMPは、WebSocketを使って双方向通信をする方法を述べている。 STOMPは、WebSocketを使わない方法でも双方向通信が出来る。

2022-04-24

WebSocketとは

結論

WebSocket という名前は、大きく分けて2つの意味で利用される。

プロトコルとしてのWebSocket

RFC 6455: The WebSocket Protocol

インターフェースとしてのWebSocket

enum BinaryType { "blob", "arraybuffer" };

[Exposed=(Window,Worker)]
interface WebSocket : EventTarget {
  constructor(USVString url, optional (DOMString or sequence<DOMString>) protocols = []);
  readonly attribute USVString url;

  // ready state
  const unsigned short CONNECTING = 0;
  const unsigned short OPEN = 1;
  const unsigned short CLOSING = 2;
  const unsigned short CLOSED = 3;
  readonly attribute unsigned short readyState;
  readonly attribute unsigned long long bufferedAmount;

  // networking
  attribute EventHandler onopen;
  attribute EventHandler onerror;
  attribute EventHandler onclose;
  readonly attribute DOMString extensions;
  readonly attribute DOMString protocol;
  undefined close(optional [Clamp] unsigned short code, optional USVString reason);

  // messaging
  attribute EventHandler onmessage;
  attribute BinaryType binaryType;
  undefined send((BufferSource or Blob or USVString) data);
};

WebSockets Standard

経緯

ブラウザとサーバー間で双方向な通信を行いたい場合、XMLHttpRequest を使う方法があった。
しかし、XMLHttpRequestは1つのリクエストに対して1つのレスポンスを得る非同期な通信方法なので、XMLHttpRequestを使って双方向通信を行うと複雑になってしまう。

そこで、簡単に双方向の通信を行うために WebSocket というプロトコルが生まれた。

WebSocket connection を確立する（WebSocket interface を実装したオブジェクトを生成する）と下記のことが可能になる。

WebSocket::send() を呼ぶことでブラウザからサーバーへデータを送ることが出来る。
onmessage EventHandler によりサーバーからブラウザにデータを送ることが出来る。

STOMP Over WebSocket

作記録

記憶代わり