タグ

2015年10月30日のブックマーク (8件)

  • rackt.org [17]

    taka222
    taka222 2015/10/30
  • 人気のFluxフレームワークReduxをさわってみた - マルシテイア

    fluxフレームワーク、今は Redux が一番アツい様子なので触ってみた。 github.com (追記 2015-10-03 18:15 APIや用語が大幅に変わったので更新した) Redux の経緯 2015-05-30 に公開された "The Evolution of Flux Framework" という記事がある。 medium.com Reduxはその PoC 的な実装だったんだけど、実用的ということでめっちゃ流行っているみたい。 Initial commit も 2015-05-30 だった。 Initial commit · rackt/redux@8bc1465 · GitHub 最近の flux フレームワークだと fluxible と flummox が人気だったけど、 flummoxのページには 4.0 will likely be the last major

    人気のFluxフレームワークReduxをさわってみた - マルシテイア
    taka222
    taka222 2015/10/30
  • React に対する感情とかコンポーネント管理ライブラリの選定とか

    コンポーネント管理できそうなライブラリの選定 ここでいうコンポーネントは HTML 要素をコンポーネントに見立てるような、近代 Web フロントエンドにおける狭義のコンポーネントです。大まかな条件は次の3点。 コンポーネント中心の開発ができること >= IE9 をサポートすること(切っても良さそうなんだけど...) 既製品・スクラッチは問わないが極端なリスクは踏めない(納期がシビア) あとは期待度や API のセンスなど、個人的な審美眼判定に依ります。 angular/angular : 2.0 が正式リリースしたらまた会いましょう jashkenas/backbone : 最近のコンポーネント管理には及ばない Custom Elements ( Polymer ) : polyfill が >= IE10サポート segmentio/deku : 振る舞いは十分だったけど、>= IE10

    React に対する感情とかコンポーネント管理ライブラリの選定とか
    taka222
    taka222 2015/10/30
  • React.jsのComponent Lifecycle - Qiita

    今回はComponentのlifecycleについて書きたいと思います。 React.jsではComponentの状態の変化に合わせて色々メソッドを呼んでくれるのでそれに合わせて初期化や後始末な処理を書くことが出来ます。 よく使うのはcomponentDidMountやcomponentWillUnmount辺りです。 イベントの登録をcomponentDidMountでやってcomponentWillUnmountで解除するというのがよく使うパターンだと思います。 componentWillMount() ComponentがDOMツリーに追加される前に一度だけ呼ばれます。 なので初期化処理を行うのに適しています。 この中でsetStateするとrender時にまとめて行われます。 server-side rendering時にも呼ばれるのでどちらでも動くコードである必要があります。 c

    React.jsのComponent Lifecycle - Qiita
    taka222
    taka222 2015/10/30
  • React.jsのComponentについて - Qiita

    // ダメ render() { return ( <div>title</div> <div>contents</div> ) } // OK render() { return ( <div> <div>title</div> <div>contents</div> </div> ) } また、renderメソッドはどのタイミングで何度呼ばれるかわからないので必ず冪等性がある実装にする必要があります。 Separation of concerns? ところで、React.jsではComponentとして、マークアップとViewのロジックをcreateClassの中に書いていくのですが、他のフレームワークのようにマークアップはHTMLやmustacheで書いてViewのロジックをJSで書くみたいに分かれてなくて気持ち悪い!という人もいるのではないでしょうか? それに対して、React.j

    React.jsのComponentについて - Qiita
    taka222
    taka222 2015/10/30
  • React.jsのComponentについて - Qiita

    // ダメ render() { return ( <div>title</div> <div>contents</div> ) } // OK render() { return ( <div> <div>title</div> <div>contents</div> </div> ) } また、renderメソッドはどのタイミングで何度呼ばれるかわからないので必ず冪等性がある実装にする必要があります。 Separation of concerns? ところで、React.jsではComponentとして、マークアップとViewのロジックをcreateClassの中に書いていくのですが、他のフレームワークのようにマークアップはHTMLやmustacheで書いてViewのロジックをJSで書くみたいに分かれてなくて気持ち悪い!という人もいるのではないでしょうか? それに対して、React.j

    React.jsのComponentについて - Qiita
    taka222
    taka222 2015/10/30
  • Show or hide element in React

    I am messing around with React.js for the first time and cannot find a way to show or hide something on a page via click event. I am not loading any other library to the page, so I am looking for some native way to use the React library. This is what I have so far. I would like to show the results div when the click event fires. var Search= React.createClass({ handleClick: function (event) { conso

    Show or hide element in React
    taka222
    taka222 2015/10/30
  • JavaScriptのイベントハンドラ一覧|イベント|JavaScript/DOM|PHP & JavaScript Room

    イベントハンドラ一覧 onBlur/onFocus〔フォーカスが移動した時に処理を行う〕 onChange〔フォームの入力値、選択が変更されたときに処理を行う〕 onSelect/onSelectStart〔テキストが選択された時に処理を行う〕 onSubmit/onReset〔フォームの送信時、リセット時に処理を行う〕 onAbort/onError〔画像読み込み時に処理を行う〕 onLoad/onUnload〔ページ読み込み時、ページの切り替え時に処理を行う〕 onClick/onDblClick〔クリック、ダブルクリックされた時に処理を行う〕 onKeyPress/onKeyDown/onKeyUp〔キーの状態に応じて処理を行う〕 onMouseOut/onMouseOver/onMouseDown/onMouseUp〔マウスを乗せたり離した時、マウスでクリックした時に処理を行う〕

    JavaScriptのイベントハンドラ一覧|イベント|JavaScript/DOM|PHP & JavaScript Room
    taka222
    taka222 2015/10/30