いまさらですがReact（react.js）をはじめてみました。 Virtual DOMばかりが話題にあがるReactですが、それにとらわれていると理解が進まない、と言うかReactで理解しなければならないのはVirtual DOMではないことがわかりました。 Reactについての良い資料はすでにたくさんありますので、末尾に参考資料としてあげています。 このエントリは自分がReactのチュートリアルをなぞりながら書いた自分用のメモですが「1エントリで概要をちゃちゃっと理解したい」という方に役に立ったら良いな、とも思っています。 Reactチュートリアル http://facebook.github.io/react/docs/tutorial.html 基本 JavaScriptで書かれたライブラリ。react.jsをインクルードして使う。 （MVCで言うところの）Viewのみを担当する。
概要 react.js + redux でクライアントサイドバリデーション + サーバーサイドバリデーションの結果表示について模索してる 最初は、form系のライブラリで良さそうないのか調べてた ライブラリみてしっくり来なかったのでそもそもfluxアーキテクチャのどこでやるのがやりやすいのか？考えてみた 背景 React.jsでフォームに入力された値のチェックを行うような Validation処理ってどうやって作るのがいいんだろう？というところ から調べ始めた.... 最初は、いきなりredux + React.jsでバリデーション処理を作るれるように いろいろ調べてたんだけどReact.js単体でもどうしていいのかわからなかった のでひとまずreact.jsとライブラリを組み合わせて、どうやるのが良いのか 調べた reactでのformをvalidateするライブラリなど ざっと下記のよ
前回→今からはじめるReact.js〜画面遷移〜 処理の流れは一方向で Flux React.jsの開発元のFacebookがFluxというアーキテクチャ概念を生み出しました。 アーキテクチャといえばMVC（Model、View、Controler）が有名です。 FluxはMVCで発生する処理の役割を明確化して流れをわかりやすく、シンプルにしたもののようです。 本家サイト（ https://facebook.github.io/flux/docs/overview.html ）でも図が提示されていますが、 頭の中を整理してみたらこんな感じになりました。 図を見てお分かりの通り、一方通行になっています。 一方通行とすることで、例えばViewはViewの役割に集中できるであるとか、ソースが複雑化するのを防ぐメリットがあるらしいです。 本家サイトの図だと、WEB APIはActionで呼ぶとなっ
はじめに React.jsを使って業務アプリをSPAで作ってみたので、知見というか体験談を共有したいと思う。なお、業務アプリという分野におけるReact.jsの利用に関しては、React.js Advent Calendar 2015に「業務系アプリの実装だからこそReact使おうぜ」 という記事もあるのでそちらも合わせて読んでおこう。 アプリケーションの特徴 業務アプリといっても色々あると思うが、今回のアプリケーションでは以下のような特徴があった。 Formによる入力項目が多い＆バリデーション 画面遷移がかっちり(遷移途中の画面にいきなりアクセスや戻ることは不可) アクセスコントロールがある CRUD操作が多い 表形式でデータを表示 IEをサポート 以下、それぞれについて詳細を書いていく。 Formによる入力項目が多い＆バリデーション 業務アプリといえばFormの入力項目の多い、というイ
要約 : 私たちは、React.js と Flux、それに他のいくつかのライブラリを用いて HipChat の Web クライアントを根本的に再構築し、素晴らしい結果を得ました！ 是非試してみませんか？ HipChat がアトラシアンに加わったときのクライアントは、Web、Adobe Air (Windows、OS X、Linux)、iOS、そして Android アプリの 4 つでした。HipChat チームが最初に掲げた目標のひとつが、Air クライアントを OS X、Windows、Linux のネイティブデスクトップクライアントに置き換えることでした。私たちは (その当時は) 小さいチームだったためしばらくはこの仕事で手一杯でした。このように最高のアプリケーションを提供することに集中した影響で、Web クライアントに対しては私たちが行った様々な開発の成果を反映させることができません
React入門系の記事はもう結構出尽くしてる感ありますがせっかくなので私も。 今回はReact v0.13RC2を使って↓のアプリケーションを写経してみます。（Authorは私ではありません） 見ての通り、抵抗の値を計算するアプリケーションです。 Reactで書かれていたり、SVG使ってたり面白いソースですね。 ちなみに抵抗の色の仕様はこのようになってます。 抵抗のカラーコード はじめに React v0.13RC2を使う理由は現時点で最新版ということと、v0.13.0beta1でES6のclass構文が使えるようになったからです。 jsfiddleのソースは1ファイルにまとめて書かれていますが、これを1コンポーネント1ファイルに分割して書いてみます。 React(JSX)のビルドにはBabelが使えるので、前回作ったスケルトンの上に作っていきます。 設計 jsfiddleのJSソースの一
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
