20251011

Accessは一通り基礎的な使い方は理解できた。

明日からExpertの対策テキストをやる。

Access

マクロの作成(起動時マクロ)

  1. 「作成」タブ → 「マクロ」
  2. 「AutoExec」で保存
  3. 「アクションを追加」から「フォームを開く」を選択
  4. フォーム名に「frm_顧客」を設定
  5. ビューに「フォームビュー」を設定

ファイルを閉じてから、もう一度開くと自動的に「frm_顧客」が開く。

Accessはファイル起動時に自動的に「AutoExec」マクロを実行する。

マクロの作成(ボタンイベント)

  1. 「frm_顧客」を開き、「デザインビュー」に切り替え
  2. 「フォーム デザイン」タブ → コントロールの「ボタン」をクリック
  3. フォーム上にボタンを設置すると「コマンドボタンウィザード」が開く
  4. 種類 → 「レポートの操作」
  5. ボタンの動作 →「レポートを開く」に設定
  6. 対象のレポート → 「rpt_顧客一覧」を設定
  7. ボタンに表示 →「文字列」で「顧客一覧レポートを開く」
  8. ボタン名 →「顧客一覧レポートを開く」

フォームを「フォームビュー」に切り替えてボタンを押すと、「rpt_顧客一覧」の印刷プレビューが開く。

モジュールの作成

  1. 「作成」タブの「標準モジュール」
  2. 以下を入力し、「modUtility」で保存
Public Function IsMailMissing(ByVal mailValue As Variant) As Boolean
	If IsNull(mailValue) Then
		IsMailMissing = True
	Else
		IsMailMissing = (Trim(CStr(mailValue)) = "")
	End If
End Function
  1. 「frm_顧客」を開き、「デザインビュー」に切り替え
  2. 右の「プロパティシート」の選択を「フォーム」にし、「イベント」タブ
  3. 「更新前処理」を「[イベントプロシージャ]」に設定し隣の「…」をクリック
  4. 以下を入力し上書き保存
Private Sub Form_BeforeUpdate(Cancel As Integer)
	If IsMailMissing(Me!メール) Then
		If MsgBox("メールが未入力です。保存しますか?", vbExclamation + vbOKCancel()) = vbCancel Then
			Cancel = True
		End If
	End If
End Sub

「frm_顧客」のフォームビューに切り替えて、メールアドレスなしで保存しようとすると警告が出る。

Me!メール は「このフォームの「メール」コントロールの値」という意味になる。

Tailwind CSS

https://tailwindcss.com/docs/functions-and-directives

Tailwind独自のディレクティブ。

  • @theme
  • @source
  • @utility
  • @variant
  • @custom-variant
  • @apply
  • @reference

@theme

https://tailwindcss.com/docs/theme

プロジェクト用のカスタムデザインを定義できる。

フォント、色、ブレークポイントなど。

@theme {
  --font-display: "Satoshi", "sans-serif";
  
  --breakpoint-3xl: 120rem;
  
  --color-avocado-100: oklch(0.99 0 0);
  --color-avocado-200: oklch(0.98 0.04 113.22);
  --color-avocado-300: oklch(0.94 0.11 115.03);
  --color-avocado-400: oklch(0.92 0.19 114.08);
  --color-avocado-500: oklch(0.84 0.18 117.33);
  --color-avocado-600: oklch(0.53 0.12 118.34);
  
  --ease-fluid: cubic-bezier(0.3, 0, 0, 1);
  --ease-snappy: cubic-bezier(0.2, 0, 0, 1);
  /* ... */
}

@source

Tailwind CSSでは軽量化のため使われていないクラスをビルド時に削除する。

その際どのクラスを使用しているかを判定するためにコードを解析する。

@source ディレクティブを使うことで、解析対象のコードを指定できる。

@source "../node_modules/@my-company/ui-lib";

Tailwind CSS v4 では自動的にプロジェクト内のファイルを解析するが、 .gitignore に指定されているファイルは対象外となる。

.gitignore に指定しているものの対象としたい場合は @source ディレクティブで明示的に指定する。

@utility

https://tailwindcss.com/docs/adding-custom-styles#adding-custom-utilities

独自のユーティリティクラスを追加する。

@utility tab-4 {
  tab-size: 4;
}

