node.jsで、mysql内容を取得しようとするとエラーが出てくる。

前提

Progateというサイトを使い、その内容をコピペして自分のPCでも動くか試していたところ、エラーが出てしまい表示されなく困っています。

実現したいこと

mysqlでデータを取得して、表示されるようにしたい。

発生している問題・エラーメッセージ

TypeError: /Users/matsuochinyu/home/development/web/app/node/2/views/index.ejs:25
    23|         </div>
    24|         <ul class="table-body">
 >> 25|           <% items.forEach((item) => {
    26|             %>
    27|             <li class="table-row">
    28|               <span class="id-column"><%= item.id %></span>

Cannot read properties of undefined (reading 'forEach')
    at eval ("/Users/matsuochinyu/home/development/web/app/node/2/views/index.ejs":12:14)
    at index (/Users/matsuochinyu/home/development/web/app/node/2/node_modules/ejs/lib/ejs.js:703:17)
    at tryHandleCache (/Users/matsuochinyu/home/development/web/app/node/2/node_modules/ejs/lib/ejs.js:274:36)
    at exports.renderFile [as engine] (/Users/matsuochinyu/home/development/web/app/node/2/node_modules/ejs/lib/ejs.js:491:10)
    at View.render (/Users/matsuochinyu/home/development/web/app/node/2/node_modules/express/lib/view.js:135:8)
    at tryRender (/Users/matsuochinyu/home/development/web/app/node/2/node_modules/express/lib/application.js:657:10)
    at Function.render (/Users/matsuochinyu/home/development/web/app/node/2/node_modules/express/lib/application.js:609:3)
    at ServerResponse.render (/Users/matsuochinyu/home/development/web/app/node/2/node_modules/express/lib/response.js:1039:7)
    at Query.<anonymous> (/Users/matsuochinyu/home/development/web/app/node/2/app.js:23:11)
    at Query.<anonymous> (/Users/matsuochinyu/home/development/web/app/node/2/node_modules/mysql/lib/Connection.js:526:10)

該当のソースコード

app.js
1/* eslint-disable n/handle-callback-err */
2const express = require('express')
3const mysql = require('mysql')
4const app = express()
5
6app.use(express.static('public'))
7
8const connection = mysql.createConnection({
9  host: 'localhost',
10  user: 'matsuochinyu',
11  password: 'PASSWORD',
12  databas: 'progate'
13})
14
15app.get('/', (req, res) => {
16  res.render('top.ejs')
17})
18
19app.get('/index', (req, res) => {
20  connection.query(
21    'SELECT * FROM items',
22    (error, results) => {
23      res.render('index.ejs', {
24        items: results
25      })
26    }
27  )
28})
29
30app.listen(3000)
31

index.ejs
1<!DOCTYPE html>
2<html>
3
4  <head>
5    <meta charset="utf-8">
6    <title>LIST APP</title>
7    <link rel="stylesheet" href="/css/style.css">
8    <script src="/send_url.js"></script>
9  </head>
10
11  <body>
12    <header>
13      <a href="/" class="header-logo">LIST APP</a>
14    </header>
15    <div class="container">
16      <div class="container-header">
17        <h1>買い物リスト</h1>
18      </div>
19      <div class="index-table-wrapper">
20        <div class="table-head">
21          <span class="id-column">ID</span>
22          <span>買うもの</span>
23        </div>
24        <ul class="table-body">
25          <% items.forEach((item) => {
26            %>
27            <li class="table-row">
28              <span class="id-column"><%= item.id %></span>
29              <span><%= item.name %></span>
30            </li>
31            <%
32          }) %>
33          })%> 
34        </ul>
35      </div>
36    </div>
37  </body>
38
39</html>

補足情報（FW/ツールのバージョンなど）

MacOS：Catalina10.15.7
node：18.0.0
mysql：8.0.29
ejs：3.1.7

Orlofsky

2022/05/05 04:11

質問は修正できます。良くわからない ↓ Cannot read properties of undefined ... 意味を理解しましょう。

Orlofsky

2022/05/05 04:13

>Progateというサイト出典を明示する習慣を身に着けましょうい。ここの掲示板では Markdown の使い方を覚えて URLは https://teratail.com/help/question-tips#questionTips37 の [リンク] で [リンク先の説明](http...) で提示してください。