From 5b9f32d4c2c69b68ebde135f145e06a2f8a35d47 Mon Sep 17 00:00:00 2001
From: Robert Woodruff <rwoodruff@Roberts-Air.fios-router.home>
Date: Sun, 28 Feb 2021 23:45:51 -0500
Subject: [PATCH 1/4] successfully connected to database and displaying data to
 the console, the server, and html page

---
 data/schema.sql | 28 ++++++++++++++++++++++++++++
 index.js        | 14 +++++++++++++-
 rest/index.js   | 16 ++++++++++++----
 3 files changed, 53 insertions(+), 5 deletions(-)

diff --git a/data/schema.sql b/data/schema.sql
index e69de29..6ad89eb 100644
--- a/data/schema.sql
+++ b/data/schema.sql
@@ -0,0 +1,28 @@
+create database pokedex;
+use pokedex;
+
+CREATE TABLE pokemon (
+	pokemon_id INT PRIMARY KEY NOT NULL,
+    name VARCHAR(255) NOT NULL,
+    color VARCHAR(255),
+    -- type VARCHAR(255),
+    -- type2 VARCHAR(255),
+    weakness VARCHAR(255)
+    );
+
+CREATE TABLE types (
+	type_id INT PRIMARY KEY NOT NULL auto_increment,
+    type VARCHAR(255) NOT NULL,
+    FOREIGN KEY (type_id) REFERENCES pokemon_type(type_id)
+);
+
+CREATE TABLE pokemon_type (
+	pokemon_type_id INT PRIMARY KEY NOT NULL auto_increment,
+    type_id INT NOT NULL,
+	pokemon_id INT NOT NULL,
+    FOREIGN KEY (pokemon_id) REFERENCES pokemon(pokemon_id),
+    FOREIGN KEY (type_id) REFERENCES types(type_id)
+);
+
+ALTER TABLE pokemon_type ADD FOREIGN KEY(pokemon_id) REFERENCES pokemon(pokemon_id);
+ALTER TABLE pokemon_type ADD FOREIGN KEY(type_id) REFERENCES types(type_id);
\ No newline at end of file
diff --git a/index.js b/index.js
index bba5463..b231854 100644
--- a/index.js
+++ b/index.js
@@ -8,4 +8,16 @@ app.get('/', (req, res) => {
 
 app.listen(port, () => {
   console.log(`Example app listening at http://localhost:${port}`)
-})
\ No newline at end of file
+})
+
+function getRandomDoggiePic(){
+  let xhr = new XMLHttpRequest();
+  xhr.onreadystatechange = function(){
+      if(this.readyState === 4 && this.status === 200){
+          document.getElementById("doggie").src = this.responseText;
+      }
+  }
+
+  xhr.open("GET", "http://localhost:4000/dog/random")
+  xhr.send();
+}
\ No newline at end of file
diff --git a/rest/index.js b/rest/index.js
index bba5463..d3b4429 100644
--- a/rest/index.js
+++ b/rest/index.js
@@ -1,6 +1,7 @@
-const express = require('express')
-const app = express()
-const port = 3000
+const express = require('express');
+const app = express();
+const port = 3000;
+let mysql = require('mysql');
 
 app.get('/', (req, res) => {
   res.send('Hello World!')
@@ -8,4 +9,11 @@ app.get('/', (req, res) => {
 
 app.listen(port, () => {
   console.log(`Example app listening at http://localhost:${port}`)
-})
\ No newline at end of file
+})
+
+let con = mysql.createConnection({
+  host: "localhost",
+  user: "yourusername",
+  password: "yourpassword",
+  database: "mydb"
+});
\ No newline at end of file

From 984d2d7e5bfd27295e8d564b3f4e8273b1656408 Mon Sep 17 00:00:00 2001
From: Robert Woodruff <rwoodruff@Roberts-Air.fios-router.home>
Date: Sun, 28 Feb 2021 23:49:18 -0500
Subject: [PATCH 2/4] successfully connected to database and displaying data to
 the console, the server, and html page

---
 .DS_Store         | Bin 0 -> 6148 bytes
 data/schema.sql   |  66 +++++++++++++++++++--------------
 package-lock.json |  91 ++++++++++++++++++++++++++++++++++++++++++----
 package.json      |   4 +-
 rest/index.js     |  39 ++++++++++++++------
 web/index.html    |   8 +++-
 web/index.js      |  22 +++++++++++
 7 files changed, 181 insertions(+), 49 deletions(-)
 create mode 100644 .DS_Store
 create mode 100644 web/index.js

diff --git a/.DS_Store b/.DS_Store
new file mode 100644
index 0000000000000000000000000000000000000000..e3eb4ccbc28e098f36a0c92d3bece8bdd612b9b8
GIT binary patch
literal 6148
zcmeHK!H&}~5FNJx5*9>}kk|`SF5F7ht#-BQ0V!L$hdm%6ir@gKn{29XARAY0N`X?;
zJ6`|?eu3}c3-}gJ@WwV(ld?C25b{X&8{2Qj@oQtpL?k-Xc!#J)L@o-Wa~aidjK{fb
zSjF^g0R`tcO65tE$_Q;vXw52M75KLm;CI)dm_o`aEWN)67;F4crWWB)LT5CjNs0HR
z#B;&RkaIw<sX;Hwd~vJ9zXG;Y{66xtH>DKOrFm4`=e6g#P9r?`3B5!;1pf}Aq-v{K
z;b+As6(2TcE@n6{?t3ZDqla`z2h^qezy_W=F3waLmLeP)^NJ`h@{ogQeN8J~G@Fdf
zUivi}rO703Hou8V)wyu-lIyx#?p61B?^Moud6-WpopAh=TMxqgG&24pDbtl7Mvs%h
ztY5ovPiA?TWP`B^PT~P5&z>Y%EN2}#&Ekp5)6)Z<=eb_LwmqNk?e5k6R(pR@_vh_a
zv+nP<TZ@I~-n_kY_vrZS&D;6A#ruy~3{2oKP<GAWFZcv!wZK=sahA%Ag<^h{W)LVU
z$-{rGb$QUV_NNpuKa<OQfHkXtRlq8+t^n^3J_=)CaH&yk9jMe50O+7w8GQBW5A?YM
z7#Lh?L=Q~pP@oPK=87TA%|YmJj0c9l)TqNrsF{(+%q+|eMVO0+@D-gzpwZS=0joe!
zfvRrS`20US|NdVLvMsBCRp7r;KseoAw}T~_vvp%}eAfCX$0%&fTWVAxsLXM!96pM-
cQIuiKX9pM<TxvuQ%zg+c8Ej=0_^S&11k>HdMF0Q*

