Day 10

early exit pattern

コードのメンテナンスに役立つモードと例外処理を一致するようにオフにします.
そうしないで、下に置くのは散らかっていて、維持しにくいです.
return機能は、以下に何があっても戻り、終了します.

APIタイプスクリプト

その他のインストーラ、apollo、next.jsなどを使用する場合、タイプスクリプトプロンプトを使用するには、それに一致するタイプを適用する必要があります.使用するタイプは異なり、通常はタイプに関連するライブラリも適用されます.
APIのインストール方法
restapiなら自分で見るべきですがgraphqlはGraphql-codegenを使って自動的に生成します
インストール方法:www.graphql-code-generator.com

yarn add -D @graphql-codegen/cli

yarn add -D @graphql-codegen/typescript

後の親フォルダに(Package.jsonが存在する場所)ファイル、codegenを作成します.ymlファイルの作成

schema: http://localhost:3000/graphql
generates:
  ./src/commons/types/generated/types.d.ts:
    plugins:
      - typescript
    config :
      typesPrefix: I     

アドレスとgraphql codegenコマンドを挿入してschemaをダウンロードします.
通常はcommons/new/types/generatedフォルダに格納されます.
≪生成｜Generate｜ldap≫:位置を変更します.
ターミナル、npx graphql-codegen
ファイルの前にIを付けるのでconfig:typesPrefix:I(インデント注意)
commons/types/generated/types.d.tsが変更された場合、設定が完了します.
後でどのように応用します
変異はデータと入力データ(変数)からなる

    const [createProduct] = useMutation<IMutation, IMutationCreateProductArgs>(CREATE_PRODUCT)

Immutationから受信するデータのデータ型を指定

useMutation<Pick<IMutation, 'createProduct'>,

ピックはインポートする情報を選択します

これで私が入れることができる情報が何なのか、あるいは赤い線が現れます.
このように応用すると、command+Iを押すと何が入っているかがわかります.

コード構文規則

コードリン/eslint(ある程度のフォーマット機能を備えています)
ex)importシーケンス==禁止、==許可
構文規則を指定する機能
コードフォーマット/きれいなレイヤ
ex)スペース2マス、00を超える長さで改行
インストールeslint

yarn add eslint --dev 
yarn run eslint --init
//enforce code style까지 체크,javascrpit체크, react체크, yes체크, Browse체크, popular style 체크, standardㄱㄱ, javascrpit체크, yes체크 근데 에러나면, node_moduels폴더 지우고 yarn install 다시 실행 안되면 pakage lock json, yarn lock 도 지움 -> 다시 add , init, yarn dev, 이후 다시 node_modules삭제 후 yarn installㄱㄱ

以降のextionにeslint,pages/appをインストールします.jsに行って赤い糸があるかどうか見てみましょう
赤い糸があれば間違いがあるわけではありません.反応部分などは消してもいいです.
eslintrc.帰る

"rules": {
        "react/react-in-jsx-scope" : "off"
    }

後のprettyerインストール
echo {}> .prettierrc.json
糸add--dev--正確にはきれいな後のprettyrrcです.jsonが存在するかどうか
その後のprettyerインストール、npm install--save-dev eslint-config-prettyer
eslintrs.jsセクションのextends:セクション下部のprettyer->赤い線が消える
あとはpretierc.jsonマスクは設定できます
また、プロファイルを共有するための設定が必要です.
最上位フォルダにあります.vscodeフォルダのsettings.jsonの追加
{
"editor.formatOnSave": true,
"editor.defaultFormatter": "esbenp.prettier-vscode"
}
、Prettyer Extensionのインストール

安全なGIT

npx eslint . そうすると間違いが見えます...
あとhiskyに設定して、間違いをつかまえないと上がれない…?
yarn add husky@4 --dev
yarn add lint-staged --dev
これでは更新できないのが普通、例外処理
フォルダにあります.無視するファイルをeslintignoreに追加
/src/commons/types/generated/types.d.ts
…安全ですが、エラーがつかめないとアップできませんハハ
コメント機能はprompt(「パスワードを入力してください」)部分的に利用し、
constmypassworkd=prompt(「パスワードを入力してください」)セクションに保存
コメントを受信する機能の追加