タグ

javascriptとcomponentに関するtakaesuのブックマーク (3)

  • React Stateless Functional Componentを使うといい9つのポイント!(Class Based との違い)

    React Stateless Functional Componentを使うといい9つのポイント!(Class Based との違い)ComponentReact それではいきます。 1 Classが必要ない constructorをつかわなくてもいいし、コードがシンプルになる。 2 thisが必要ない class based componentではTHISが必要だけど、functional componentではthisがいらない。thisって混乱しやすいから使わなくてもいいのはとっても楽! ちなみに、bindはstatelessのコンポーネントの場合は必要ない。 3 UIに特化できる Stateless function componentはpresentational componentsにとって都合がいい。presentational componentというのはふるまいよりもU

    React Stateless Functional Componentを使うといい9つのポイント!(Class Based との違い)
  • フロントエンドのコンポーネント設計に立ち向かう - Qiita

    ReactVueなどコンポーネントベースで作っていくViewのライブラリが普及したことで、コンポーネント指向での開発が一般化してきた昨今のフロントエンドですが、このコンポーネントの設計に悩まれる方も多いのではないでしょうか。 コンポーネントをどの粒度、どんな状態で分割するのが良いのか、などなど、特にチームで開発する時に認識が揃っていないとカオスになりがちな部分であると思うので、自分なりの設計をする際の指針を言語化しようというのが記事の目的です。同じように悩まれている方にも何らか示唆を提供することができたら嬉しいです。 想定読者 「コンポーネント設計?なにそれ?おいしいの?」という方 初めてコンポーネント設計でアプリ作ってみたけど、当にこれでいいのか自信の無い方 はじめに: "コンポーネント"とは まず最初に"コンポーネント"という言葉についてですが、ここでは「GUIのパーツをモジュー

    フロントエンドのコンポーネント設計に立ち向かう - Qiita
  • React Componentのスタイルガイドを自動生成してパーツの再利用をしやすくする - KAYAC engineers' blog

    こんにちは。カヤックのReactおじさんこと島津です。 最近はVue.jsにも浮気し始めましたが、Reactについての記事を書きます。 Reactのコンポーネントが増えてきて管理が大変 Reactを使うとコンポーネントの部品化が捗りますが、 開発規模が大きくなってくるとその数も増えてきて管理が大変になってきます。 スタイルガイドを導入 スタイルガイドとは、UIパーツの用例と実表示例をまとめたドキュメントのことです。 これがあるとパーツの再利用性が高まります。 例:Codepenのスタイルガイド 人力で手書きしていっても良いのですが、更新が追いつかなかったりするので自動生成する仕組み化ができるツールを使いましょう。 代表的なものとしては、CSSのコメントからドキュメントを自動生成してくれるkss-node などがあります。 今回はCSSだけではなく、Reactのコンポーネント単位でドキュメン

    React Componentのスタイルガイドを自動生成してパーツの再利用をしやすくする - KAYAC engineers' blog
  • 1