literal 0
HcmV?d00001

diff --git a/data/schema.sql b/data/schema.sql
index 6ad89eb..f607db3 100644
--- a/data/schema.sql
+++ b/data/schema.sql
@@ -1,28 +1,38 @@
-create database pokedex;
-use pokedex;
-
-CREATE TABLE pokemon (
-	pokemon_id INT PRIMARY KEY NOT NULL,
-    name VARCHAR(255) NOT NULL,
-    color VARCHAR(255),
-    -- type VARCHAR(255),
-    -- type2 VARCHAR(255),
-    weakness VARCHAR(255)
-    );
-
-CREATE TABLE types (
-	type_id INT PRIMARY KEY NOT NULL auto_increment,
-    type VARCHAR(255) NOT NULL,
-    FOREIGN KEY (type_id) REFERENCES pokemon_type(type_id)
-);
-
-CREATE TABLE pokemon_type (
-	pokemon_type_id INT PRIMARY KEY NOT NULL auto_increment,
-    type_id INT NOT NULL,
-	pokemon_id INT NOT NULL,
-    FOREIGN KEY (pokemon_id) REFERENCES pokemon(pokemon_id),
-    FOREIGN KEY (type_id) REFERENCES types(type_id)
-);
-
-ALTER TABLE pokemon_type ADD FOREIGN KEY(pokemon_id) REFERENCES pokemon(pokemon_id);
-ALTER TABLE pokemon_type ADD FOREIGN KEY(type_id) REFERENCES types(type_id);
\ No newline at end of file
+-- Run once to setup MySQL
+-- ALTER USER 'root'@'localhost' IDENTIFIED WITH mysql_native_password BY 'password';
+-- flush privileges;
+
+-- create database pokedex;
+
+-- use pokedex;
+
+-- CREATE TABLE pokemon (
+-- 	pokemon_id INT PRIMARY KEY NOT NULL,
+--     name VARCHAR(255) NOT NULL,
+--     color VARCHAR(255),
+--     -- type VARCHAR(255),
+--     -- type2 VARCHAR(255),
+--     weakness VARCHAR(255)
+--     );
+
+-- CREATE TABLE types (
+-- 	type_id INT PRIMARY KEY NOT NULL auto_increment,
+--     type VARCHAR(255) NOT NULL,
+--     FOREIGN KEY (type_id) REFERENCES pokemon_type(type_id)
+-- );
+
+-- CREATE TABLE pokemon_type (
+-- 	pokemon_type_id INT PRIMARY KEY NOT NULL auto_increment,
+--     type_id INT NOT NULL,
+-- 	pokemon_id INT NOT NULL,
+--     FOREIGN KEY (pokemon_id) REFERENCES pokemon(pokemon_id),
+--     FOREIGN KEY (type_id) REFERENCES types(type_id)
+-- );
+
+-- ALTER TABLE pokemon_type ADD FOREIGN KEY(pokemon_id) REFERENCES pokemon(pokemon_id);
+-- ALTER TABLE pokemon_type ADD FOREIGN KEY(type_id) REFERENCES types(type_id);
+
+-- INSERT INTO pokemon (pokemon_id, name, color, weakness) VALUES (10, 'Caterpie', 'Green', 'Fire');
+-- UPDATE pokemon SET weakness = 'Grass' WHERE name = 'Blastoise';
+
+-- SELECT * FROM pokemon;
\ No newline at end of file
diff --git a/package-lock.json b/package-lock.json
index 1fca92a..b90db60 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -18,6 +18,11 @@
       "resolved": "https://registry.npmjs.org/array-flatten/-/array-flatten-1.1.1.tgz",
       "integrity": "sha1-ml9pkFGx5wczKPKgCJaLZOopVdI="
     },
