0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

Node.js,Expressメモ④

Posted at

アイコンをうちの猫にしてみました。こんにちは。
rete.jsを使いたいためにExpressのチュートリアルを進めています。
前回はmongoDBに初めて触れてうきうきです。
新しい知識を実践投入したいところもありますが、今はDBがメインではないので頭の片隅においときます。

今回はこちらのPart4をやります。
https://developer.mozilla.org/ja/docs/Learn/Server-side/Express_Nodejs/routes

Part3の後半からすっかり翻訳がされなくなってしまっています。
俺の英語力よ目覚めよ。
(google翻訳した時は2画面になって左右に並んでくれたら最高なのに。)

こんかいすること

・どんな情報をページに表示するか設定して適切なURLを返すこと
・リクエストに応じてモデルからデータを取得してHTMLページに表示する

(定番の図ではありますが)こういうイメージだそうです。
image.png

Routesとは

ルートは適切なHTTP(GET, POST, PUT, DELETE, etc.)URL パス、パターン、そしてそれらを操作する関数が含まれます。
それらの方法はいくつかあるけど、チュートリアルではexpress.Routerを使用しています。

まず個別のルートを作る?

wiki.jsという独立したルートを作るようです。
なぜ急にwikiが!と思いますがとりあえず先生の教えに従います。

wiki.jsはapp.jsと同じ階層に置きます。(先生の教え)

get メソッド

router.get("/about", function(req, res){ res.send("About this wiki"); })

・req(HTTP request)
・res(HTTP response)
・next(上のケースではres.send()を使っているからnextは指定していないらしいです)

res.sendのほかにjsonを返すres.json(), ファイルを返すres.sendFile()もあるようですね。

URLの設定

rooter.get("/url名", function(req, res){処理}
でいくらでもルート以下の階層を定義できるってことなんですね。なるほど。
またこのurl名は正規表現?もいけるとのこと。記憶。

app.get(/.*fish$/, function (req, res) {}

また以下のパターンで動的にパラメーターを受け渡せる。
Bookの例で書いてあるのはこんな感じ。
http://localhost:3000/users/34/books/8989/users/:userId/books/:bookId
というパターンにするとuserIdが34, :bookIdが8989になるそうな。
これはわかりやすい。

そしてそれらはjson形式で保持されているようです。
req.params = {"userId": 34, "bookId": 8989}

ちなみに、、bookを追加するとき用に/book/createを作りたいとしたときに/book/:userIdとパターンを設定すると
{userID: create}になることがあります。
上から順番にマッチさせるようなので順番には気を付けてください。とのこと。

ページの追加

基本的にjsを追加して関連付けるみたいですね。

// routes/wiki.js
var express = require("express");
var router = express.Router();

router.get("/", function(req, res){
    res.send("About this wiki");
})

module.exports = router;

※コードの書き方はじめてわかった!

最後の一行がとても大事なようです。この一文が入っていなくて数時間無駄にしました。。

app.jsに以下を追加
var wiki = require("./wiki");

app.set("/wiki", wiki);

シンプルに追加するにはこれだけでいいようです。
これでにアクセスできるようになります。

http://localhost:3000/wiki
ほー。

controller

MVCのCではありますが、いつももやっとします。
wikipediaによると
ユーザからの入力(通常イベントとして通知される)をモデルへのメッセージへと変換してモデルに伝える要素である。すなわち、UIからの入力を担当する。モデルに変更を引き起こす場合もあるが、直接に描画を行ったり、モデルの内部データを直接操作したりはしない。
と書かれています。

要はUIで入力したものをモデルに渡す部分の独立性を保てばいいのかな、、

bookControler.js
var Book = require("../models/book");

exports.index = function(req, res){
    res.send("NOT IMPLEMENTED: site Home Page");
}

exports.book_create_get = function(req, res){
	res.send("NOT IMPLEMENTED: book create GET");
};

exports.book_create_post = function(req, res){
	res.send("NOT IMPLEMENTED: book create POST");
};
省略

最初にbookのモデルを読み込んでいるがチュートリアルに記述はないです。
進めていくうちに使われるのかなと楽しみにしつつ写経を続けます。

routes/catalog.js

var express = require('express');
var router = express.Router();

var book_controller = require("../controllers/bookController");

router.get("/", book_controller.index);
router.get("/book/create", book_controller.book_create_get);
router.post("/book/create", book_controller.book_create_post);
省略

catalogにこういうurlが来たらこういう処理をするよーという処理を関連付けます。
よくよくみたらこのチュートリアルを通して違う書き方もできそうですが、これから記述が増えて
分ける意味がでてくるんかなと思います。

app.js
var catalogRouter = require("./routes/catalog");
app.use("/catalog", catalogRouter);

最後にappに追加してcatarogのurlを呼び出せるようにします。
なるほど!

これでダミー構造がだいたいできたのかなと思います。
次回はモデルの追加、更新、削除あたりが出てきそうな予感です。

つづく。

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?