React開発の仕事の際、どのような順序でコーディングしますか？

フリーランスエンジニアをしています。
主にインフラ部分の業務をしているのですが、スキルアップのため現在Reactについて学習中で、ゆくゆくはアプリ開発などをしていきたいと思っています。
そこで、仕事でreactを扱う際にどのような順序でコーディングするのか知りたいです。
・スタイリング
・イベントハンドリング
・API統合
・その他（あれば）
皆さんはどの順序で実装していきますか？お勧めの順序を教えて下さい。
1年前
view数 88

    回答を投稿して企業にアピールしましょう！

    Q&Aで投稿された回答は、
    企業側に表示されるプロフィールにも投稿履歴として表示されます。

    Offersにログイン・新規登録して、気になるテーマやトピックを話してみよう！

    簡単1分登録(無料) ログインする

    ＼回答があります！／

    • 西岡芳朋

      エンジニア

      1年前

      以下、わたしのモデルケースになります。

      【参考情報】
      質問者様と同様ちょうど昨年2023年から、スキルアップのためReact学習→案件参画した者です。

      【回答】
      ・スタイリング
      　→優先度:低。そこまで重要では無い印象です。やってく内身につく、くらいの感覚で良いと思います。
      　　わたしの居た現場ではMaterialUIを導入していました。TailwindのようなCSSフレームワークは導入していなかったです。

      ・イベントハンドリング
      　→優先度:中。ボタンクリックみたいな簡単なもの 〜 一覧レコードのドラッグドロップなど少し複雑なものまで、幅広く扱った印象です。
      　　複雑な画面やイベントは後述するライブラリでの実装を学習されるのも良いかもしれません。

      ・API統合
      　→優先度:高。実務ではバックとの連携が当然あるため高い印象です。async/awaitはじめ非同期処理は理解しておいた方が良いと思いました。

      ・React-Hooks
      　→優先度:★超高★。Reactの肝になります。useState, useEffect, useCallbackなどの基礎的なものは抑えた方が良いです。
      　　実務ではおそらく状態管理ライブラリ導入が必須になります。メジャーなライブラリ(Reduxなど)は学習された方が良いかもしれません。

      ・バリデーション
      　→優先度:高。一番メジャーなのはReact-Hook-Form(RHF)と聞きます。わたしの居た現場でも使ってました。
      　　現場ではYupなどのバリデーションルール + RHFを組み合わせて使う場合が多いと思います。

      ・その他ライブラリ
      　→優先度:中。ドラッグドロップのreact-dnd、モーダル/モーダレスのreact-rnd、MaterialUiなどのUIライブラリなどなど。
      view数 45