タグ

関連タグで絞り込む (1)

タグの絞り込みを解除

Reactに関するaminisiのブックマーク (11)

  • react.rocks - react リソースおよび情報

    This webpage was generated by the domain owner using Sedo Domain Parking. Disclaimer: Sedo maintains no relationship with third party advertisers. Reference to any specific service or trade mark is not controlled by Sedo nor does it constitute or imply its association, endorsement or recommendation.

  • react.rocks - react リソースおよび情報

    This webpage was generated by the domain owner using Sedo Domain Parking. Disclaimer: Sedo maintains no relationship with third party advertisers. Reference to any specific service or trade mark is not controlled by Sedo nor does it constitute or imply its association, endorsement or recommendation.

  • React-0.13でpropTypesを違和感なく記述する - R42日記

    最近、とある業務システムの一部となるリッチ画面をReactで開発してます。 Reactは良く出来ていると思います。 できるだけステートレスにすることで安全なコードを記述するという思想は僕の好みです。 Fluxも同じく良い。『処理の流れは一方向。何も考えずにイベントを処理し続ければ良い』という、ある種のストリーミング的な発想により、非常に見通しの良い構成を実現できます。 Fluxのフレームワークは乱立気味ですが、色々比較した結果、僕はrefluxを選びました。 そんなに多機能じゃないので自分で魔改造しやすいところがナイス。 React-0.13から使えるclass構文 最近リリースされたreact-0.13からES6のclass構文を使えるようになりました。 reactに付属するJSXTranformerでパースできるようになったとは言え、 イマドキReactを使うような人は当然Babelで

    React-0.13でpropTypesを違和感なく記述する - R42日記
  • Reactでhigher order componentsを試してみた - Qiita

    Higher Order Componentsとは 自分の雑な理解では react componentをラップして様々な拡張性を与えられるテクニックのこと 詳しくはこちらを読むとわかると思います。 ReactのHigher Order Components詳解 : 実装の2つのパターンと、親Componentとの比較 http://postd.cc/react-higher-order-components-in-depth/ propsをrenderした後から更新したくなった 離れた場所にrenderしたcomponent同士をどうにか連携できないものか(この設計の是非は脇に置いといてください…)という課題がありまして、 例えば2カラムのレイアウトのページで、メインカラムとサイドバーにそれぞれcomponentをrenderしていたとします。 サイドバーの何かをクリックすると、メインカラ

    Reactでhigher order componentsを試してみた - Qiita
  • React Redux Real World Examples 〜先人から学ぶReact Reduxの知恵〜

    React Reduxを使ってプロダクトを作りはじめて、かれこれ半年くらい経ちます。 しかし、どうもうまく書けていない気がすることがときどきあり、悩んでいたところ、ツイッターで次のような助言をもらいました。 @__tai2__ 達人かどうかは微妙なところがありますが、ある程度の規模のコードはここにリンク集あります https://t.co/B79B5s1DTe — Yuki Kodama (@kuy) 8 December 2016 この記事は、上記のリンク集でまとめられている実際のReact Reduxプロダクトのソースコードを調査することで、筆者がふだんReact Reduxで開発をしていて感じる疑問への答えを探る試みです。 筆者が答えを得たいと思っている疑問は次の3つです 1 Storeはどんな具合に階層化すべきか Store初期化(hydration)用データの定義はどうすべきか

    React Redux Real World Examples 〜先人から学ぶReact Reduxの知恵〜
  • React Starter KitにみるWebフロントエンドに求められる機能と実装 - LINE ENGINEERING

    初めまして、IT戦略3チームでUIUXデザインと社内プロジェクトTech Leadを担当している高村といいます。この記事では、React Starter Kitという汎用的なWebプロジェクトテンプレートの実装を参考にしながら、改めて、なぜWebフロントエンドは複雑なのか、その解決方法は何かを振り返ってみたいと思います。この記事をきっかけとして、実際に現場でツール選定を行うフロントエンド開発者の方だけでなく、普段「フロントエンドには時間をかけたくない」と思っているサーバサイド開発者やWebディレクターの方たちに、「だからフロントエンドの課題は収束しにくいんだな」「フロントエンドといっても範囲は広いから、目的やユースケースを絞ってツールを選定しよう」と感じていただければ幸いです。 この記事はLINE Advent Calendar 2017の10日目の記事です。 Webフロントエンドの複雑

    React Starter KitにみるWebフロントエンドに求められる機能と実装 - LINE ENGINEERING
  • Redux-Sagaでテトリス風ゲームを実装して学んだこと - Qiita

    はじめに React #1 Advent Calendar 2017の11日目です。 Reduxのミドルウェア「Redux-saga」で「やや複雑なリアルタイムゲーム」としてテトリス風のゲームの基部分を開発し、それを通じて学んだこと・感じたことを紹介します。 画面例 まずは実装したテトリス風ゲームの画面例。矢印キーの左右下でピースを動かし、z,xで回転です。 実際にこちらから遊べます。ソースコードはこちらから。 テトリス風ゲーム実装を通じて学んだこと Redux-Sagaの効用として良く言われるのは、「作用を分離する」とか「テストを簡単にする」ということです。それ以外に、今回、ゲームの実装を通じて思ったこと、思いついたことをつらつらと書いていきたいと思います。 利点1. ビューからビジネスロジックを分離する 利点2. ロジックとロジックの間を疎結合にする 利点3. ロジックフローの明確化

    Redux-Sagaでテトリス風ゲームを実装して学んだこと - Qiita
  • React-Reduxのイベントハンドラ定義に関するTips/Pitfalls - Qiita

    return <button onClick={(event) => { console.log('clicked!!') }}>ボタン</button> // ↑これ イベントハンドラに関する情報で、格的な実装を始める前に知っておいた方が良さそうな点を中心に紹介します。 ReactのSyntheticEvent(ブラウザネイティブイベントのラッパー) Reactのコンポーネントで発生するイベントは、ブラウザネイティブのイベントをラップしたものになっていて、ブラウザ間差異がある程度吸収されています。参考 → 公式Doc APIの違いなどはほとんど無いです。気をつけるのは以下の2点くらい。 関数内でreturn false;してもイベントの伝搬が止まらない。 止めたいときは明示的にevent.stopPropagation()などを呼びます。 非同期的にEventオブジェクトを参照したい場

    React-Reduxのイベントハンドラ定義に関するTips/Pitfalls - Qiita
  • 最近のReact/Redux周り晒す - Qiita

    Nextremer Advent Calendar 2017の2日目。 一年ほどReact/Redux使って開発してきたので、ここらで一度現在のReact/Redux環境周りを晒してみる 歴史 2016/4〜 流行りにのって、React/Reduxを採用 この頃はMiddlewareにはredux-thunkを利用 2016/6〜 激しくスパゲティ化してしまい、thunkでの運用に限界を感じたため、thunkの利用を諦め、redux-sagaに鞍替え この頃から複数のプロジェクトReact/Reduxの運用を開始 2017/6〜 Reduxの通常構成(Action, Reducer, Saga)の冗長さに辟易していたので、Ducksパターンの採用を検討。 その際、Moducksという素晴らしいライブラリを発見したため、これを採用した。 同時に、Reducerから取得した値をViewで加工

    最近のReact/Redux周り晒す - Qiita
  • イマドキWebフロントエンド環境とReactを触りながらサンプルを10本書いてみた

    はじめに Webフロントエンドの知識がjQueryで知識が止まっていたので、モダンなWebフロントエンドに触れてみた。そのメモ。 良かった点 「今はこうなっているのかー」と分かった。今後はナウい記事を読んでもビビらないと思う。 Reactのすごさ 触ってみて下の記事のいうことが理解できた。何がすごいの?と聞かれたら下の記事を掻い摘んで説明したい。 Reactを使うとなぜjQueryが要らなくなるのか 触ってみたもの ES6 Yarn Webpack Babel Sass/SCSS React とりあえずエディタ開いてHTMLを書くぞというタイプの人間だったので、フロントエンド開発にまずはコマンドラインを打って環境を構築する点が新鮮。自動化できるところはツールで共通化してラクできるところはラクをする、というのは分かった。Reactは使うか分からないが、Webpack/Babel/SCSSは絶

    イマドキWebフロントエンド環境とReactを触りながらサンプルを10本書いてみた
  • ReactComponent のリファクタリング指針 - freee Developers Hub

    エンジニアの id:t930 です。 freee Developers Advent Calendar 2017 19日目いきます。 React はその名前を聞くようになってから3年以上が経過し、Webアプリケーション開発の文脈においてはもはや枯れた技術と言えるでしょう。会計freeeでも2015年ごろに Backbone.js から React へのリプレースを行い、現在では Reactコンポーネントだけでも900近いファイルが存在しています。当然このような規模でやっているとリファクタリングも必要になってくるわけで、記事ではそんな中で得られたReactコンポーネントにおけるリファクタリングの指針について紹介していきます。1 適切な単位に分割する React に限った話ではないですが、巨大で見通しの悪いコンポーネントはメンテナビリティや再利用性の低下を招きます。表示領域、責務、意味付けに

    ReactComponent のリファクタリング指針 - freee Developers Hub
  • 1