+    "bignumber.js": {
+      "version": "9.0.0",
+      "resolved": "https://registry.npmjs.org/bignumber.js/-/bignumber.js-9.0.0.tgz",
+      "integrity": "sha512-t/OYhhJ2SD+YGBQcjY8GzzDHEk9f3nerxjtfa6tlMXfe7frs/WozhvCNoGvpM0P3bNf3Gq5ZRMlGr5f3r4/N8A=="
+    },
     "body-parser": {
       "version": "1.19.0",
       "resolved": "https://registry.npmjs.org/body-parser/-/body-parser-1.19.0.tgz",
@@ -63,6 +68,20 @@
       "resolved": "https://registry.npmjs.org/cookie-signature/-/cookie-signature-1.0.6.tgz",
       "integrity": "sha1-4wOogrNCzD7oylE6eZmXNNqzriw="
     },
+    "core-util-is": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/core-util-is/-/core-util-is-1.0.2.tgz",
+      "integrity": "sha1-tf1UIgqivFq1eqtxQMlAdUUDwac="
+    },
+    "cors": {
+      "version": "2.8.5",
+      "resolved": "https://registry.npmjs.org/cors/-/cors-2.8.5.tgz",
+      "integrity": "sha512-KIHbLJqu73RGr/hnbrO9uBeixNGuvSQjul/jdFvS/KFSIH1hWVd1ng7zOHx+YrEfInLG7q4n6GHQ9cDtxv/P6g==",
+      "requires": {
+        "object-assign": "^4",
+        "vary": "^1"
+      }
+    },
     "debug": {
       "version": "2.6.9",
       "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
@@ -192,6 +211,11 @@
       "resolved": "https://registry.npmjs.org/ipaddr.js/-/ipaddr.js-1.9.1.tgz",
       "integrity": "sha512-0KI/607xoxSToH7GjN1FfSbLoU0+btTicjsQSWQlh/hZykN8KpmMf7uYwPW3R+akZ6R/w18ZlXSHBYXiYUPO3g=="
     },
