react(35)

35follower
nissy さんのアバター 28views

Redux セレクターについて

React&Reduxで大規模開発をしていくようになると、stateが肥大化していくようになる。 こんな時に、パフォーマンスにおけるstateの更新のボトルネック化を避けるためのmiddlewareとして、セレクターと呼ばれる処理を... 2017年8月30日
Tomohiro さんのアバター 11views

react devlopertoolsを使いたい

Chromeの拡張機能react developertools https://chrome.google.com/webstore/detail/react-developer-tools/fmkadmapgofadopljbjfkapd... 2017年7月18日
@iwasaki さんのアバター 13views

ReactでAPIを複数コールする方法

以下のようにします。 function* postMessage(params) { yield call(setup); const { roomId, message, } = pa... 2017年6月13日
@iwasaki さんのアバター 89views

React Nativeでビルドに失敗した時にはpackage-lock.jsonを削除するとよい

FAILURE: Build failed with an exception. * What went wrong: A problem occurred configuring project ':app'. > Could n... 2017年6月7日
nbeppu さんのアバター 23views

React Native で iOS/Android を切り替える方法

主に以下の2通りの方法があります。 ファイル名を変更する ファイル名を以下のように変更するとimport時に自動的に振り分けられます。 App.js ↓ App.ios.js App.android.js ソースコードで分岐する... 2017年6月2日
Tomoumi Nishimura さんのアバター 50views

react-native-fetch-blobでmultipart-formdataをPOSTする

react-native-fetch-blobを利用してデータを送るには、 RNFetchBlob.fetch(method, url, headers, [ { name: 'id', data: id }, { name: 'pass... 2017年5月31日
Tomoumi Nishimura さんのアバター 47views

React Nativeで画像選択を行う

React Nativeを利用したアプリ開発で、画像を選択する処理を実現する際には、react-native-image-pickerパッケージが利用できます。 導入 基本的には npm install react-native-im... 2017年5月11日
nissy さんのアバター 130views

React開発 React Developer Toolsを使ってみる

Google Chromeでは、React用のDeveloper Toolがあるみたいです。是非開発している人は落としましょう。 コンポーネントの構造がかなり分かりやすくなり、どのコンポーネントがどんなstateやpropsを持っているの... 2017年4月6日
ysugiyama12 さんのアバター 8views

画像のalt属性

<img src="hoge.jpg" alt="画像の説明" width="300" height="300" /> alt属性はimage要素内の属性値で、主に画像に関する説明を記述する部分である。 もし何らかのエラー... 2017年3月31日
ysugiyama12 さんのアバター 12views

地図や画像の上に透明なOverlayを配置

コンポーネントはnativeBaseのCardを用いて色を透明にすることで実現した。 <MapView region={this.state.region} style={mapstyles.map}> ... 2017年3月28日
Tomoumi Nishimura さんのアバター 168views

React Nativeの基本事項

React Nativeの基本的な事柄です。 基本の基本 プロジェクトを新規作成して起動します react-native init hogehoge cd hogehoge npm install react-native run-i... 2017年3月28日
ysugiyama12 さんのアバター 12views

地図上でdrag&dropできるマーカーの作成

react-native-mapsにおいて自分で移動させたマーカーの座標を取得できる。 <MapView initialRegion={...}> <MapView.Marker draggable//draggab... 2017年3月24日
Tomoumi Nishimura さんのアバター 89views

create-react-native-appを触ってみる

React Nativeのプロジェクトをサクッと作れるcreate-react-native-appを導入する方法です そもそも論 React.jsの雛形を作れるCreate React Appというものがありますが、これに着想を得てR... 2017年3月21日
nissy さんのアバター 84views

ReactNative react-loggerを使ってデバッグ

ReactNativeのデバッグは公式にもある通り、Webブラウザ上でブレークポイントを打ちながら可能ということで、かなり良心的な設計になっているのですが、さらにReduxフレームワーク開発を効率良くすすめるデバッカーモジュール「react... 2017年3月17日
ysugiyama12 さんのアバター 17views

文字が入力されている時だけ色が変わって押すことができるボタンの作成

割と使う機会が多いはずだが、綺麗にまとまっているサイトがなかったのでまとめておく。 class Hoge extends Component { constructor() { super(); this.state ... 2017年3月16日
@iwasaki さんのアバター 167views

Redux FormのWizard FormでSubmit Validationを使う方法

今回はRedux FormのWizard FormでSubmit Validationを使う方法です。Material UIも使っていますが、今回はあまり話の本筋ではありません。 現時点においてReduxでFormを扱うにはRedux F... 2017年3月16日
@iwasaki さんのアバター 96views

firebaseの設計思想

firebaseの設計思想とはRDSなどの正規化とは大きく異なるため、柔軟な発想が必要になっていきそうです。 基本的には以下のような考え方になりそうです。 insert,put時にがんばる(たくさん登録する) select時には複雑な... 2017年3月15日
@iwasaki さんのアバター 257views

Material UI のCheckBOXをRedux Formで使う

redux-formでMaterial UIを使用する例としては http://redux-form.com/6.5.0/examples/material-ui/ に例が載っています。 ただ、redux-formとMaterial ... 2017年3月15日
@iwasaki さんのアバター 117views

rechartsのラベルをカスタマイズする方法

reactでChartを表示する際にはrechartsを使用するのが王道のようです。(chartjsもありますが、v2.0に対応しているライブラリがまだメジャーになってないなど色々あるようです。) Pieチャートのラベルをカスタマイズして... 2017年3月15日
ysugiyama12 さんのアバター 40views

PropsとStateについて

ここの理解がかなり怪しかったので自分なりにまとめます。 Props コンポーネント利用時に属性として設定できる値で、一度定義したらその値を変更することはできない。 例えば <MyComponent PropsName = "... 2017年3月10日