agrismiledev https://blog.hatena.ne.jp/agrismiledev/ AGRISMILE DEV BLOG https://blog.agrismile.dev/ React ChakraUI こんにちは。プロダクト開発部新田です。 今回は小さなスニペットの紹介です。 弊社ではフロントエンドにReact + Typescriptを使用しており、 CSS-in-JSのフレームワークとしてChakra UIを採用することが非常に多いです。 ので以下のコードスニペットは上記の技術構成を前提にしたものです。 ログイン失敗したときにわかりやすくログイン拒否されたことを通知する ログインエラーをユーザーに通知する典型的な方法いくつか挙げると、 window.alert 単に window.alert でエラーを表示する方法は実装がかなり容易ですが、荒削りな印象を与えてしまうと思います。 ログイン… 190 <iframe src="https://hatenablog-parts.com/embed?url=https%3A%2F%2Fblog.agrismile.dev%2Fentry%2Flogin-error-feedback-farmer-motion" title="farmer-motionでログイン失敗時にわかりやすくフィードバックする - AGRISMILE DEV BLOG" class="embed-card embed-blogcard" scrolling="no" frameborder="0" style="display: block; width: 100%; height: 190px; max-width: 500px; margin: 10px 0px;"></iframe> https://cdn-ak.f.st-hatena.com/images/fotolife/a/agrismiledev/20231203/20231203210048.jpg Hatena Blog https://hatena.blog 2023-12-03 21:19:48 rich https://blog.agrismile.dev/entry/login-error-feedback-farmer-motion 1.0 100%