joppotjoppotコピペで絶対動く。2016年3月14日Tweet概要みなさんこんにちはcandleです。今回は、react0.14のnodeの環境構築をします。react0.14はまだまだ、開発段階にあり、しばしば仕様変更が行われています。0.13の時では使用されていなかったことが盛り込まれたり、削除されたりしています。react0.14はnodeを使わなくても必要なjsファイルを読み込むだけで動作するのですが、一応、nodeでの開発環境が整っていたの方が、それからの開発に便利です。日本語に翻訳されたreactのチュートリアルhttp://mae.chab.in/archives/2762また、nodeでのreactの開発環境はこのサイトを参考にしています。http://qiita.com/nownabe/items/2d8b92d95186c3941de0前提nodeがインストールされている必要なパッケージをインストールするまずは、reactが動くnodeのフォルダを作成します。私はホームディレクトのjsフォルダに作成します。react14-tutorial次に、nodeのライブラリを管理するpackage.jsonを作成します。initと打ち込んで、全てエンターを押し返答します。initpackage.jsonが作成されました。必要なライブラリをインストールします。以下のコマンドでライブラリをインストールします。–save-devとすることによって、package.jsonにインストールしたライブラリの名前が保存されます。vinyl-source-stream結構長いです。node_modulesというフォルダが作成されます。ライブラリのインストールが終わりました。jsのサーバーファイルを作成するチュートリアルではサーバにjsonを投げて、データを保存します。そのため、server.jsを作成して、nodeサーバを実装します。githubのチュートリアル用のgithubレポジリーに必要なサーバファイルがありますが。https://github.com/reactjs/react-tutorial/このserver.jsはあまり、汎用的な書き方をしていないので、汎用性があるserver.jsを自作します。汎用性のあるnodeサーバとはチュートリアルを終えた後に、自分でreactコーディングをする際に、便利なサーバのことです。server.jsを作成します。server.js以下を記述します。'/');});といって、私はnode使ったことないので、上のexpressを使ったnodeサーバはほぼコピペです。gulpファイルを作成するgulpは用はレシピみたいなものです。gulp自体は色々な場面で使えるのですが、それはreactでも同じです。reactを動かすために必要な手順をgulpにまとめます。フィアルを作成します。'browser-sync']);index.htmlを作成するindex.htmlを作成します。</body></html>index.jsを作成するメインの処理が記述されているindex.jsを作成します。worldが表示されるところまで持ってこれました。サーバの起動gulpコマンドでサーバを起動します。gulpブラウザでこんな感じで表示されれば成功ファイルを分割する今は、index.jsにスクリプトが書かれていますが、大規模に向けてファイルを分割します。gulpfile.jsを見ればわかりますが、componentsフォルダを作成して、そこにjsファイルを設置し、index.jsでrequireするようにします。document.getElementById('content'));components/CommentBox.jsに以下を記述します。}};これで、ファイルの分割ができました。まとめReactからnodeに入る人は最初の環境構築で結構苦労すると思います。この環境構築をうまく改変していくことで、チュートリアル以外でも、reactの開発がおこなれる様になります。スポンサードリンク「為になったなぁ」と思ったら、シェアお願いします。コメントをキャンセルメールアドレスが公開されることはありません。みなさんこんにちはcandleです。今回はreactでsimple-formatを使ってみたいと思います。Railsでは有名で、よく使われます。みなさんこんにちはcandleです。前回からfluentd関連の記事を続けていますが、今回辺りから実用的な使い方を書いていきたいと思います。みなさんこんにちはcandleです。bogoのショートコードをカスタマイズしてみたいと思います。紹介する項目は以下の2つです。皆んさんこんにちはcandleです。今回はpythonの機械学習ライブラリ『scikit-learn』を使い、データの前処理をしてみます。みなさんこんにちはcandleです。wordpressは大変便利なのですが、いまいちgitで管理するのが難しいものです。Sansフォントウェイトのcss書き方まとめプロフィールベンチャー企業のCTOをやってます。大学時代にプログラミングを始め、javaから入門し、C++へて、PHPへと進み、会社ではRailsを使用。環境設定スポンサードリンクjoppotコピペで絶対動く。