+    "isarray": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+      "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
+    },
     "media-typer": {
       "version": "0.3.0",
       "resolved": "https://registry.npmjs.org/media-typer/-/media-typer-0.3.0.tgz",
@@ -213,16 +237,16 @@
       "integrity": "sha512-x0Vn8spI+wuJ1O6S7gnbaQg8Pxh4NNHb7KSINmEWKiPE4RKOplvijn+NkmYmmRgP68mc70j2EbeTFRsrswaQeg=="
     },
     "mime-db": {
-      "version": "1.45.0",
-      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.45.0.tgz",
-      "integrity": "sha512-CkqLUxUk15hofLoLyljJSrukZi8mAtgd+yE5uO4tqRZsdsAJKv0O+rFMhVDRJgozy+yG6md5KwuXhD4ocIoP+w=="
+      "version": "1.46.0",
+      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.46.0.tgz",
+      "integrity": "sha512-svXaP8UQRZ5K7or+ZmfNhg2xX3yKDMUzqadsSqi4NCH/KomcH75MAMYAGVlvXn4+b/xOPhS3I2uHKRUzvjY7BQ=="
     },
     "mime-types": {
-      "version": "2.1.28",
-      "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.28.tgz",
-      "integrity": "sha512-0TO2yJ5YHYr7M2zzT7gDU1tbwHxEUWBCLt0lscSNpcdAfFyJOVEpRYNS7EXVcTLNj/25QO8gulHC5JtTzSE2UQ==",
+      "version": "2.1.29",
+      "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.29.tgz",
+      "integrity": "sha512-Y/jMt/S5sR9OaqteJtslsFZKWOIIqMACsJSiHghlCAyhf7jfVYjKBmLiX8OgpWeW+fjJ2b+Az69aPFPkUOY6xQ==",
       "requires": {
-        "mime-db": "1.45.0"
+        "mime-db": "1.46.0"
       }
     },
     "ms": {
@@ -230,11 +254,27 @@
       "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
       "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g="
     },
+    "mysql": {
+      "version": "2.18.1",
+      "resolved": "https://registry.npmjs.org/mysql/-/mysql-2.18.1.tgz",
+      "integrity": "sha512-Bca+gk2YWmqp2Uf6k5NFEurwY/0td0cpebAucFpY/3jhrwrVGuxU2uQFCHjU19SJfje0yQvi+rVWdq78hR5lig==",
+      "requires": {
+        "bignumber.js": "9.0.0",
+        "readable-stream": "2.3.7",
+        "safe-buffer": "5.1.2",
+        "sqlstring": "2.3.1"
+      }
+    },
     "negotiator": {
       "version": "0.6.2",
       "resolved": "https://registry.npmjs.org/negotiator/-/negotiator-0.6.2.tgz",
       "integrity": "sha512-hZXc7K2e+PgeI1eDBe/10Ard4ekbfrrqG8Ep+8Jmf4JID2bNg7NvCPOZN+kfF574pFQI7mum2AUqDidoKqcTOw=="
     },
+    "object-assign": {
+      "version": "4.1.1",
+      "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
+      "integrity": "sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM="
+    },
     "on-finished": {
       "version": "2.3.0",
       "resolved": "https://registry.npmjs.org/on-finished/-/on-finished-2.3.0.tgz",
@@ -253,6 +293,11 @@
       "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-0.1.7.tgz",
       "integrity": "sha1-32BBeABfUi8V60SQ5yR6G/qmf4w="
     },
