express ドットインストール

# メモ

```javascript

# 一覧表示の書き方

 <%for (var i=0; i<posts.length; i++) {%>
　 <li>
　  <a href="/posts/<%=i%>"><%= posts[i].title %></a>
　 </li>
<%}%>


# hrader footerの場合

- ファイルを切り分ける

- 読み込む
<%include ../header%>


# exports

exports.index = function(req,res){
  res.render("posts/index", {posts: posts})
}


# post bodyParser

var bodyParser = require('body-parser')
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));

# ディレクトリ構造

- ejsを入れると下記の構造になる

views/indexとか

- 各ディレクトリに分けると

views/post
views/comment


- render
render("post/index")

# http js delete methodの呼び方

    <input type="submit" value="del">
        <input type="hidden" name="_method" value="delete">
        <input type="hidden" name="id" value="<%= i %>">
        </form>

# req.params と req.body

- URL
req.params.id

- postで送られてくる
req.body.name%
```


```javascript:app.js

var express = require("express");
var app = express();
var post = require('./routes/post')
var bodyParser = require('body-parser')
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));



// app.use(express.methodOverride())


// テンプレートエンジンの指定
app.set("view engine", "ejs");

app.use(express.static("posts"));

app.get("/", post.index )



app.get('/', post.index);
app.get('/posts/:id([0-9]+)', post.show);
app.get('/posts/new', post.new);
app.post('/posts/create', post.create);
app.get('/posts/:id/edit', post.edit);
app.put('/posts/:id', post.update);
// app.delete('/posts/:id', post.destroy);


// app.get("/posts/new", post.new)

// app.post("/posts/create",post.create)

// app.get("/posts/:id/edit",post.edit)
// app.put("/posts/:id",post.upate)
// app.delete("/posts/:id",post.destroy)



app.listen(3000);




// #ファイルの読み込み

// 階層構造作成
// app.use(express.static("public"));

// ファイルの読み込み
// res.sendFile('/public/hello.txt')


// # ejs　テンプレートエンジン

// app.set('view engine', 'ejs');

// app.get('/hello', function(req,res){
//     res.render("./index")
// })

// パラメーターも
// https://qiita.com/kamihork/items/1b13d2157979d1837849
// res.render("index", {message: message})


// # ミドルウェアの使い方

// console.log(req.params)
// ➜  react-express node app.js
// { name: 'akifumi' }


// 基本的なルーティング
// https://expressjs.com/ja/starter/basic-routing.html


// useメソッド　ミドルウェア利用
// https://expressjs.com/ja/guide/using-middleware.html

// use app.use(path, callback)
// https://expressjs.com/ja/4x/api.html#app.use
```


# クロスドメイン

https://qiita.com/tomoya_ozawa/items/feca4ffc6217d585b037


# fetch Post

https://qiita.com/legokichi/items/801e88462eb5c84af97d

```javascript:post.js

var posts = [
 {title:"dsa", body:"dasda"},
 {title:"dsa", body:"dasda"},
 {title:"dsa", body:"dasda"}
]

exports.index = function(req,res){
  res.render("posts/index", {posts: posts})
}

exports.show = function(req,res){

  res.render("posts/show", {post: posts[req.params.id]})
}

exports.new = function(req,res){


  res.render("posts/new")
}

exports.edit = function(req,res){
  res.render("posts/edit", {post: posts[req.params.id], id:req.params.id})
}

exports.update = function(req, res) {
  console.log(req.body.title)
  posts[req.body.id] = {
      title: req.body.title,
      body: req.body.body
  };
  res.redirect('/');
};

exports.create = function(req,res){
  var post = {
    title: req.body.title,
    body: req.body.body
  }
  console.log("create")
  posts.push(post)
  res.redirect("/")
}


```


## パスの加工

```
var apiRoutes = express.Router();
app.use('/api', apiRoutes);
:::

apiRoutes.get("/posts", function(req,res){
 console.log("get Lists")
  res.send(lists)
})

fetch("http://localhost:5000/api/posts")


```