6. 一覧画面の作成 一覧画面を作ろう

一覧画面を作ろう

目標作成物：買い物メモ一覧画面を作っていく

一覧画面を表示させよう

目的：指定localhostのアクセス時、一覧画面表示させる手順を覚える

app.get('/index' ,(req, res) => {
res.render('index.ejs');
});

２つのプロセスを完成させる

上記コードには２つのコードが書かれている。

1. 指定ファイルにアクセスしたときのコード
2. 一覧画面が表示されるようにするコード

２つの詳細は下記へ。

--

• 指定ファイルにアクセスしたときのコード

 app.get('/指定ファイル'

このように覚えて書く

• 一覧画面が表示されるようにするコード

res.render('index.ejs');

このように覚えて書く

--

演習問題

--

point

'指定localhostのアクセス時、一覧画面表示させる'コードをそれぞれ書く

   -指定ファイルに対する指定ルーティンを用意する。

 第2引数に指定するルーティングの処理時に気を付けることを手順に沿って書く

 '一覧画面を表示するルーティングを作成'するには新ファイルが必要。

指定フォルダから新ejsファイル作成する。

最後に

予め用意されている「買い物メモ一覧HTML」を「新規指定ファイル」にコピペする。

ブラウザの指定URLにて画像確認。

今回は以上です。お疲れ様でした。