+    "process-nextick-args": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/process-nextick-args/-/process-nextick-args-2.0.1.tgz",
+      "integrity": "sha512-3ouUOpQhtgrbOa17J7+uxOTpITYWaGP7/AhoR3+A+/1e9skrzelGi/dXzEYyvbxubEF6Wn2ypscTKiKJFFn1ag=="
+    },
     "proxy-addr": {
       "version": "2.0.6",
       "resolved": "https://registry.npmjs.org/proxy-addr/-/proxy-addr-2.0.6.tgz",
@@ -283,6 +328,20 @@
         "unpipe": "1.0.0"
       }
     },
+    "readable-stream": {
+      "version": "2.3.7",
+      "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.7.tgz",
+      "integrity": "sha512-Ebho8K4jIbHAxnuxi7o42OrZgF/ZTNcsZj6nRKyUmkhLFq8CHItp/fy6hQZuZmP/n3yZ9VBUbp4zz/mX8hmYPw==",
+      "requires": {
+        "core-util-is": "~1.0.0",
+        "inherits": "~2.0.3",
+        "isarray": "~1.0.0",
+        "process-nextick-args": "~2.0.0",
+        "safe-buffer": "~5.1.1",
+        "string_decoder": "~1.1.1",
+        "util-deprecate": "~1.0.1"
+      }
+    },
     "safe-buffer": {
       "version": "5.1.2",
       "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.2.tgz",
@@ -336,11 +395,24 @@
       "resolved": "https://registry.npmjs.org/setprototypeof/-/setprototypeof-1.1.1.tgz",
       "integrity": "sha512-JvdAWfbXeIGaZ9cILp38HntZSFSo3mWg6xGcJJsd+d4aRMOqauag1C63dJfDw7OaMYwEbHMOxEZ1lqVRYP2OAw=="
     },
+    "sqlstring": {
+      "version": "2.3.1",
+      "resolved": "https://registry.npmjs.org/sqlstring/-/sqlstring-2.3.1.tgz",
+      "integrity": "sha1-R1OT/56RR5rqYtyvDKPRSYOn+0A="
+    },
     "statuses": {
       "version": "1.5.0",
       "resolved": "https://registry.npmjs.org/statuses/-/statuses-1.5.0.tgz",
       "integrity": "sha1-Fhx9rBd2Wf2YEfQ3cfqZOBR4Yow="
     },
+    "string_decoder": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.1.1.tgz",
+      "integrity": "sha512-n/ShnvDi6FHbbVfviro+WojiFzv+s8MPMHBczVePfUpDJLwoLT0ht1l4YwBCbi8pJAveEEdnkHyPyTP/mzRfwg==",
+      "requires": {
+        "safe-buffer": "~5.1.0"
+      }
+    },
     "toidentifier": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/toidentifier/-/toidentifier-1.0.0.tgz",
@@ -360,6 +432,11 @@
       "resolved": "https://registry.npmjs.org/unpipe/-/unpipe-1.0.0.tgz",
       "integrity": "sha1-sr9O6FFKrmFltIF4KdIbLvSZBOw="
     },
+    "util-deprecate": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",
+      "integrity": "sha1-RQ1Nyfpw3nMnYvvS1KKJgUGaDM8="
+    },
     "utils-merge": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/utils-merge/-/utils-merge-1.0.1.tgz",
diff --git a/package.json b/package.json
index 944e450..088de2a 100644
--- a/package.json
+++ b/package.json
@@ -18,6 +18,8 @@
   },
   "homepage": "https://github.com/code-differently/Pokedex-App#readme",
   "dependencies": {
-    "express": "^4.17.1"
+    "cors": "^2.8.5",
+    "express": "^4.17.1",
+    "mysql": "^2.18.1"
   }
 }
diff --git a/rest/index.js b/rest/index.js
index d3b4429..1fcc1cc 100644
--- a/rest/index.js
+++ b/rest/index.js
@@ -1,19 +1,34 @@
+const password = "password" // removed actual password for lab submission
 const express = require('express');
 const app = express();
+const cors = require('cors');
+const mysql = require('mysql');
 const port = 3000;
