React.js 実戦投入への道 - Qiita
最近話題のReact.jsですが、実戦投入に当たっては結構重たい選択を迫られることになります。 ざっくり言えば、テンプレートエンジンを捨ててReactしますか?それともReactあきらめますか?という選択です。 本記事ではReactの基本思想とこうした選択肢が生まれてしまう背景を述べるとともに、後半では「どちらもあきらめない」という(若干シミュレーションRPGあるある感のある)第三の方策について案を提示します。 Reactの基本 最初に、Reactの基本的な仕組みについてまとめておきます。 Reactは公式ドキュメントが非常に充実しているので、始める際はぜひQuick Startのドキュメントに目を通すことをお勧めします。 Getting Started Tutorial Thinking in React 後述しますが、Reactを使ってアプリケーションを作る際の設計方法についての記載が
今話題のReact.jsはどのようなWebアプリケーションに適しているか？ Introduction To React─ Frontrend Conference
今話題のReact.jsはどのようなWebアプリケーションに適しているか？ Introduction To React─ Frontrend Conference 外村 和仁（株式会社 ピクセルグリッド） 本記事は、2015/2/21に行われたFrontrend Conferenceの「Introduction To React」の内容を紹介します。 当日の資料は以下にアップされていますので、こちらも参照してください。 Introduction To React // Speaker Deck React.jsとは何か React.jsはFacebook製のJavaScriptライブラリです。 http://facebook.github.io/react/ 公式サイトに、「A JavaScript library for building user interfaces」とあるように、R
React入門用に簡単なアプリケーション作ってみる - yutaponのブログ
React入門系の記事はもう結構出尽くしてる感ありますがせっかくなので私も。 今回はReact v0.13RC2を使って↓のアプリケーションを写経してみます。（Authorは私ではありません） 見ての通り、抵抗の値を計算するアプリケーションです。 Reactで書かれていたり、SVG使ってたり面白いソースですね。 ちなみに抵抗の色の仕様はこのようになってます。 抵抗のカラーコード はじめに React v0.13RC2を使う理由は現時点で最新版ということと、v0.13.0beta1でES6のclass構文が使えるようになったからです。 jsfiddleのソースは1ファイルにまとめて書かれていますが、これを1コンポーネント1ファイルに分割して書いてみます。 React(JSX)のビルドにはBabelが使えるので、前回作ったスケルトンの上に作っていきます。 設計 jsfiddleのJSソースの一
「React / Flux を実案件で使ってみた」その後
改めて覗いてみよう 1) CheckboxWithLabel changes the text after click: AssertionError: # /path/to/test/components/CheckboxWithLabel_test.jsx:21 assert(label.getDOMNode().textContent === 'On') | | | | | | "Off" false | HTMLLabelElement{htmlFor:"",form:null,accessKey:"",control:HTMLInputElement{src:"",valueAsNumber:NaN,incremental:false,defaultChecked:false,form:null,multiple:false,list:null,size:20,checked:f
Home | Aurelia
Why Aurelia? Join thousands creating next-generation apps. Easy to Learn Aurelia's standards-based, unobtrusive style makes it the only framework that empowers you to build components using vanilla JavaScript or TypeScript. If you know modern JS and HTML, there's little more to learn to build even the most complex apps. High Performance At the core of Aurelia is a high-performance, reactive system
React / Flux を実案件で使ってみた
自己紹介 Name : Takuto Wada github : twada twitter : t_wada hatena : t-wada TDD とライオンの人 power-assert の人 React / Flux を知ったきっかけ mizchi さんのエントリ (あなたがReactを使うべき理由) だったと思う 日本語の情報はほとんど無かったが、エッジ系の人たちが騒ぎ出した & 海外で圧倒的に事例が増え出したので興味を持った Rendr の AirBnb が React を使い始めたことを知り、これは決定的だと思った React をどう勉強したか 公式ドキュメントとチュートリアルが充実している まず Tutorial をそのまま写経 次に browserify + reactify で Tutorial をもう一周やってみる (showdownはbrowserify 対応してい
Flux react現状確認会
2. 前提となる適用先 • 管理画面的なWebアプリケーションのリニューアル …だったもの（仮） • REST APIを前提としたSingle Page Applicationもどき （※すべてが1ページではないけど） • 機能・画面が多い • 複雑化することがほぼ確実 3. Viewへの要求事項 • 統一されたスタイルでUIとなるHTMLを生成できる • なるべく簡単に書けること（含セキュリティリスク回避） （生DOM・jQueryはあり得ない） • 業界におけるパラダイムが過渡期のため、 巨大フレームワークに乗っかりたくは無い （交換可能な部品の組み合わせでプレーンに） • 困ってもなんとか出来るための緊急ハッチも必要
TypedCoffeeScript on flowtypeの可能性 - mizchi's blog
僕はcoffeescriptは人類がプログラミングにおいて堕落するために手に入れた最高のゆるふわ文法だと思っていて、これを殺すわけにはいかない、という気持ちがある。で、es6/typed annotationが跋扈するこの時代にふさわしいものに改造されないといけないとも思っている。最近だと、正直coffeescript方面のイノベーションはあんまりない。 そういうわけで、ちょっと前までtyped-coffee-scriptを作ってたんだけど、現状ある種の問題を迎えていて、開発が半年ほど止まっている。それをどうするかということを考えた結果、別の型付きaltjsに乗りゃいいじゃん、という発想に至った。 altjs on altjsってどうなの、っていう問題もあるが、基本的にflowtypeもtypescriptもes6~以降との標準化追従する方向性であり、そう大きな問題になることはない、と認識
React.jsとFlux - Qiita
今回はReact.jsとも関わりがあるFluxについて紹介したいと思います。 Flux is Architecture ↑の図はfacebookのfluxのリポジトリにあるものですが、Fluxは上記のようなArchitectureの名称です。facebook/fluxのrepositoryに行ってもらうとわかるのですが、実装としてはDispatcherの部分があるだけです。 Unidirectional data flow 先ほどの図を見てもらうとわかる通り、Fluxではアプリケーションの複雑さをなくすため、データの流れを一方向にします。 そのため全体の処理の流れはわかりやすくなりますが、Angular.jsなどで書くときに比べて冗長に感じることもあるかと思います。 しかしながら単純なデータの流れを作ることで、ある程度の規模になってアプリケーションが複雑化してもデータやイベントの流れがスパ
What’s Flux? - albatrosary's blog
JavaScriptフレームワークがMVCであろうがMVVMであろうがMVPであろうがこういったことを議論するよりもまずは手を動かそうというのはとても理解できる話だと思います。作っているときに各モジュールをどう構造化するかが悩むことがありますが、その時に「こうやれば効率がいい」というものを見極めることも重要と思います。 MVC vs MVVM vs MVP. What a controversial topic that many developers can spend… 特にエンタープライズでは小川充(HTML5Experts.jp コントリビュータ)氏や酒巻瑞穂(HTML5Experts.jp コントリビュータ)氏が考えている通り、各モジュールをどのように構造化し開発ライフサイクルを運用するかが必要となります。こうした意味合いにおいて「Flux」という考え方が参考になるのではと思い資
Elmで始めるFunctional Reactive Programming
※注意 現在のElmは、これを書いた時とはかなり別物になっています。そのためElmを学ぶにはこの資料は適切ではありません。Functional Reactive Programmingの習得には参考になると思います。 ===== ElmはHaskellと同じく純粋関数型言語のひとつで、ブラウザ上で動くアプリケーションの作成に特化しています。目に見えるものがすぐに作れるなど、関数型プログラミングやFRP(Functional Reactive Programming)の入門によい面がいくつかあります。JavaScriptなど型のない手続き型言語に慣れた人向けに関数型プログラミングのイメージを掴んでもらうことを目的にしています。Read less
setTimeout() vs ハッカー、仁義なき戦い - 株式会社CFlatの明後日スタイルのブログ
早速ですが、以下のHTMLを見て下さい……。 <!doctype html> <html> <head> <meta charset="UTF-8"> <title>サンプル1</title> <style> #counter { font-size: 3em; font-family: monospace; color: blue; } </style> <script type="text/javascript" src="http://code.jquery.com/jquery-2.1.1.min.js"></script> <script type="text/javascript"> (function(){ $(document).ready(function() { $('#start').on('click', function(){ var counter = 0; $
Socket.IO, Redisを使用し各ゲーム間でプッシュ通知するシステム | 株式会社サイバーエージェント
2. システム概要 homingは、アメーバピグ関連サービスのいずれかにログインしているユーザに対して、各サービスの通知情報を横断的にプッシュ通知します。 システムの構成は以下の通りです。 図2-1. システム概要 2-1. APIサーバ ユーザへの通知要求を受け付けるREST fullなAPIを備えたWebサーバです。 Node.jsのClusterによる、master/worker構成で稼働します。 通知要求はワーカプロセスで処理します。 図2-2. APIサーバ 2-2. Redisサーバ（データストア用） 一時的なデータをストアするためのRedisサーバです。 sentinelプロセスによる、master/slave構成で稼働します。 ストアされたデータはメモリ上のみで管理し、ディスクへの書き込みは行いません。 以下の情報を管理します。 ユーザのオンライン情報 ユーザIDの索
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
404: Not found
GitHub - codesuki/react-d3-components: D3 Components for React
Real World Virtual DOM
CSSに死を！これはJSerの叫び！ #kbkz_tech
【Topotal輪読会】JavaScript で学ぶ関数型プログラミング 1 章
Ampersand.js – Minimalistic Approach to not so minimalistic Problems
PureScript 関数型AltJSの決定版！？
