React+ReduxのコンポーネントをKarma+Jasmineでユニットテストする - Qiita
function increment() { return { type : COUNTER_INCREMENT }; } export class Counter extends React.Component { static propTypes = { dispatch: React.PropTypes.func.isRequired, counter: React.PropTypes.number, } constructor() { super(); } render() { return ( <div className='container text-center'> <h1>Sample Counter</h1> <h2>{this.props.counter}</h2> <button onClick={this.props.dispatch(increment)}> I
React+Reduxでreducerのテスト - Qiita
概要 reduxでreducerのテストをしたく、以下の様な記事を書いた。 React+ReduxのAction、Reducerを個別にテストする - Qiita モックしたデータをstore.dispatchするという方法をとっていたが、これも、reducer実行終了時まで待つ必要があるため、タイミングを担保するのが難しい。そこで、別の方針でテストすることにした。 方針 reduxのドキュメントを参考にすると、dispatchをせず、直接reducer関数を実行している。同じように実装することにした。 Writing Tests | Redux // createReducerは以下の様なutilメソッドを用意しておく // export function createReducer (initialState, reducerMap) { // return (state = init
React+Reduxでasyncなactionをテストする - Qiita
import { REQUEST, REQUEST_SUCCESS, } from 'constants'; import { createStoreForActionTest } from 'utils/test'; import { fetchSomeResource } from './action.js'; describe('(Action)', function() { const initialState = { items: [], isFetching: false, }; const expectedActions = [ { type: REQUEST }, { type: REQUEST_SUCCESS, items: ['items'] }, ]; it('REQUEST, REQUEST_SUCCESS が disapatch されること', (done) =>
React+ReduxのAction、Reducerを個別にテストする - Qiita
概要 Reactでユニットテストをしたく、コンポーネントのテストであれば以下の様な記事を参考にすればできそうだが、Fluxをつかったアプリで、ActionやDispatcherにロジックがある時には、それでは十分で無いと考えた。 React.js + Jest - Qiita 今回はReact+Reduxを使っているので、Action、Reducerを個別にテストする方針を考えた。テストフレームワークは、karma+jasmineを使用している。 Action テストするactionは以下の様なものを想定している。単純にAPIを叩いてresを得るというもの。 import { REQUEST, REQUEST_SUCCESS, } from 'constants'; // リソース管理はsuperagent import request from 'superagent'; functio
Electronでコストを掛けず綺麗なアプリケーションをつくる - Qiita
概要 ElectronでReact+ES6あたりを実装したいが、自分で構成考えるのも二番煎じ感があるので、既にあるboilerplateでサクッといい感じのストラクチャをつくる。ほぼ頭を使わずにまあまあ綺麗な設計でかくというのを目標とした。 つくったものは、(会社で使っている何種類かの)プルリクのテンプレートをコピペできるという簡単なデモ。 okmttdhr/pull-request-templates 以下な感じで選択、コピペが出来る。 electron-react-boilerplate いろいろ探した結果、↓のようないい感じのストラクチャの中で1番よさ気でstarも多いのがchentsulin/electron-react-boilerplateだった。 アプリケーション構成 React React Router Flux Babel Webpack Electron フォルダ構成
モダンなisomorphic JavaScriptのプロジェクト構成をまとめる - Qiita
#概要 最近のモダンなリポジトリなどから、よくあるisomorphic JavaScriptなプロジェクト構成をまとめてみた。 #プロジェクト構成 ##クライアントサイド ###React クライアントサイドにはReactを使用しているものが多い。 reactjs isomorphic - Google 検索 ##クライアントサイドアーキテクチャ ###Flux 設計パターンには例によってReact.jsと相性の良いFluxを用いる。フレームワークは**Redux**が人気。 人気のFluxフレームワークReduxをさわってみた - マルシテイアは月の上 Fluxフレームワークまとめ - Qiita ##クライアントサイドルーティング ###React Router これはほぼ一択な気がする。 React.jsでserver-side renderingにも対応したRouting - Qi
最近気になったGithub JavaScriptトレンド7選（2015年6月編） - Qiita
概要 先月辺りに気になったGithub JavaScriptトレンドを7つ選んでみました（こちらに書いたものです）。 React UI Builder React.jsのコンポーネントをGUI的に作成できるツール。 GraphQL GraphQLはデータを表記するためのクエリ言語。階層構造を備えたクエリ構造や型システム、クライアント視点でのクエリ、GraphQL言語それ自身によってクエリされるサーバの型システムといった特徴により、クライアントアプリケーションの開発に適している。 Facebook、新クエリ言語GraphQLのRFCドラフト案を公開 GraphQL Introduction | React Google incremental dom Googleが開発しているVirtual DOM。 Incremental DOM ざっと見たやつ Introducing Increment
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