-let mysql = require('mysql');
 
-app.get('/', (req, res) => {
-  res.send('Hello World!')
-})
-
-app.listen(port, () => {
-  console.log(`Example app listening at http://localhost:${port}`)
-})
+app.use(cors());
 
 let con = mysql.createConnection({
   host: "localhost",
-  user: "yourusername",
-  password: "yourpassword",
-  database: "mydb"
-});
\ No newline at end of file
+  user: "root",
+  password: password,
+  database: "pokedex"
+});
+
+con.connect(err => {
+  if(err) {
+    throw err;
+  }
+  con.query("SELECT * FROM pokemon", (err, result, fields) => {
+    if (err) {
+      throw err;
+    }
+    console.log(result);
+    app.get('/pokedex', async (req, res) => {
+    res.send(result)
+    })
+  });
+});
+
+app.listen(port, () => {
+  console.log(`Listening on http://localhost:${port}/pokedex`)
+})
\ No newline at end of file
diff --git a/web/index.html b/web/index.html
index 1de928b..b59a5a7 100644
--- a/web/index.html
+++ b/web/index.html
@@ -6,6 +6,12 @@
     <title>Document</title>
 </head>
 <body>
-    <p>Hello Pokemon!</p>
+    <p>Please see the data you requested below...</p>
+    <p id="pokemonId"></p>
+    <p id="name"></p>
+    <p id="color"></p>
+    <p id="weakness"></p>
+
+    <script src="index.js"></script>
 </body>
 </html>
\ No newline at end of file
diff --git a/web/index.js b/web/index.js
new file mode 100644
index 0000000..5c6e7bb
--- /dev/null
+++ b/web/index.js
@@ -0,0 +1,22 @@
+let pokemonId = document.getElementById('pokemonId');
+let pokemonName = document.getElementById('name');
+let color = document.getElementById('color');
+let weakness = document.getElementById('weakness');
+
+//Using fetch with an anonymous self-invoking function
+fetch('http://localhost:3000/pokedex')
+    .then(function(res) {
+        res.json()
+    .then(function(res) {
+        pokemonId.innerHTML = `<strong>ID:</strong> ` + res[0].pokemon_id;
+        pokemonName.innerHTML = `<strong>Name:</strong> ` + res[0].name;
+        color.innerHTML = `<strong>Color:</strong> ` + res[0].color;
+        weakness.innerHTML = `<strong>Weakness:</strong> ` + res[0].weakness;
+        console.log(res);
+    });
+});
+
+//Using fetch an arrow function
+// fetch('http://localhost:3000/pokedex')
+//     .then( res => res.json() )
+//     .then( res => queryResult.innerHTML = res[0].customerName );
\ No newline at end of file

From 2771dc4cdde38477421825acc1a3029af64d00ed Mon Sep 17 00:00:00 2001
From: Robert Woodruff <rwoodruff@Roberts-Air.fios-router.home>
Date: Sun, 28 Feb 2021 23:52:52 -0500
Subject: [PATCH 3/4] removed root index.js

---
 index.js | 23 -----------------------
 1 file changed, 23 deletions(-)
 delete mode 100644 index.js

diff --git a/index.js b/index.js
deleted file mode 100644
index b231854..0000000
--- a/index.js
+++ /dev/null
@@ -1,23 +0,0 @@
-const express = require('express')
-const app = express()
-const port = 3000
-
-app.get('/', (req, res) => {
-  res.send('Hello World!')
-})
-
-app.listen(port, () => {
-  console.log(`Example app listening at http://localhost:${port}`)
-})
-
-function getRandomDoggiePic(){
-  let xhr = new XMLHttpRequest();
-  xhr.onreadystatechange = function(){
-      if(this.readyState === 4 && this.status === 200){
-          document.getElementById("doggie").src = this.responseText;
-      }
-  }
-
-  xhr.open("GET", "http://localhost:4000/dog/random")
-  xhr.send();
-}
\ No newline at end of file

