tmarrinan · jonnydems · Nov 13, 2023 · Nov 13, 2023 · Nov 13, 2023 · Nov 14, 2023
diff --git a/.vscode/launch.json b/.vscode/launch.json
@@ -0,0 +1,15 @@
+{
+    // Use IntelliSense to learn about possible attributes.
+    // Hover to view descriptions of existing attributes.
+    // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
+    "version": "0.2.0",
+    "configurations": [
+        {
+            "type": "chrome",
+            "request": "launch",
+            "name": "Launch Chrome against localhost",
+            "url": "http://localhost:8080",
+            "webRoot": "${workspaceFolder}"
+        }
+    ]
+}
diff --git a/README.md b/README.md
@@ -0,0 +1,15 @@
+# Webdev-rest
+REST API Starter Code for Web Development Course
+
+Instructions:
+1. clone this repository on your machine
+2. cd into webdev-rest
+3. run "npm install" which will install all of the dependencies
+4. on one terminal, run "node rest_server.mjs" which will start your local host which holds the api with all of the crime information
+5. open another terminal and run "npm run dev" which will start the server on a local host.
+6. Go to this local host and when prompted, open the local host that you are running the database on (from step 4)
+Enjoy searching our website to learn about crimes in St. Paul!
+
+
+# About the project
+This project really focuses on identifying the areas of St. Paul that are the most dangerous or have a particular kind of crime. The viewer can view a map with all of the St. Paul Neighborhoods are marked and see the number of crimes for each neighborhood. The user can zoom in and out to help see where there are certain crimes commited and also select them from a table to be able to pinpoint where they are on the map. My hope is that this website will bring awareness of these dangerous areas and cause viewers to stop and think before they go to a certain area, or just to be more aware when they are in those areas. The ability to check certain boxes with certain types of incidents will help users visualize where there are more particular crimes in a certain area, and thus learn to either be more aware of those crimes in that area, or to avoid that area for those reasons. A human person’s dignity is one of the most important things about them, and these crimes take away from that dignity, whether that be through murder, or doing drugs. This website aims at increasing knowledge of crimes to show viewers just how often a human’s dignity is being taken away, and hopefully prompt them to be more aware of it and maybe even take action to try to prevent crime on our own streets! St. Thomas values the Dignity of human person's, and having the opportunity to learn more about crime in St. Paul has helped me see how my computer science skills could help increase awareness of the problems in our area. 
diff --git a/index.html b/index.html
@@ -0,0 +1,40 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <title>St. Paul Crime Map</title>
+    <!-- Foundation CSS -->
+    <link rel="stylesheet" href="css/foundation.css">
+    <!-- Leaflet -->
+    <link rel="stylesheet" href="https://unpkg.com/leaflet@1.9.4/dist/leaflet.css"
+          integrity="sha256-p4NxAoJBhIIN+hmNHrzRCf9tD/miZyoHS5obTRR9BMY="
+          crossorigin=""/>
+    <script src="https://unpkg.com/leaflet@1.9.4/dist/leaflet.js"
+            integrity="sha256-20nQCchB9co0qIjJZRGuk2/Z9VM+kNiyxNV1lvTlZBo="
+            crossorigin=""></script>
+    <!-- Custom Style -->
+    <link rel="stylesheet" href="css/style.css"/>
+    <!-- Vue App -->
+    <script type="module" src="src/main.js"></script>
+</head>
+<body>
+    <!-- Main app (map, crime table, and filters) -->
+    <div id="app"></div>
+
+    <div id="table"></div>
+
+    <!-- Foundation CSS Framework: include before closing <body> tag -->
+
+    <script src="js/vendor/jquery.js"></script>
+    <script src="js/vendor/what-input.js"></script>
+    <script src="js/vendor/foundation.js"></script>
+    <script type="application/javascript">
+        $(document).ready(function () {
+     $(document).foundation();
+   });
+
+        $(document).foundation();
+    </script>
+</body>
+</html>