フォームについて...有効性チェック(feat.formik)

社内のプロジェクトでは、
たくさんの表を管理した.

フォーム処理(サーバに送信)だけではありません.
有効性処理などの形式が使われているので、やるべきことはたくさんあります.
既存のプロジェクトでは、formikという名前のライブラリを使用してステータスを管理し、各ページのフォームが増えるにつれて、そのformikライブラリの処理
長すぎます
この表について知りたいです.

formとは?

ユーザーがWebサイトに情報を送信できる入力ウィンドウ
JavaScriptユーザーとしてのフォームの使用
formタグを使用してどこからどこまでformを使用するか
範囲を画定する.

<form>
   <input.....
</form>

フォームタグ

フォームタグコンポーネント

<form 
   1.action : 서버 url (ex action="/url-323")
   2.method : 요청처리방법 (ex method="get", default 로 get이간다 )
   3.name   : form 식별 이름 
   4.novalidate : 검증수행안함 - form 전송시 입력된값 검증 수행 않음 
   />

フォーム検証

フォーム:ユーザーがWebサイトに情報を送信できる入力ウィンドウ
表示
ユーザーが入力した値が正しいかどうかを確認する必要があります.
これがフォーム検証です
このフォームの検証には、次のものが含まれます.
クライアント側と
サーバー側にチェックがあります.
クライアントのチェック内容は次のとおりです.
サーバに負荷をかけなくてもよいが,ユーザが検証結果を操作しやすいという欠点がある.
サーバでのチェックは次のとおりです.
前述したように、サーバ側がチェックを行うと、もちろんサーバ側がチェックを行うと負荷が増加します.

フォームライブラリ

react側にはフォームステータス管理ライブラリがあります

formik

react Hook Form

など、これらのライブラリはformステータス管理を提供し、私たちのチームもformikを使用しています.
ここではyupというライブラリを使用して有効性チェックを行います
従来のように、ある問題に代替品(ライブラリ)を使用する場合は、対応する代替品を理解し、コードの長さを延長する必要があります.
一連の例
formikは他のチームから事前に借りたものです.
同僚のコードを理解して再利用するのに時間がかかり、使用上は自然に可読性の悪いコードしか書けません.

リファレンス

優雅な情報フォーマット:
https://www.youtube.com/watch?v=Z2YJvBw3pPI&list=PLgXGHBqgT2TvpJ_p9L_yZKPifgdBOzdVH&index=15