@utility ディレクティブを使って追加することで、自動的に hover:*lg:* など(バリアント)のクラスも追加される。

@variant

ダークモード時やホバー時などのスタイルを定義したい場合に便利なディレクティブ。

.my-element {
  background: white;
  @variant dark {
    @variant hover {
      background: black;
    }
  }
}

これは以下のように変換される。

.my-element {
  background: white;
  @media (prefers-color-scheme: dark) {
    &:hover {
      @media (hover: hover) {
        background: black;
      }
    }
  }
}

Tailwind CSS のドキュメント上には指定可能な variant のリストはない模様。

おそらく hover: のようにクラス名の先頭に使えるものは @variant ディレクトリでも使えるはず。

@custom-variant

https://tailwindcss.com/docs/adding-custom-styles#adding-custom-variants

独自のvariantを追加する。

@custom-variant theme-midnight {
  &:where([data-theme="midnight"] *) {
    @slot;
  }
}

追加した variant は theme-midnight:bg-black というようにクラス名の先頭につけて使用できる。

おそらく @variant でも指定可能?

@apply

カスタムクラスに対してユーティリティクラスのスタイルを付与できる。

.select2-dropdown {
  @apply rounded-b-lg shadow-md;
}

@reference

CSSモジュールなどで @apply や @variant を使う場合、ディレクティブで指定するクラスやvariantをあらかじめインポートしておく必要がある。

ただし単純にインポートした場合コードが重複してしまう可能性がある。

そう言った点に配慮して作られたのが @reference ディレクティブ。

外部ファイルをインポートするのではなく参照するだけにとどめることで、コードの重複を抑制できる。

Next.js

https://nextjs.org/docs/app/guides/incremental-static-regeneration

ISR

ビルド時に静的ページを一度生成し、指定した有効時間の間キャッシュとして配信する。

有効時間が過ぎた後の最初のリクエストでは、古いデータを返しつつバックグラウンドで再生成を行う。次のリクエスト以降はその新しいデータを返す。

キャッシュの有効時間が過ぎるとまた同じ動作を繰り返す。

キャッシュと再生成を繰り返すことで、サーバーの応答時間とデータの新鮮さを両方担保する。

revalidate

ルートセグメント設定の一つ。一般的には page.tsxlayout.tsx からエクスポートする。

export const revalidate = 60;

キャッシュの有効時間(秒)を指定する。デフォルトは false で、その場合は「キャッシュが常に有効」として扱われる。(再生成されない)

0 を指定した場合、キャッシュは使用せず常に毎回再生成される。(ISRの「0秒再生成」ではなく、SSR(動的レンダリング)として動作する。)

個々の fetch リクエストに revalidate が設定されている場合はそちらが優先される。

※ 開発環境ではキャッシュ自体が行われないため、 revalidate の値は影響しない。(0を指定した場合と同じ挙動)

page.tsxlayout.tsx のそれぞれで異なる revalidate を設定した場合、最も小さい値がそのルートセグメント全体のキャッシュ有効時間として採用される。

内部的にはフルルートキャッシュ(ページ単位)とデータキャッシュ(fetch単位)の2層でキャッシュを保持する。fetchで revalidate を指定している場合はそれを優先し、フルルートキャッシュも同じ revalidate で保持する。(レンダリング内で複数回fetchを行っている場合、一番小さい revalidate を採用する)

フルルートキャッシュとデータキャッシュで有効時間を揃えることで、キャッシュの整合性を保つ。

dynamicParams

ルートセグメント設定の一つ。一般的には page.tsxlayout.tsx からエクスポートする。

export const dynamicParams = true;

動的なパラメータ(generateStaticParams() で事前に生成されていないパラメータ)を許可するかどうかを指定する。

デフォルトは true で、そのパラメータを使ってページを動的に生成する。(その他設定値により、ISRまたはSSRで動作する)

false に指定した場合、404を返す。

revalidatePath() と revalidateTag()

キャッシュを無効化する関数。

フルルートキャッシュとデータキャッシュの両方を無効化する、らしい。

revalidateTagで使用するタグは各fetchに関連づけられる(任意)タグ。

ページごとのブログ一覧を取得をするfetchに同じタグをつけておけば、一括でキャッシュを無効化できる。