Electron, Flux + ReactHow we built Speak (https://speak.io), a realtime team communication platform using an event sourced architecture and Electron, plus some of the challen…
React and Redux with TypeScript
The release of TypeSciprt 1.6 includes support for React components. I decided to give it a whirl and see what TypeScript has to offer. The end result is a port of the Redux TodoMVC example to TypeScript. (See my repo on GitHub) So why use types in the first place? Isn’t the dynamic and flexible nature of JavaScript what makes it so great in the first place? As strange as it sounds, I actually bel
Reactのバケツリレーに疲れたら - ✘╹◡╹✘
理性捨ててprops全部渡すぞ import Footer from './footer' import Header from './header' import Main from './main' import React, { Component } from 'react' export default class Root extends Component { render() { return( <div className="root"> <Header {...this.props} /> <Main {...this.props} /> <Footer {...this.props} /> </div> ); } }
Electron で Live Dwango Reader（旧 Live Door Reader）クライアントを作ってみる、その三 - Qiita
その三です。徐々にアプリっぽくなってきたかな？というった感じですが、どうでしょうか。レポジトリはこちら。 ソートとフィルタを追加した フィード一覧のサイドバーにソートの変更とフィルタ（検索ボックス）を追加しました。React のコンポーネントを作るレベルではないかなと思い、ベタに HTML を書いて、onchange で監視しています。 ソート・フィルタの変更で毎回データを取得するのもアレですし、データ取得と画面描画を分けました。こういうとき React は楽ですね。フィルタリングしてソートした JSON をレンダーに渡すだけで終わっちゃいます。 キーボードショートカット（と LDR API）を増量 p ： ピンの付け外し c ： 本文の表示・非表示 f ： フィルタ（検索ボックス）に移動 b ： ブラウザで開く キーボードショートカットのフィルタの移動が少々面倒でした。キーボードショート
GitHub のトレンドリポジトリを見逃さない，Trendy をつくりました - はやくプログラムになりたい
僕が1日に1回ぐらいの頻度で見ているページの中の1つに GitHub の Trending repositories のページがあります．このページには言語ごとに日毎・週毎・月毎の単位で GitHub 上で人気のリポジトリがランキング形式で表示されます． 話題になっているライブラリやソフトウェアの一次ソースとして便利なのですが，微妙にアクセスが悪い位置にあり，言語ごとにしか見られません．また，ランキングには常に人気な「常連」リポジトリが多々いるので，新しく話題になっているリポジトリはその中に埋もれがちになってしまいます． そこで，今回はこれらの問題を解決すべく，GitHub のトレンドクライアント Trendy を Electron ベースでつくりました． Trendy - Menubar App to Keep You in the Trend Trendy は GitHub のトレンド
reduxを試してみた(4日目) - redux-react-routerを試す - Qiita
React.jsと組み合わせるfluxのライブラリreduxを試してみた。 このページは作業ログです。やったことをつらつら書くだけなのでまとめません。あしからず。 対象読者 主に自分 今日のゴール redux-react-routerを使ってページ切り替えを実現する redux-react-routerとは？ Reactのラウター(ルーターではない)ライブラリとしてよくreact-routerが使われる。react-routerの機能は十分だが、現在表示しているページという"状態"がアプリケーションに登場する。これもできればstoreに押し込めたい。ということで登場したライブラリ。react-routerをベースにしたライブラリなので、まずreact-routerから見ていく。 react-routerの特徴 ドキュメントの構造とURLの構造をマッピングするライブラリ。最初ドキュメントを読
yahoo/fluxible関連 - Qiita
まだ自分用のメモ書きレベルです… 公式サイトに乗っているQuickStartで作ったプロジェクトを前提に書きます。まだの人は、次のコマンドを打ってください。Windowsの方は後述のTipsに有るスクリプトを定義しないと動かないです。 なお、yoのテンプレートの依存パッケージが古くてうまく動かないことがあるので、最低babelくらいはアップデートしておきましょう。 ディレクトリ構成 actions アクションの定義 (yo fluxibleでは入らないものの作ると便利) components Viewの定義 stores ストアの定義 build webpackの出力ディレクトリ(IDEなど使う場合は除外する) configs ルーティングなどの定義 使用されている(学ぶべき)技術 Babel (ECMA Script6) ReactJS Webpack ES Lint Tips wind
Understanding Redux Middleware
I have been using Facebook’s React since v0.9.x in Feb 2014. I am a defector from Backbone.js which initially started after replacing our view layer with React. After understanding the benefits of Flux and it’s unidirectional flow architecture it became pretty evident that I did not need Backbone.js models and collections anymore. I will assume you have some basic knowledge of Flux, Redux, React,
Full-Stack Redux Tutorial
A Comprehensive Guide to Test-First Development with Redux, React, and Immutable Update 2016-02-24: Updated react-router to 2.0.0. In tests, replaced use of deprecated setProps() with ReactDOM.render(). Also now using the react-addons-test-utils package so that no imports of 'react/addons' are needed anywhere. Update 2015-11-06: Updated to the new Babel 6 release. The Babel packages we need to ins
State Management with Redux
Principal Engineer, type system nerd, Rust enthusiast, supporter of social justice, loving husband & father, avid comic & manga reader, 日本語を勉強してる。 Home About Me @BKonkle YouTube I’m a Software Architect with more than 15 years of experience creating high performance server and front-end applications targeting web and mobile platforms, & today I lead a team at Formidable Labs. Share If you follow R
reactのshouldComponentUpdateについて - Qiita
気持ち ReactのComponentは、stateが更新されるとコンポーネントが丸っと再描画されます。このとき、Virtual DOMのおかげで差分のみがDOMに反映されるので、性能をそんなに劣化させる事なくUI制御をすることが可能になります。 でも、アプリで表示するデータがFBのタイムラインみたいに無限に取得できるような画面の場合、いくらVirtual DOMといえどもさすがに辛いのでは。さらに、もしそのデータがネストしていたら、実際に描画しないとしてもネスト部分のループ処理は行われるわけだよね？実際どうなの？ 調べてみた ということで、jsperfで実際にやってみました。 という感じのネストしたデータを大量に表示するコンポーネントを二つ用意し、一つは何も考えずにコンポーネントを定義、もう一つはshouldComponentUpdateを使って、childrenの配列に変化がなければ（
React.js meetup #2 - 資料一覧 - connpass
「React.js meetup #2」の資料一覧です。
ReactComponentのコンストラクタを追いかけて
Document for ReactMeetup#2 at 20150908
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
react-templatesをさわってみた - Qiita
GitHub - jkup/react-app-starter: :boom: A starter template for webpack and react
GitHub - olegakbarov/react-redux-starter-kit: My best-practices-included universal frontend starter kit
http://www.retalk.org/videos/elegant-react-with-es6-and-a-bit-of-es7
GitHub - nwwells/redux-async: dispatch async actions in redux
どこでも React する
Introduction to Redux
