JavaScriptだけでWebサイト開発

node.js + Express + mongodb系 + React でサービスを作るメモ

tips

Express+mongoose+passportでユーザー登録認証&セッション全部やる

使用するミドルウェア これらを使用するとロジックをコーディングする必要がなくなる mongoose express-session passport passport-local passport-local-mongoose connect-mongo setup $ cd ~/ $ express userlogin $ cd userlogin $ npm install $ npm ins…

create-react-appでreact-router

環境設定 routerフォルダでプロジェクトを作成 $ cd ~/ $ create-react-app router react-routerインストール 今回はwebサイト $ cd ~/router $ npm install --save react-router-dom src/App.js 編集 前ページ共通で表示するHeader,Footer トップページは/ …

create-react-appのアプリをExpress内で配置、配信する

クライアントReactアプリとWebサーバー&APIサーバーを分けるのが面倒で一箇所(プロセス)でホスティングしたいときがあります create-react-app で作成したプロジェクトをexpressの /_admin 以下で動作(配信)させてみます Express環境 $ express together …

create-react-app で Material-UIの画面を表示してみる

create-react-appでプロジェクトを作成し、Material-UIを利用した画面を表示します 環境設定 ローカルの開発環境はこちら * macOS High Sierra(v10.13)でJavaScript開発環境を整える create-react-app でプロジェクトの雛形作成して起動してみる $ cd ~/ $ c…

express-react-views+Material-UIをSSRで試す

わざわざServer Side Renderingでやるべきことではないですが、やってみました。 やったこと express-generator で雛形を作る app.jsで view engineに express-react-views を設定 view 内の layout.jsxとindex.jsx でmaterial-uiを利用 ブラウザで確認 環境…

Express+mongooseでsession管理

mongooseでセッション管理 パッケージインストール $ npm install --save mongoose $ npm install --save express-session $ npm install --save connect-mongo プロジェクト雛形作成 $ express session app.js var express = require('express'); var sessi…

mongooseでpasswordを暗号化して保存してチェックする方法

Express+mongooseでパスワードを暗号化して保存する方法 mongoose-bcrypt をインストール npm install mongoose-bcrypt --save app.js ルーティングの/ でデータ登録、/checkでパスワードをチェックしてみます app.js var mongoose = require('mongoose'); c…

mongooseでauto increment のフィールド定義と動作確認

Express+mongooseで RDBのようなAUTO INCREMENTフィールドを実現する mongoose-sequence パッケージをインストール $ npm install --save mongoose-sequence app.js var mongoose = require('mongoose'); const option = { useMongoClient: true, }; mongoos…

©ichi-bit