MantineのuseFormでzodを活用する場合のtips
MantineのuseFormでzodを活用して開発をする中で、注意点や便利な活用方法を記事にします。 transformValuesでparse（) useFormでzodを活用する場合は、基本的に毎回useFormで以下のコードを入れるようにしています。 parseを行うことで、不要な値が削除された結果が返却されます。 stripはschemaにstrictを付与していた場合でも、結果を返却するデフォルトの挙動に戻すオプションです。 strictだと不要な項目がある場合はエラーとして扱われます。 これの恩恵を受けるのは具体的に2点あります。 不要な項目をリクエストに設定しない trimなどが反映された状態になる １点目に関して、useFormのinitialValuesにはAPIで取得したデータ（それを画面用に変換したもの）を設定することが多いと思いますが、必ずしもその全てを更新リクエ
eslint-plugin-securityを導入してみるメモ📝 - Madogiwa Blog
Rubyだとbrakemanのようなライブラリがありますが、 github.com JavaScriptでもこういうセキュリティ周りの静的解析系のライブラリがあるのかなと探してみたらeslint-plugin-securityなるものを見つけて個人のサービスに導入してみたのでメモ📝 github.com 導入方法はREADMEの通りですが、以下の通りinstallしてpluiginsに追記するだけです。 $ npm install --save-dev eslint-plugin-security "extends": [ "eslint:recommended", + "plugin:security/recommended" ] 実際に検知できるルールは以下に記載されています。 https://github.com/eslint-community/eslint-plugin-sec
ViteでTypeScript×Reactの開発環境を構築してみた【前編】｜SHIFT Group 技術ブログ
はじめにこんにちは、SHIFTのITソリューション部に所属しているHoribeです。 参画中の案件でフロントエンド開発を担当しており、TypeScriptとReactを使ったプロジェクトを一から立ち上げる機会がありました。今回はViteを使って環境構築したので、その手順をまとめようと思います。 本記事は、Viteというビルドツールに興味があるがまだ使用したことがない人、そろそろCreate React Appから乗り換えようと思っている人などを対象にしています。記事の通りに進めることで以下の効果があります。 Reactを使ったフロントエンドをTypeScriptで開発する環境を構築することができます。 Viteのテンプレートを使用するだけでは不足してしまうポイントと対応方法を知ることができます。 移り変わりが激しいフロントエンド技術について、現時点での最新情報のキャッチアップができます。
React コンポーネントライブラリ 調査/選定メモ
個人的結論 headless を選ぶなら Radix UI + linaria or emotion UI library を選ぶなら Mantine + emotion ツールレベルなら UI library で十分に思うが、プロダクトレベルであれば先々見越してheadless 選んで移植性は高めに保つかなという個人的見解（スピード感にもよると思うが） パフォーマンスを気にするものなら、headless ＋ ゼロランタイムCSS in JS or CSS Modules を選ぶ 2023/4時点 前提/選定基準 個人で開発するフロントエンドアプリ（Gihub&GitlabのPR/MRビューアー的なツール）と、中規模プロダクト(Next.js使用予定)で使用する予定 TypeScript React 18対応 Vite対応 a11y メンテナンス体制 カスタマイズ性（出だしはそこまで必要な
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
