React.jsを使ってプロトタイプを作る。 コンポーネント指向をすすめるなら、プロトタイピングは実用性と実現性を兼ね備えていく必要があるのかもしれない。 本当の意味でのRapid Prototypingはイニシャル開発だけに求めるものではない。 …というお話をまとめました。 ## サンプルで使ったInVision -> https://projects.invisionapp.com/share/6V2T05XAN#/screens
React をちょっと触ってみたい、というのと 最近すこし Ruby on Rails も勉強はじめた、ということで、rails g scaffoldで作るような管理画面のViewを react-router を使ってSingle Page Applicationで作ってみた。 https://react-router-scaffold.herokuapp.com/ (source code: https://github.com/sugyan/react-router-scaffold) 既に React.jsでRailsのScaffoldを再現してみた - Qiita という記事があり、これをおおいに参考にさせていただいております。 違いとしては、 Bootstrapで見た目を変えてる React 0.13でサポートされているES6 classes記法などを使って書いてみた Hashで
要約 : 私たちは、React.js と Flux、それに他のいくつかのライブラリを用いて HipChat の Web クライアントを根本的に再構築し、素晴らしい結果を得ました! 是非試してみませんか? HipChat がアトラシアンに加わったときのクライアントは、Web、Adobe Air (Windows、OS X、Linux)、iOS、そして Android アプリの 4 つでした。HipChat チームが最初に掲げた目標のひとつが、Air クライアントを OS X、Windows、Linux のネイティブデスクトップクライアントに置き換えることでした。私たちは (その当時は) 小さいチームだったためしばらくはこの仕事で手一杯でした。このように最高のアプリケーションを提供することに集中した影響で、Web クライアントに対しては私たちが行った様々な開発の成果を反映させることができません
Gunosy React Meetup http://gunosy-frontend.connpass.com/event/12636/
gunosy-frontend.connpass.com 行った。オフィスすごく綺麗だった。 みなさんすごい勢いで発表していくし、ピザの香りでお腹すくし、終わった後の疲労感すごかったw ReactNativeの話も、v0.13〜の話も、実践?の話も聞けて結構満足度高めだった。 感想 React.jsで考える再利用性の高いUIデザイン うまく抽象化できれば確かになんか楽になりそうと、よくわからんけどワクワクした 「Componentが貯まればよりスピード感高まる」と言っていて、なるほどーと思った。 が、まだv0.13だし、Componentのメンテが大変にならないかなーとも思った React Canvasで作るFlappy Bird 逆にJS+DOMでも170行くらいで作れるのかというのに驚いた パフォーマンスはそんなに変わらなかったと言っていて、Flipboardが言っている60fpsの恩
2015/3/10の勉強会にて発表された資料です。 SCRIPTY#3 ~フロントエンド紳士・淑女のための勉強会~ http://scripty.connpass.com/event/12374/Read less
今話題の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
tl;dr React.js is rapidly being adopted and used by major players in the industry. NetFlix, Codecademy, Thinkmill, Bolster, Instructure, Inc and many more are using React, React + Flux or React and a twist on the idea of Flux in their projects and products to improve overall quality of code. React Native - This is game changing! Introduced in the React.js Conf 2015 Keynote - Introducing React Nati
At React.js Conf 2015 Facebook announced React Native — a way to write native iOS and Android applications with JavaScript using the familiar React.js. What is React Native React Native is a way to build native apps in JavaScript using React.js for user interface. It doesn't use DOM for rendering, instead, it renders with native UI views. You write normal React components, but instead of using low
jQuery versus React.js thinking Jan 11, 2015 I don’t like versus debates per se. I think each reasonably successful library or framework had good reasons (at the time being) to become so in the first place. We will compare conceptual differences behind jQuery and React. Problem List of items. Each item has details which are hidden by default. Whenever user clicks on an item, item will expand and s
React.jsはComponentを作るライブラリなので、Routerは当然含まれていません。 なのでBackbone.RouterだったりDirectorだったり好きなRouterライブラリと組み合わせて使うことが出来ます。 でもPageの単位でComponentを作って切り替える場合にそれだと面倒だったり冗長になってしまいがちです。 なのでここでは、react-routerというものを紹介したいと思います。 React Router 以前まではReact Routerではserver-side renderingがサポートされていなかったので、react-router-componentというのを使っていたのですが、今はサポートされているのでserver-side renderingしたい場合にも使うことが出来ます。 React Router Componentの方がシンプルなのでわ
今回はReact.jsのVirtual DOM実装の中でもユーザーが意識するべき点のkeyについて書きたいと思います。 React.jsではPropにkeyという値を指定することが出来て、Componentのリストを表示するような時につけていないとdevelopment環境だとconsole.warnで Each child in an array should have a unique "key" prop. Check the render method of KeyTrap. See http://fb.me/react-warning-keys for more information. と表示されます。 このkeyはVirtualDOMのdiffから実際のDOMに反映させるときに最小限の変更にするために使われます。 例えば var KeySample = React.creat
After watching a compelling talk about FRP by Jafar Husain from the Netflix UI team, I’ve been fascinated by the way reactive programming can make code both effective and elegant. At Football Radar, we work with many different streams and sources to create rich interfaces that capture realtime data about football matches, and we’re convinced that our products are a perfect fit for reactive program
Facebook announced Flux at F8 in April as an application paradigm to complement React. But Flux has been pretty nebulous, as there hasn’t been much code released. The examples in Facebook’s Flux repository gave a better idea of its overall composition, but there was still a ton of boilerplate involved, and that’s usually where a library comes along to bring some level of abstraction and convenienc
Introduction Welcome to the second installation of Learning React, a series of articles focused on becoming proficient and effective with Facebook’s React library. If you haven’t read the first installation, Getting Started and Concepts, it is highly recommended that you do so before proceeding. Today we are going to build an application in React using Isomorphic Javascript. Iso-what? Isomorphic.
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く