React VRで始めるお手軽WebVRプログラミング
React VRというのは、Facebookが開発し、GitHubにてBSDライセンスで公開しているオープンソースのVRアプリケーションフレームワークです。現在のところは、Webブラウザ向けにWebGLとWebVRを使ったVRアプリケーションを作るための様々な仕組みを提供しています。 React VRを知らなくても、ReactやReact Nativeなら知っているという人もいるかもしれません。VRコンテンツを作るには新しいフレームワークやライブラリなどを学ぶ必要がありましたが、Reactと同じ考え方を使ってVRコンテンツを作ることができる点が、他のフレームワークと異なる点です。 ネイティブVRが最高の体験をもたらすとは限らない VRというと何らかのVRヘッドマウントを装着して体験するものというイメージがあります。また、VRヘッドマウントは高額で、VRを体験するハードルが高かったことも事実
今、Reactでリポジトリ公開するなら、これくらいは対応しておきたい - Qiita
趣味で作ったwebサービスのリポジトリをgithubに公開して2ヶ月くらい フロントエンドのソースが雑だったので、リファクタリング中にした対応を紹介 前記事：Go + react + ansibleでサービスを作ってOSSにしてみた http://qiita.com/wheatandcat/items/66d72445ad0c5df2a8be github 記載している内容は、下記のリポジトリに取り込み済みの内容です。 うまく動かなかったら、こちらから動きを見てもらえたらと思います。 ■dotstamp_client https://github.com/wheatandcat/dotstamp_client flow javascriptでも型が使えるようになるライブラリ。 ファイル単位で実装していけるから、稼働中のプロジェクトでも柔軟に導入していけるのが魅力。 導入的にはファイルの頭に
全力で大きくなるReactのコードをスタイルガイドに沿って見直したら、大変勉強になりました | Wantedly Engineer Blog
Wantedlyでは今年に入って、Reactの導入や、webpackの導入によるビルドプロセスの変更、CoffeeScriptからJavaScriptへの変更など、フロントエンドの開発環境が大幅に変更されました。このあたりの話は高松の記事に詳しく書かれていますが、よりリッチなUIを効率的にチーム開発できるようになり、とてもいい変化でした。 コードの質にばらつきがReact導入時は、一つのチームだけReactの開発を行っていたのですが、複数チームが独立して開発するようになると、同じReactのコードでもチームごとに雰囲気の違うコードが出来上がっていました。 ここは括弧を付けるべきなのか、このインデントは好ましいのか、ここはSyntac Sugerを使ったほうがいいんじゃないかなど、疑問点がある度にチーム間で確認をとるのは大きなコストになるため、どこまで指摘するかはチームのレビュアーに依存して
これからReactを勉強する人が最初に見るべきスライド７選
React.js（以下、React）は、Facebookが作ったJavaScriptのビュー・ライブラリです。最近よく耳にするけどあまり理解していないという人も多いのではないでしょうか。 そこで今回は、 「Reactって最近よく聞くけど一体何？」 「jQueryと何が違うの？」 といった疑問にこたえてくれる初心者向けのスライドを厳選して紹介します。JavaScriptは苦手だけど概念だけは理解したいといった人のために、なるべくわかりやすいものを選んでいます。 ＊もし、「このスライドもおすすめ」というものがあったら教えてください。 Reactとは？ なぜ人は必死でjQueryを捨てようとしているのか なぜjQueryを捨て、Reactを採用しようとするのかについて説明してくれるスライドです。ページ遷移のないシングルページアプリケーション（SPA）への需要が増えてきているといった最近のトレンド
すべてのプログラマーが知っておきたいReactの7つの強み
JavaScriptはこの６年で大きくその地位を向上させてきました。JavaScriptは有名なサーバーサイド言語になり、オフラインファーストSPAは用語として定着し、そしてJavaScriptは他の言語のための有名なコンパイル先となりました。 JavaScriptは、ElectronやReact Nativeのような技術やハイブリッドアプリを通して、ついにはデスクトップとモバイルのプラットフォームとなってきています。 この3年でもう一つ革命が起こり始めました。FacebookのプログラマーであるJordan WalkeがReact.jsを生み出しました。Reactはそれ以来、数百ないし数千ものプログラマーのJavaScriptのコードの書き方を変えてきました。 Reactの途方もない成功の裏にはそれなりの理由があります。 1. バグが出にくいよりシンプルなコードReactはユーザーインタ
ｊQueryからReactに移ろうとしてる自分の個人的な理由
http://anond.hatelabo.jp/20160521163144 内容から誰が書いてるかわかるかもしれんけど、まぁスルーよろしく。 jQueryもそんなにガッツリ使ってるわけでもないし、Reactはまだリリース前の調査兼下地作りの段階だけど 正直言ってjQueryに戻るつもりは毛頭ないぐらいReact便利だと思ってる。 でもjQueryを捨て去れるかというとそれも無理だと思ってる。 その辺のことを適当に書いてみる。 用途社内サポート的なことやってて、サポートのテンプレート対応を省力化するために Webでツール作って人が対応するコストを減らすために使ってる。 チーム組んでガッツリ大規模ツール開発ってわけでもない。 jQueryで一つツール作ってリリースしてそこそこ人的コスト削れたのはよかったと思ってる。 jQueryは脳内DOMツリーとの格闘に疲れ果てた最大にして一番の理由がこ
Reactを使うとなぜjQueryが要らなくなるのか - Qiita
はじめに React（通称 React.js1）を全く知らない、あるいは幾つか記事を見たけどなんなのかピンと来ていない、という人のために書いています。 「jQuery くらいしか知らない」くらいの人に具体的に雰囲気を知ってもらうのが目的であり、すでにやる気がある人向けのチュートリアルではありません。やる気が出れば日本語版ドキュメントを読んで手を動かせばあっという間なので、そこまでの興味が出ることを目標にしています。 以降では ES2015 (ES6) の文法（アロー関数とか）を使っています。この部分が怪しい人は先にアロー関数と const 文だけでも知ってから先に進んでください。 以下の説明中、このアイコンで表すのは（2023 年現在から見た）『昔話』です。新しく自分のコードを書く際には本来知らなくていいことですが、古い記事を見たときに混同しないための参考情報として書いてあります。この記事
react-storybookを用いたReactコンポーネント開発 - Hatena Developer Blog
こんにちは！Webアプリケーションエンジニアの id:amagitakayosi です。 今日はReactコンポーネントを手軽に開発するためのツールを紹介します。 前回のあらすじ react-storybookとは 導入してみる 初期設定 storyを作成する 起動 イベントを監視する Hot Module Reloadingの仕組み メリットとデメリット リアルタイム確認できる 導入が簡単 ストーリー駆動開発できる デメリット: Webpackの機能で動いてる まとめ 前回のあらすじ developer.hatenastaff.com 前回の記事では、Reactコンポーネントをnpmパッケージとして開発する方法を紹介しました。 対象としたのはこちらの無限スクロール用のReactコンポーネント。 http://www.npmjs.org/package/@fand/react-infini
React.jsとCSS3で長女のためにWEB絵本を作った話 - Qiita
まずはこちらの動画をご覧ください。 こちらは娘が２歳半の頃に児童館で撮影したものです。 かわいい・・・ 生後1000日近くともなると、子どもは自分で絵本を読むようになります。 並行してひらがな覚え始めるので、親としてはガンガン絵本を読んでほしいのですが、実際には挿絵に合わせて適当な話を創をして遊んだり、まじめにひらがなを音読し始めたかと思えば数ページも読まないうちに次の絵本を引っ張り出してきては読んで、飽きてまた違う絵本に手を出すだけで、一向にちゃんと読んでくれません。 ちゃんと読まない原因として、もしかして絵本に動きがないから飽きてしまうのでは、と思った自分は もしもパパが作った動く絵本があったら、娘は大喜びして本を読むようになり、どんどん集中力が身について、あいうえおもマスターしてパパ大満足！なんてことになるんじゃないだろうか。 なんてことを考え、実際にWEB絵本を作成して娘に見せるま
すべてのReact.js初心者が知っておくべき9つのポイント - Qiita
9 things every React.js beginner should knowを意訳しました。 誤りやより良い表現などがあればご指摘頂けると助かります。 私は約6ヶ月間React.jsを使用してきました。それほど長い歴史ではありませんが、あなたがひげの長老として扱われるようなJavaScriptフレームワークの目まぐるしい世界の大きな枠組みの中で、私は最近、React初学者のTipsで少数の人々を支援してきましたので、ここでより多くの人々にその内容を共有するのが良いアイデアであると思いました。これらは全て私が始めた時に知っておきたかったことか、もしくはReactを習得するために本当に役立ったもののいずれかです。 あなたが絶対的な基本を知っていると想定して話を進めますが、もしコンポーネント、propsやstateなどの言葉に馴染みがなければ、公式の入門やチュートリアルページを読むと
React＋CSSフレームワークを検討してみたよ - Qiita
React使いつつも、既存のCSSフレームワークを何か載せようと思っていろいろ調べたメモ。 あくまでもReactとの親和性などに絞って選んでます。 Bootstrapは何か「出、出〜〜〜！！Bootstrap奴〜〜〜！」ってなりそうだったので、最後の砦として触れてません。 Material-UI 一番Reactに寄り添って出来ている。 以下のように必要なコンポーネントをimportしてrender()内で使うだけ。 実際触ってみると非常にお手軽で、動きのクォリティも高かった。 余計な外部ファイルも読む必要がなくて綺麗。 その分かなりカッチリと仕様が決まっているので、少し手を加えたい場合は さらにMaterial-UIコンポーネントをラップするオリジナルコンポーネントを作れば拡張はできる。 // タッチ・クリックの挙動のために必要っぽい import injectTapEventPlugin
Reactで、jquery(ajax)内でsetStateしようとすると「this.setstate is not a function」って怒られて失敗する場合の対策 - 脳汁portal
問題 Reactを使っていてstateにsetしようとして普通にthis.setStateとかやっていると、this.setstate is not a functionってエラーが出るときがあります。 JavaScript的にどういうかはわかりませんが、Ruby的に言うとスコープが切り替わってself(=this)が変わっちゃった為に怒るエラーです。 調べてみた 英語でぐぐるとちょこちょこ情報が出てきますが、とりあえずは『thisが呼び出しているものが変わっちゃったので、bindingしてあげないとダメだよ』って言ってます .bind(this) 「bind」は関数内で参照できる this を指定のオブジェクトに束縛するメソッド Javascriptでは、オブジェクトのメソッドはオブジェクトに束縛されているのではなく、その時々のコンテキストにおいて実行される thisの確認 consol
MonacaアプリでReactを使ってみよう
最近何かと話題になっているのがReactです。フレームワークという訳ではなく、ビューのライブラリですが、DOMの状態（ステータス）を意識せずに使える点がうけています。従来のサーバサイドのようにHTMLをレンダリングすれば後はReactが処理を行ってくれるのが便利です。 今回はそんなReactをMonacaアプリ開発で使ってみます。なお、開発環境としてMonaca Localkitを使っています。 Localkitで新規プロジェクト作成 まずはMonacaアプリの新規プロジェクトを作成します。今回は最低限のテンプレートを選択しています。 wwwの下にsrcとjsというフォルダを作成しています。srcにはReact用のjsxファイルが、jsフォルダにはjsxから変換したjsファイルが入ります。 npmで設定 必要なライブラリはnpmでそろえます。あらかじめnode.jsをインストールしておいて
JSといえばjQueryだったWebデザイナーが、Reactを1年間使って感じたメリット｜dwango creators' blog（ドワンゴクリエイターズブログ）
はじめまして、ほそだと申します。昨年秋まで個人事業主の立場でドワンゴでお仕事させていただいておりましたが、いろいろ経緯がありまして中の人になりました。ドワンゴ歴はそこそこ長い新入りです。よろしくお願いいたします。 さて、今回はデザイナー（HTML/CSS/JSは扱えるいわゆる「Webデザイナー」）として1年間ほどReactを使ってみたので、そのメリットを書いてみようかと思います。 Reactとの出会い ReactとはFacebook製のJSライブラリです。 https://facebook.github.io/react/ WebアプリケーションのView部分を実装します。2014年の暮れにエンジニアの方々が魂を震わせているのを見て存在を知りました。2015年はReact元年な感じでしたよね。 僕自身、以前から比較的JSを書くタイプのデザイナーではありましたが、正直なところ自分が関わってき
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
基礎からはじめるReact入門一覧
フロントエンドエンジニアが React Native を触ってみた話