ReactユーザーのためのAngular2ファーストステップ - Qiita
Reactはやったことある人向けに、ReactのアレはAngular2だとどうなってるの？というのをまとめていきます。Reactユーザーだった自分がAngular2始めるにあたりこういう情報あればなと思ってたやつです ところでAngular2じゃなくてAngularと呼んでね！とのことなので、以下Angularと呼びますがAngular 2.xを指します。 アプリケーションのブートストラップ React <!doctype html> <html lang="en"> <head> <title>React App</title> </head> <body> <div id="root"></div> </body> </html> import React from 'react'; import ReactDOM from 'react-dom'; class App extends
React.js界隈の人に聞きたい
**誰かみんなの主張のまとめを作ってくれないですか？** (まあそれこそお前がやれよって話かもしれないので、誰もやってくれなかったら私がしますが。。) 最近、JQueryはもはや不要でReactさえあればOK,みたいな記事をよく見ますね。 論旨としては、どうせトランスパイラ使ってるんだからもっと便利な書き方しようぜ！ってことなんだと思います。(virtual DOMがメインだ！という話もあったけど、じゃあ何でReactなの？というのは聞きたいかな。メジャーだから？) ただちょっと個人的に違和感が拭えないので聞きたいです。 ちなみに私は昔coffeeとbackbone.jsか何かで業務用のページ（SPAではなかったような気がする）を作るお仕事をしたことがありますが、フロントエンドエンジニアというわけではないです。どちらかというとサーバー管理とかのほうがよく知っていると思いますが、Javasc
React基礎 · GitBook
React基礎 レッスン Lesson 01: 環境構築 Lesson 02: ES2015について Lesson 03: 関数型の書き方 Lesson 04: 初めてのコンポーネント Lesson 05: 初めてのinline style Lesson 06: 初めてのprops Lesson 07: 配列からの展開 Lesson 08: フォームの定義 Lesson 09: フォームによるデータ追加 Lesson 10: 総合課題「目的特化型電卓を作ってみよう」 おまけ Appendix 01: 様々なコンポーネントの書き方 Appendix 02: コンポーネントのstate Appendix 03: コンポーネントのライフサイクルメソッド Appendix 04: JSX vs. createElement Appendix 05: PropTypes Appendix 06: p
Reactでinputを扱う - Qiita
Reactでinputを扱う(TypeScript版)という改訂版を書きました。 input要素をReactで使うとReactがinputを自分でコントロールするので注意が必要。 var React = require('react'); var ReactDOM = require('react-dom'); var App = React.createClass({ render: function() { return ( <div> <label>value a</label> <input type="radio" name="aradio" value="A" checked="checked" /> <br /> <label>value b</label> <input type="radio" name="aradio" value="B" /> <hr /> <labe
React.jsでFormを扱う - Qiita
今回はReact.jsでのFormの扱いについて書きたいと思います。 例えばReact.jsでは↓のようなことをすると変更出来ないテキストフィールドになってしまいます。どうしてなのかという話ですね。 // ダメ <input type="text" value="initial value" /> // ダメ <input type="text" value={this.state.textValue} /> var Text = React.createClass({ getInitialState() { return { textValue: "initial value" }; }, changeText(e) { this.setState({textValue: e.target.value}); }, render() { return ( <div> <p>{this.st
たぶんこれが一番分かりやすいと思います React + Redux のフロー図解 - Qiita
【追記】 もうこれ古いから参考にしないでください https://t.co/mXtcc73Orf — もし Laravel が流行しなくなってこられてきてたとしたら、絶対に捨てられてこられてたと思うか (@mpyw) January 26, 2021 Redux にはその昔 connect()() とかいうクソ API と， Redux-Saga とかいう宗教がありました という考古学です — もし Laravel が流行しなくなってこられてきてたとしたら、絶対に捨てられてこられてたと思うか (@mpyw) January 26, 2021 読者対象 Tutorial: Intro To React - React Example: Todo List · Redux 「チュートリアルそれぞれ一周した！Reactは何とか理解できたが，Reduxがさっぱりわかんねぇ！」 ぐらいの人向け。自分
React/Redux/ES6をしばらく使ってみての所感 - memo_md
ここ数ヶ月、お仕事で以下構成での開発をしています React Redux ES6 徐々に解ってきたと思う（たぶん）ので、感覚がホットなうちに備忘も兼ねて整理。 ※個人的な感想も含みます。 良かったところ React : コンポーネント再利用時の安心感 いままで → なんか心配 従来は、フロントエンドはjQueryをメインに開発をしていました。 jQueryプラグインするなど、後々再利用可能な形で部品化することは従来も行っていましたが、いざ使う時に「これ本当に大丈夫か？」という気持ちになることも多々。 他のプラグインとの相性は？ 名前空間の汚染がないか？ 依存するHTML上のid/class/attributeで悪影響がないか？ ルールを徹底したり、ドキュメントとして注意点をちゃんと残しておいたりすればある程度は回避できますが、最後は「ある程度覚悟して信頼する」という工程を通っていたと思いま
React.js Best Practices for 2016 | @RisingStack
Join 150K+ monthly readers. In-depth articles on Node.js, Microservices, Kubernetes and DevOps. 2015 was the year of React with tons of new releases and developer conferences dedicated to the topic all over the world. For a detailed list of the most important milestones of last year, check out our React in 2015 wrap up. The most interesting question for 2016: How should we write an application and
React + Reduxで作ったIsomorphic(Universal) JSなサービス開発の裏側
はじめまして、2016年新卒入社のいちきです。僕は現在、11/14にWeb版がリリースされたばかりのブッキングテーブルというサービスの開発チームでフロントエンドからバックエンドまで一貫して担当しています！ ブッキングテーブルとは？ https://bookingtable.jp/ ブッキングテーブルは全国の飲食店の予約を全てネットで予約が出来る、予約特化アプリです。 既に2016年4月にiOS、Android版が同時にリリースされていましたが、遂に11/14に待望のWeb版がリリースされました！ ブッキングテーブルのWeb版は、Single Page ApplicationやServer Side Renderingなど、フロントエンド技術で様々な取り組みを行っています。 「予約特化アプリを目指す」という目標に対して、エンジニア側からもユーザにとっていかに良いUXを体験してもらえるかを考え
redux-thunkなのかredux-promiseなのかredux-sagaなのか、それともredux#bindActionCreatorsをやめるのか - Qiita
前提 ここで書くのはあくまで個人的な意見です。 react, reduxはどちらも使い方次第でフレームワークっぽくも使えるし、ただのツールとしても使える。だからreact, reduxを使ったフロントアーキテクチャはいくらでもあっていいと思う。 これはそのうちの一つを提案するものです。 とはいえ特別な実装方式を編み出したわけでは全然なくて、むしろ１周して出戻りしたかんじ。 結論 非同期処理をコンテナ(またはそこで使うモジュール)に書くだけ。 今は、非同期処理をするためのredux middlewareを使ってないです。 過去記事(react, redux周りのパッケージ選定とKPT[2016-05-27現在])にて、この辺についてもなんやかんやと言っているけど、今はthunkもpromiseもsagaも使っていない。その実装が凄くシンプルで気に入ってるので紹介します。 どうやるのか red
HTML5とか勉強会 - React最新情報 に行ってきた - dackdive's blog
行ってきました。 React現状確認 @koba04 さん。 一人React.js Advent Calendar 2014 - Qiita にはお世話になりました。 React のこれまでの歴史と最新情報のまとめ。 Facebook はもちろん、Instagram, Netflix, airbnb なども React を採用 React Dev Tool で各社 web サイト見ると確認できる！ 大半のコンポーネントは Stateless Function Components (SFC) で書ける アロー関数で JSX だけ返すようなやつ const Item = ({item}) => ( <div> ... </div> ); state やライフサイクルメソッドは持たせることができないので ES2015 のクラスを使う パフォーマンス最適化が将来導入される...？ ES2015
Reduxのmiddlewareを積極的に使っていく - Qiita
最初はちょっととっつきにくいけど、責務がはっきり分かれていて比較的コードがごちゃごちゃになりにくい（と思っている）Reduxですが、やはり実戦投入するとどうにも扱いにくい部分が出てきます。 特にそう感じるのは通信系の処理、ユーザーとのインタラクションです。これってつまるところ非同期処理なんですが、処理を依頼する側、つまりActionを投げる側としては「あとのことはまかせた！」と言いたい。Actionを投げる部分ってのはだいたい何かのイベントハンドラだったりしますが、そういう場所に通信やインタラクションの処理をダラダラと書きたくない。 本稿ではそれらの面倒な部分を責務が分離されたメンテナンスのしやすいコードになるようにmiddlewareを活用する例をいくつか紹介します。 その前にmiddlewareについて Reduxの公式ドキュメントではログ出力を例に取り、アプリケーション本体から分離し
ES5のReact.jsソースをES6ベースに書き換える - Qiita
概要 開発者にとってはメリットがありそうだけどユーザーにとってはいまいちメリットがよく分からないES6。ひとまずどのくらい開発者にとってメリットがあるのかを実際に把握するため、ES5のReact.jsソースをES6ベースに書き換えてみました。 対象のソースは、投稿[react-router v2.xとcontext]のサンプルソース（https://github.com/kunitak/react-router-1to2）です。 参考 React TutorialをES6で書きなおしてみた - console.blog(self); http://sadah.hatenablog.com/entry/2015/08/03/085828 Babelで理解するEcmaScript6の import / export http://qiita.com/inuscript/items/41168a
Performance Tools – React
Note: As of React 16, react-addons-perf is not supported. Please use your browser’s profiling tools to get insight into which components re-render. Importing import Perf from 'react-addons-perf'; // ES6 var Perf = require('react-addons-perf'); // ES5 with npm Overview React is usually quite fast out of the box. However, in situations where you need to squeeze every ounce of performance out of your
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
what is the best IDE for React? - React Discuss
React at CodePen
How to call a function in react js from an external JS File
Call external Javascript function from react components
http://xiao-ctrl-y.com/2016/07/19/react-redux-dnd/
Redux 基礎：Middleware 編 - Qiita