From db265b77031e8feaf3b45be4c0235fc253f1b450 Mon Sep 17 00:00:00 2001
From: Robert Woodruff <rwoodruff@Roberts-Air.fios-router.home>
Date: Mon, 15 Mar 2021 17:45:50 -0400
Subject: [PATCH 4/4] successfully outputting all database records

---
 data/schema.sql | 76 ++++++++++++++++++++++++-------------------------
 rest/index.js   | 22 +++++++-------
 web/index.html  |  7 ++---
 web/index.js    | 28 ++++++------------
 4 files changed, 61 insertions(+), 72 deletions(-)

diff --git a/data/schema.sql b/data/schema.sql
index f607db3..1b27d4c 100644
--- a/data/schema.sql
+++ b/data/schema.sql
@@ -1,38 +1,38 @@
--- Run once to setup MySQL
--- ALTER USER 'root'@'localhost' IDENTIFIED WITH mysql_native_password BY 'password';
--- flush privileges;
-
--- create database pokedex;
-
--- use pokedex;
-
--- CREATE TABLE pokemon (
--- 	pokemon_id INT PRIMARY KEY NOT NULL,
---     name VARCHAR(255) NOT NULL,
---     color VARCHAR(255),
---     -- type VARCHAR(255),
---     -- type2 VARCHAR(255),
---     weakness VARCHAR(255)
---     );
-
--- CREATE TABLE types (
--- 	type_id INT PRIMARY KEY NOT NULL auto_increment,
---     type VARCHAR(255) NOT NULL,
---     FOREIGN KEY (type_id) REFERENCES pokemon_type(type_id)
--- );
-
--- CREATE TABLE pokemon_type (
--- 	pokemon_type_id INT PRIMARY KEY NOT NULL auto_increment,
---     type_id INT NOT NULL,
--- 	pokemon_id INT NOT NULL,
---     FOREIGN KEY (pokemon_id) REFERENCES pokemon(pokemon_id),
---     FOREIGN KEY (type_id) REFERENCES types(type_id)
--- );
-
--- ALTER TABLE pokemon_type ADD FOREIGN KEY(pokemon_id) REFERENCES pokemon(pokemon_id);
--- ALTER TABLE pokemon_type ADD FOREIGN KEY(type_id) REFERENCES types(type_id);
-
--- INSERT INTO pokemon (pokemon_id, name, color, weakness) VALUES (10, 'Caterpie', 'Green', 'Fire');
--- UPDATE pokemon SET weakness = 'Grass' WHERE name = 'Blastoise';
-
--- SELECT * FROM pokemon;
\ No newline at end of file
+Run once to setup MySQL
+ALTER USER 'root'@'localhost' IDENTIFIED WITH mysql_native_password BY 'password';
+flush privileges;
+
+create database pokedex;
+
+use pokedex;
+
+CREATE TABLE pokemon (
+	pokemon_id INT PRIMARY KEY NOT NULL,
+    name VARCHAR(255) NOT NULL,
+    color VARCHAR(255),
+    type VARCHAR(255),
+    type2 VARCHAR(255),
+    weakness VARCHAR(255)
+    );
+
+CREATE TABLE types (
+	type_id INT PRIMARY KEY NOT NULL auto_increment,
+    type VARCHAR(255) NOT NULL,
+    FOREIGN KEY (type_id) REFERENCES pokemon_type(type_id)
+);
+
+CREATE TABLE pokemon_type (
+	pokemon_type_id INT PRIMARY KEY NOT NULL auto_increment,
+    type_id INT NOT NULL,
+	pokemon_id INT NOT NULL,
+    FOREIGN KEY (pokemon_id) REFERENCES pokemon(pokemon_id),
+    FOREIGN KEY (type_id) REFERENCES types(type_id)
+);
+
+ALTER TABLE pokemon_type ADD FOREIGN KEY(pokemon_id) REFERENCES pokemon(pokemon_id);
+ALTER TABLE pokemon_type ADD FOREIGN KEY(type_id) REFERENCES types(type_id);
+
+INSERT INTO pokemon (pokemon_id, name, color, weakness) VALUES (10, 'Caterpie', 'Green', 'Fire');
+UPDATE pokemon SET weakness = 'Grass' WHERE name = 'Blastoise';
+
+SELECT * FROM pokemon;
\ No newline at end of file
diff --git a/rest/index.js b/rest/index.js
index 1fcc1cc..9c7efdb 100644
--- a/rest/index.js
+++ b/rest/index.js
@@ -1,4 +1,4 @@
-const password = "password" // removed actual password for lab submission
+const password = "************" // removed actual password for lab submission
 const express = require('express');
 const app = express();
 const cors = require('cors');
