7/30 next.jsフォームとserver actions

日記覚えておきたい

2025/07/30

next.jsで初めてフォームをやった

Server Actionsの特徴

1, "use server"で宣言する

2, asyncであること

3, 関数はActionで終わったほうがいいっぽい

4, 関数なのでどこでも利用できるuseEffect内でも

Form + ServerActions

formのaction属性でserverActionsを呼ぶ

methodはデフォルトで設定されているため呼ぶ必要はない

クライアントで通常のバリデーションを利用できるが、より高度なものが必要な場合zodライブラリを利用しサーバー側で検証する

メールをsendしたかったんだけど、「Resend」というライブラリを利用した。

サイト:https://github.com/Musasi914/portfolio-example