プログラミング

[react] useEffectが実行されるタイミング

概要 reactのuseEffectフックは第2引数によって実行されるタイミングが異なる。第2引数なしレンダリングされる度に実行されるクラスコンポーネントのcomponentDidUpdateメソッドと同等第2引数が空配列マウント時のみ実行されるクラスコンポーネントのcomponentDidMountメソッドと同等第2引数が変数を要素に持った配列マウント時および変数が更新された際に実行される...

2023.03.16

React

[WordPress]Advanced Custom Fieldsの日付に曜日を表示させる方法

概要 WordPressのAdvanced Custom Fieldsプラグインを使って作成した日付型カスタムフィールドは日付しか表示されないため、テーマファイルに曜日表示処理を追加してみました。修正前 <?=get_field('the_date')?>  修正後 <?php $week = array( "日", "月", ...

2023.03.04

WordPress

[WordPress]投稿ページや固定ページのテンプレートが反映されない？

概要 WordPressのテンプレートには優先順位がある。固定ページであればpage-xxx.php⇒page.php⇒singular.php⇒index.phpの優先順位となっている。 singular.phpは投稿と固定ページの両方で適用されるファイルであり、古いWordpressにはなかったものである。これを知らないと、index.phpが適用されていると勘違いしてしまうことになる。 ...

2023.03.03

WordPress

[WordPress]Contact Form7で確認用アラートを表示させる方法

概要 WordPressのContact Form 7プラグインでは、送信ボタンをクリックするとすぐに送信が実行されてしまう。 Contact Form 7 add confirmなどのプラグインを使えば確認画面を表示させることができるが、確認用アラート（JavaScriptのconfirm）を表示するだけであればプラグインを使わずに実装することができる。手順 1. Contact Form 7...

2023.03.02

WordPress

Node.js

jwt.verify()でRight-hand side of ‘instanceof’ is not an objectとなる原因

概要 npmのjsonwebtokenパッケージのverifyメソッドを使ってjwt.sign(token, 'hoge');のようにJWTトークンをデコードするとRight-hand side of 'instanceof' is not an objectとなり例外が発生してしまうことがある。原因 jsonwebtokenのバージョン9はNode.js環境では問題ないが、ブラウザ上では正常に...

2023.01.28

Node.js

MongooseでlocalhostのmongoDBに接続できない原因

概要 localhostだと接続できないが127.0.0.1だと接続できるとのこと。 OK mongodb://127.0.0.1:27017/xxx import mongoose from 'mongoose' const connectDB = async () => { try { await mongoose.connect('mongodb://127.0.0.1:27017/xxx'...

2023.01.22

Node.jsサーバ

【TypeScript】typeとinterfaceの違い

概要 TypeScriptで型を定義するには、typeまたはinterfaceを使う。 typeとinterfaceには細かい違いはいくつかあるが、普通に型を定義するだけであれば違いはない。混在するとわかりづらくなるため、どちらを使うかプロジェクト内で統一するとよい。定義方法の違い typeは代入、interfaceは宣言 type type User = { name: string; ag...

2022.11.05

TypeScript

[WordPress] パスワード保護されたページからログアウトする方法

概要 WordPressでパスワード保護されたページにログインすると、10日間はログイン状態となりパスワードの再入力が不要となる。ログアウトする方法は提供されていないため、自分でクッキーを削除する必要がある。ログアウトする方法 Google Chromeの場合 Google Chromeのメニュー⇒表示⇒開発 / 管理⇒デベロッパーツール、を選択（またはF12キーを押下）してデベロッパーツール...

2022.10.01

WordPress

[WordPress] デフォルトエディターの変更方法（クラシックエディターとブロックエディタ）

概要 WordPressでClassic Editorプラグインをインストール・有効化した後、投稿の新規追加画面を開いた際の初期エディター（デフォルトエディター）を変更する方法をまとめました。設定方法 Classic Editorプラグインをインストールすると、ユーザー編集画面（管理画面>ユーザー>編集）に「デフォルトエディター」という項目が追加されるので、そこで変更可能。管理画面>ユーザー>...

2022.07.23

WordPress

[WordPress]認証処理をAPI等の独自処理にカスタマイズする方法

概要「WordPressのログイン処理にて、WordPressのユーザーアカウントではなく別の認証（APIなど）を使ってログインさせる方法」を検索してみたが見当たらなかったため、自分で実装してみた。実装 functions.phpでafter_setup_themeフックに処理を追加する。独自の認証方法でログインに成功した後は、特定のWordPressユーザーとしてログインさせる。以下の例の場...

2022.06.25

WordPress