@@ -14,17 +14,19 @@ let con = mysql.createConnection({
   database: "pokedex"
 });
 
-con.connect(err => {
-  if(err) {
-    throw err;
-  }
-  con.query("SELECT * FROM pokemon", (err, result, fields) => {
-    if (err) {
+app.get('/pokedex', async (req, res) => {
+  con.connect(err => {
+    if(err) {
       throw err;
     }
-    console.log(result);
-    app.get('/pokedex', async (req, res) => {
-    res.send(result)
+    con.query("SELECT * FROM pokemon", (err, result, fields) => {
+      if (err) {
+        throw err;
+      }
+      //console.log(result);
+      res.send(result)
+      con.end(); // ends the connection after querry request
+      //return result;
     })
   });
 });
diff --git a/web/index.html b/web/index.html
index b59a5a7..b87a8a7 100644
--- a/web/index.html
+++ b/web/index.html
@@ -3,14 +3,11 @@
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Document</title>
+    <title>Pokemon Rolodex</title>
 </head>
 <body>
     <p>Please see the data you requested below...</p>
-    <p id="pokemonId"></p>
-    <p id="name"></p>
-    <p id="color"></p>
-    <p id="weakness"></p>
+    <div id="pokemons"></div>
 
     <script src="index.js"></script>
 </body>
diff --git a/web/index.js b/web/index.js
index 5c6e7bb..e66f428 100644
--- a/web/index.js
+++ b/web/index.js
@@ -1,22 +1,12 @@
-let pokemonId = document.getElementById('pokemonId');
-let pokemonName = document.getElementById('name');
-let color = document.getElementById('color');
-let weakness = document.getElementById('weakness');
-
-//Using fetch with an anonymous self-invoking function
+//Using fetch with an arrow function
 fetch('http://localhost:3000/pokedex')
-    .then(function(res) {
-        res.json()
-    .then(function(res) {
-        pokemonId.innerHTML = `<strong>ID:</strong> ` + res[0].pokemon_id;
-        pokemonName.innerHTML = `<strong>Name:</strong> ` + res[0].name;
-        color.innerHTML = `<strong>Color:</strong> ` + res[0].color;
-        weakness.innerHTML = `<strong>Weakness:</strong> ` + res[0].weakness;
-        console.log(res);
-    });
-});
+    .then( res => res.json() )
+    .then(pokemons => {                                                         //2nd callback name.column_name
+        document.getElementById("pokemons").innerHTML = pokemons.map(pokemon => `<div>ID: ${pokemon.pokemon_id} | Name: ${pokemon.name} | Color: ${pokemon.color} | Weakness: ${pokemon.weakness}</div>`).join("") });
 
-//Using fetch an arrow function
+//Using fetch with an anonymous self-invoking function
 // fetch('http://localhost:3000/pokedex')
-//     .then( res => res.json() )
-//     .then( res => queryResult.innerHTML = res[0].customerName );
\ No newline at end of file
+//     .then(function(res) {
+//         res.json()
+//     .then(pokemons => {                                                            //2nd callback name.column_name
+//            document.getElementById("pokemons").innerHTML = pokemons.map(pokemon => `<div>ID: ${pokemon.pokemon_id} | Name: ${pokemon.name} | Color: ${pokemon.color} | Weakness: ${pokemon.weakness}</div>`).join("") });
\ No newline at end of file