【AWS】ALB スティッキーセッション

特定のクライアントからのリクエストを同じターゲット（サーバー）にルーティングし続ける仕組み。（AWSのApplication Load Balancer（ALB）での名称） セッションの一貫性を保つ。 ステートレスなアーキテクチャではないので必要がない場合は採用しない。

【terraform】環境によってリソース作成を制御する

countを使用する

resource "aws_appautoscaling_target" "ecs_target" {
  count = var.enable_autoscaling ? 1 : 0
  ...
}

参考

https://sadayoshi-tada.hatenablog.com/entry/2022/03/20/114859

【Javascript】イベントデリゲーション

イベントデリゲーションは、イベントリスナーを親要素に設定し、子要素のイベントを処理するテクニックです。 バブリング（イベントの伝播）を利用します。イベントバブリングとは、イベントが最も深いネストされたターゲット要素から始まり、親要素を通じてドキュメントルートに向かって伝播することを指します。イベントデリゲーションでは、このバブリングを利用して、親要素でイベントをキャプチャし、子要素のイベントを処理します。

参考

zenn.dev

HTTPホストヘッダー

HTTPリクエストは「リクエストライン」、「リクエストヘッダ」、「リクエストボディ」 の3つから構成される。 「リクエストヘッダ」のHostプロパティにはリクエストが送信される先の「サーバーのホスト名とポート番号」が含まれる。

「リクエストヘッダ」のHostプロパティ＝ HTTPホストヘッダー

参考

zenn.dev

【vue.js】nextTick

VueはDOMを非同期に更新するため、「DOMを更新した後にその更新済みのDOMに対して何らかの処理をする」といったような場面でnextTickが役立ちます。

参考

aloerina01.github.io

【axios】第三引数 config

第三引数に任意の項目を追加できる。

axios.post(url, data, config)

await axios.post('/users', params, {
      // カスタムエラーハンドリングのフラグを追加
      skipErrorHandler: true,
    })

参考

rakuraku-engineer.com

【vue.js】ref属性 テンプレート参照

DOM要素（クラスやコンポーネント）に一意の名前を付け、script内からリアクティブな参照が可能。 document.querySelectorなどを使って参照するよりref属性で参照した方が良い。

<template>
  <div ref="element">
  </div>
</template>

<script>
export default {
  setup() {
    const element = ref(null)

    return {
      element,
    }
  }
}

</script>

参考

csharpprogram.com

ja.vuejs.org