React+Redux+Express+MongoDBでものすごくシンプルなCRUDアプリをつくる - Qiita
#概要 React+Redux+Express+MongoDBでCRUDアプリを作ります。 この記事の目的は、React/Reduxを触り始めた人が サーバーとの通信の方法（より一般的には非同期処理の方法） Reduxにおけるフォームの扱い ExpressによるAPI node.jsからのMongoDBの操作 Herokuへのデプロイ など、主にサーバー側のデータの操作に関わる基本的な事項を学ぶきっかけを作ることです。 この目的に集中するために、それ以外の点については一切気にしないことにします。 そのため、初心者以外の人（上記の内容を理解している人）がこの記事を読んでも得るものはないと思います。 この記事が書かれた背景には、少し前に自分自身がjavascriptによるフロントエンド開発からwebプログラミングを学び始めたころの経験があります。ReactやReduxの基本的な文法の理解を終え
React+Redux+Express+MongoDBでものすごくシンプルなCRUDアプリをつくる - Qiita
概要 React+Redux+Express+MongoDBでCRUDアプリを作ります。 この記事の目的は、React/Reduxを触り始めた人が サーバーとの通信の方法（より一般的には非同期処理の方法） Reduxにおけるフォームの扱い ExpressによるAPI node.jsからのMongoDBの操作 Herokuへのデプロイ など、主にサーバー側のデータの操作に関わる基本的な事項を学ぶきっかけを作ることです。 この目的に集中するために、それ以外の点については一切気にしないことにします。 そのため、初心者以外の人（上記の内容を理解している人）がこの記事を読んでも得るものはないと思います。 この記事が書かれた背景には、少し前に自分自身がjavascriptによるフロントエンド開発からwebプログラミングを学び始めたころの経験があります。ReactやReduxの基本的な文法の理解を終えて
Reduxの概念をRxJSとTypeScriptで理解する(初心者向け) - Qiita
(2016/12/15追記) この記事はDeprecatedです。 Reduxの概念をRxJSとTypeScriptで理解する ver.2 が最新版になります。 GitHubリポジトリはこちら → ovrmrw/understanding-redux-with-rxjs git cloneしたらnpm installしてnum run tsですぐに動かせます。 (注: Reactの話は一切出てきません) Reduxとは Redux公式 アプリケーション全体で状態(state)を一つのJSONツリーの構造で持ち、それをActionがキックされる度に全体更新して配信するという概念。 僕は最初FluxとかReduxとかよくわからなかったけど、色々参考にしながら自分で書いてみたらようやく理解できました。 Middlewareという概念はよくわからなかったし今でもよくわかりません。 ロガーとか便利な
自社サービス採用へ。本気で作るReact+Reduxのプロジェクト構成 - Qiita
サイバー・バズの@yuinchirnです。 弊社で最近リリースした「Cloud-F」というアパレルのクラウド展示会サービスは、フロントサイドはReact + Redux + Webpack、サーバサイドはScala + Akka HTTPで作られています。 今回は、フロント側のReact + Reduxを使ったプロジェクトの構成について紹介していきます。 React + Reduxプロジェクトを作る上で参考になればと思っております。 下記記事を読んで基本を押さえておくと読みやすいと思います。 React+Redux入門 全体のディレクトリ構成 今回はバイヤー向け管理画面、ブランド向け管理画面という二つの画面を作るため、 両方のプロジェクトで共通で利用する部分は/common バイヤー向け管理画面は/buyer ブランド向け管理画面は/brand という３つのReact ＋ Reduxプロジ
React+ReduxをRails環境下で開発する環境構築テンプレート（Webpackも使うし、Reduxのサーバサイドレンダリングもあるよ） - Qiita
色々情報がありますが、断片化されてたので纏めました。 もしこんな環境で開発する人がいれば参考にして下さい。 というか1つの記事に詰め込み過ぎたかもしれません。 ちなみにこの環境構築は以下の記事を参考に作成されています。 WebPackを使ってRailsからJavaScriptを楽に良い感じに分離する Rails + モダンJS環境(Webpack)で新規アプリ作成 RailsでReduxコンテナをサーバサイドレンダリング (use Hypernova by airbnb) 素晴らしい記事に感謝。 今回書いた記事のソースはこちらです。 前提条件 本記事では以下のような開発環境を想定して記載します。 バックエンド：Rails（API） フロントエンド：React（+Redux） (JS)ビルド：Webpack よく、browserifyとRailsを組み合わせた記事とかは見ますが、Webpac
Roc - React/Reduxを使ったnodeフレームワーク MOONGIFT
Reactを使ってみたいと思うプログラマはたくさんいると思うのですが、いざちゃんとしたものを作ろうと思うとフレームワークの存在に悩むことになります。Reduxを使うとしてもどういう組み合わせ、ディレクトリ構成でやるのがベストなのか分かりづらかったりします。 そこで使ってみたいのがRocです。React/Reduxを使ったnodeのWebアプリケーションフレームワークです。 Rocの使い方 Rocのインストールはnpmでできます。 npm install -g roc アプリケーションの初期設定はinitを使います。対話型で作ります。 $ roc init web-app-react Found a folder named /path/to/react-app, will try to use it. Using v1.0.3 as template version : ? What's
React,Redux,Express,Mongoのフルスタックなboilerplate - Qiita
reactjsでwebアプリを作成するにあたって、とても参考になりそうなreact-webpack-nodeというBoilerplateを見つけたので、中身を見てみる。 構成は、 React + Redux Express MongoDB + mongoose となっており、フルスタック。 jsのmodule bundlerはwebpackで、hot reloadにもserver side renderingにも対応。 ログインのサンプル実装まである上に、herokuへのdeploy手順まで記載されているので、 reactjsで何か作りたい時はこれを土台に単に機能を乗せていくだけで良い感が... まずは勉強がてらcommitされているファイルを軽めにみていく。 package.jsonをみてみる scriptsは、 "scripts": { "clean": "rimraf public"
Redux ExampleのTodo Listをはじめからていねいに(1) - Qiita
Reduxの公式ExampleにあるTodo Listを少しづつ書いてみました。 最終的な動作イメージは以下のような感じです。 Github Pagesにもあげていますので、触ってみてください。 基本的なReduxの説明や環境構築などは他のドキュメントに譲るとして、 ここでは各機能ごとに動くものを作りながら、最終的にExampleの形になることを目指します。 Reactがだいたい分かってて（チュートリアルをやったくらい）で、 Reduxを触り始めたくらいの人を対象としています。 Reduxを触り始めて日が浅いので、間違いもあるかと思います。ぜひご指摘ください。 ExampleのTodo Listの機能は次の3つです。 TodoをTodo Listに追加する「Add Todo」 Todoの完了・未完了を切り替える「Toggle Todo」 表示するTodo Listを完了または未完了のTod
React・Reduxを使ったElectronアプリのboilerplateを作ってみました - DJ lemon-Sour's diary (prod.hisasann)
hisasann/electron-react-redux-boilerplate はじめに Node.js + Babel 6 + React + Redux + Webpack + Gulp + Electron Electronを母体として、React・Reduxを使ったフロントエンドのアーキテクチャについて試したことをメモメモ Webpackはbrowserifyとしか使っていません Electron 最近はやりのElectron（MacやWindowsのアプリ化）を使った場合の開発の仕方や、どうやるのが効率的かを少しずつメモしていきます 現時点では、Electronでビルドしたアプリのリリースやアップデートに関しては未調査になります Livereload まずは Livereload これがないとはじまりません 以下の記事を参考に、gulpのタスクを作ってみました ぼくのかんがえ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
GitHub - donkeysharp/yart: Yet another npm-scripts-based SASS, ES2015(Babel), Browserify, React/Redux, React-Router SPA template