パリで発表されていたReact向けプロダクトがあまりにも未来に生きていて興奮したので、紹介させてください。 目次 目次 この記事のゴール 想定読者 はじめに 今回ベースとするソースコード React Nativeは何をするツールか Reactは何をするツールか React DOMとReact Nativeの違い Reactアプリケーションを描画するものたち React DOMの役割 React Nativeの役割 1. ネイティブ処理系の上でJavaScript処理系を動かす 2. Reactを動かす 3. Reactから渡された差分をネイティブViewに適用する React Native DOMはどこがReact Nativeなのか React Native DOMのやばいところ6連発 ReactからはReact Nativeに見えてるのがやばい Objective-C実装をJavaSc
目次 モチベーション 環境 認証の手法(JSON Web Token) 流れ クライアント側での認証の制御 ログイン認証の処理 まとめ 参考記事 モチベーション ReduxをフレームワークとしてReactを使ったSPAを作成していたときに、ログイン認証の処理で結構悩んで、悩み抜いた結果の知見を共有といった感じです。 まだまだSPA勉強中の身のため、間違ったやり方をしている部分があるかもしれませんが、そのときはご指摘いただけるとありがたいです。 なお、今回のサンプルソースは以下においてあります。細かい解説をしていない部分は、実際のソースを見て確認してください。 nabeliwo/jwt-react-redux-auth-example ※サーバーサイドレンダリングには対応していません。 環境 サーバーサイド Node 6.1.0 hapi 13.4.1 (フレームワーク) ※今回は特にサーバ
This blog site has been archived. Go to react.dev/blog to see the recent posts. It’s been exactly one year since the last breaking change to React. Our next major release, React 16, will include some exciting improvements, including a complete rewrite of React’s internals. We take stability seriously, and are committed to bringing those improvements to all of our users with minimal effort. To that
ライブエクスペリエンス事業部 エンジニアの高松(@shimpeiws)です。 2017/3/13 ~ 14の期間で開催中のReact Conf 2017に参加するためにサンノゼに来ています。 React Conf 2017 つい数時間前に終わったばかりの1日目のレポートを現地からお送りします! 会場の様子 1日目の感想 Keynote (Tom Occhino, Jing Chen, Sebastian Markbage) 概要 Tom Occhino Jing Chen Sebastian Markbage A Cartoon Intro to Fiber (Lin Clark) 概要 メモ Next.js: Universal React Made Easy and Simple (Guillermo Rauch) 概要 メモ React + ES.next = ♥ (Ben Ileg
These docs are old and won’t be updated. Go to react.dev for the new React docs. These new documentation pages teach modern React and include live examples: Sharing State Between Components Often, several components need to reflect the same changing data. We recommend lifting the shared state up to their closest common ancestor. Let’s see how this works in action. In this section, we will create a
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? import React from 'react'; import { render } from 'react-dom'; import { createStore } from 'redux'; // 座席確保(State) const initialState = { // 単品メニューの準備 menu: '', // 全ての注文の準備 menus: [] } // チケット販売機(ActionCreator) const inputCoin = (menu) => ( { // 基本オーダー(Action) type: 'WAT
【追記】 もうこれ古いから参考にしないでください 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がさっぱりわかんねぇ!」 ぐらいの人向け。自分
Redux Advent Calendar 2016 23日目 初めてAdvent Calendarに参加させていただきます。 当初はReduxとcreate-react-appを使って、サクッと素振りできる環境構築手順をまとめようと思ったのですが、ここ最近で自分が一番悩んだ「react-redux」についてReduxを始める方へ同じドツボにはまらないようにという願いを込めて投稿させていただきました。 react-reduxとは? react-redux公式より引用 Official React bindings for Redux. Performant and flexible. React公式のReactとReduxをバインディングするライブラリ パフォーマンスと柔軟性があります ここで出て来る「柔軟性(flexible)」というのがこのライブラリが初見殺しと言われる所以となっており
最初に タイトルは釣りです。いや、釣りでもないかw アプリ開発はReact Nativeを使ってます。 React.jsの手馴染みが良く、 "learn once, write anywhere"をうたっているReact。 延長線でかけるReact Nativeはかなり良いです。 Coiney(窓口)さんの様に、プロダクトに導入されている事例もちらほら出てきてます。 また、Facebookは初期から、React Nativeを使った Facebook Groups、Facebook Ads Managerを開発しており、開発言語だけにとどまらず、プロダクトでもリードをしてくれています。 でもやっぱり不安。。。 しかし、ただ。ただ。。。やっぱり不安がありました。それは。。。 本命のFacebook AppがReact Nativeではないこと!! Facebook appはおそらく世界中で一
Redux を仕事と個人で使い始めて 3・4 週間という経験値なのですが、「唯一の状態である state の唯一の更新手段である Action 発行」が、更新以外の作用を伴うことに頭を悩ませていて、この点についてのお話をさせてもらいたいと思います。 なお、前提とする Redux ミドルウェアや周辺ライブラリは、公式推奨である以下です。 redux-thunk React react-redux Action 発行に伴う 3 つの作用 Redux の Action 発行(= dispatch の実行)は、以下の 3 つの作用をセットで実行する処理だと、自分は考えています。 state の更新をする。 state のコピーをする。1 描画を実行する。つまり React の render 関数を実行する。2 それらの作用は常に全てが必要ではない それぞれは勿論必要な処理ですが、常にセットで必要と
こんにちは id:amagitakayosi です。 株式会社はてなで主にフロントエンド開発を担当しています。 この記事では React 本体のコードを読んでみます!! この記事は Reactアドベントカレンダー 2016 の7日目の記事です。 昨日は yutaszk さんで「react-router v4 でFlux アプリケーションをHot Module Replacement する」でした。 目次 はじめに (Kyoto.js の宣伝) 準備 ディレクトリ構造 monorepo Haste Gulp と Grunt コードリーディング react ReactComponent react-dom ReactMount ReactReconciler ReactCompositeComponent ReactDOMComponent まとめ おわりに はじめに (Kyoto.js の宣
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く