diff --git a/package-lock.json b/package-lock.json
index 9420912..4254897 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -5,6 +5,7 @@
   "requires": true,
   "packages": {
     "": {
+      "name": "todolist-review-app",
       "version": "1.0.0",
       "license": "ISC",
       "dependencies": {
diff --git a/public/js/main.js b/public/js/main.js
index 93da1fb..0a20224 100644
--- a/public/js/main.js
+++ b/public/js/main.js
@@ -1,27 +1,87 @@
-const deleteBtn = document.querySelectorAll('.del')
-const todoItem = document.querySelectorAll('.todoItem span')
-const todoComplete = document.querySelectorAll('.todoItem span.completed')
+// const deleteBtn = document.querySelectorAll('.del')
+// const todoItem = document.querySelectorAll('.todoItem span')
+// const todoComplete = document.querySelectorAll('.todoItem span.completed')
 
-Array.from(deleteBtn).forEach((el)=>{
-    el.addEventListener('click', deleteTodo)
-})
+// Array.from(deleteBtn).forEach((el)=>{
+//     el.addEventListener('click', deleteTodo)
+// })
 
-Array.from(todoItem).forEach((el)=>{
-    el.addEventListener('click', markComplete)
-})
+// Array.from(todoItem).forEach((el)=>{
+//     el.addEventListener('click', markComplete)
+// })
+
+// Array.from(todoComplete).forEach((el)=>{
+//     el.addEventListener('click', undo)
+// })
+
+// async function deleteTodo(){
+//     const todoText = this.parentNode.childNodes[1].innerText
+//     try{
+//         const response = await fetch('deleteTodo', {
+//             method: 'delete',
+//             headers: {'Content-type': 'application/json'},
+//             body: JSON.stringify({
+//                 'rainbowUnicorn': todoText
+//             })
+//         })
+//         const data = await response.json()
+//         console.log(data)
+//         location.reload()
+//     }catch(err){
+//         console.log(err)
+//     }
+// }
+
+// async function markComplete(){
+//     const todoText = this.parentNode.childNodes[1].innerText
+//     try{
+//         const response = await fetch('markComplete', {
+//             method: 'put',
+//             headers: {'Content-type': 'application/json'},
+//             body: JSON.stringify({
+//                 'rainbowUnicorn': todoText
+//             })
+//         })
+//         const data = await response.json()
+//         console.log(data)
+//         location.reload()
+//     }catch(err){
+//         console.log(err)
+//     }
+// }
+
+// async function undo(){
+//     const todoText = this.parentNode.childNodes[1].innerText
+//     try{
+//         const response = await fetch('undo', {
+//             method: 'put',
+//             headers: {'Content-type': 'application/json'},
+//             body: JSON.stringify({
+//                 'rainbowUnicorn': todoText
+//             })
+//         })
+//         const data = await response.json()
+//         console.log(data)
+//         location.reload()
+//     }catch(err){
+//         console.log(err)
+//     }
+// }
+
+const delBtn = document.querySelectorAll('.del')
 
-Array.from(todoComplete).forEach((el)=>{
-    el.addEventListener('click', undo)
+Array.from(delBtn).forEach(item => {
+    item.addEventListener('click', deleteTodo)
 })
 
 async function deleteTodo(){
-    const todoText = this.parentNode.childNodes[1].innerText
-    try{
-        const response = await fetch('deleteTodo', {
+    const todoText = await this.parentNode.childNodes[1].innerText
+    try {
+        const response = await fetch('deleteTodo' , {
             method: 'delete',
             headers: {'Content-type': 'application/json'},
             body: JSON.stringify({
-                'rainbowUnicorn': todoText
+                'delItem': todoText
             })
         })
         const data = await response.json()
@@ -32,14 +92,20 @@ async function deleteTodo(){
     }
 }
 
+const compBtn = document.querySelectorAll('.item')
+
+Array.from(compBtn).forEach(item => {
+    item.addEventListener('click', markComplete)
+})
+
 async function markComplete(){
-    const todoText = this.parentNode.childNodes[1].innerText
+    const todoText = await this.innerText
     try{
         const response = await fetch('markComplete', {
             method: 'put',
             headers: {'Content-type': 'application/json'},
             body: JSON.stringify({
-                'rainbowUnicorn': todoText
+                'updateItem': todoText
             })
         })
         const data = await response.json()
@@ -50,14 +116,21 @@ async function markComplete(){
     }
 }
 
-async function undo(){
-    const todoText = this.parentNode.childNodes[1].innerText
+const undoBtn = document.querySelectorAll('.completed')
+
+Array.from(undoBtn).forEach(item => {
+    item.addEventListener('click', undoItem)
+})
+console.log(undoBtn)
+
+async function undoItem() {
+    const undoText = await this.innerText
     try{
-        const response = await fetch('undo', {
+        const response = await fetch('markIncomplete' , {
             method: 'put',
             headers: {'Content-type': 'application/json'},
             body: JSON.stringify({
-                'rainbowUnicorn': todoText
+                'updateItem': undoText
             })
         })
         const data = await response.json()
diff --git a/server.js b/server.js
index 4e3b59f..f001b81 100644
--- a/server.js
+++ b/server.js
@@ -1,74 +1,152 @@
+// const express = require('express')
+// const app = express()
+// const MongoClient = require('mongodb').MongoClient
+// const PORT = 2121
+// require('dotenv').config()
+
+// let db,
+//     dbConnectionStr = process.env.DB_STRING,
+//     dbName = 'todo'
+
+// MongoClient.connect(dbConnectionStr, {useUnifiedTopology: true})
+//     .then(client => {
+//         console.log(`Hey, connected to ${dbName} database`)
+//         db = client.db(dbName)
+//     })
+//     .catch(err =>{
+//         console.log(err)
+//     })
+
+// app.set('view engine', 'ejs')
+// app.use(express.static('public'))
+// app.use(express.urlencoded({ extended: true }))
+// app.use(express.json())
+
+// app.get('/', async (req,res)=>{
+//     const todoItems = await db.collection('todos').find().toArray()
+//     const itemsLeft = await db.collection('todos').countDocuments({completed: false})
+//     res.render('index.ejs', {zebra: todoItems, left: itemsLeft})
+// })
+
+// app.post('/createTodo', (req, res)=>{
+//     db.collection('todos').insertOne({todo: req.body.todoItem, completed: false})
+//     .then(result =>{
+//         console.log('Todo has been added!')
+//         res.redirect('/')
+//     })
+// })
+
+// app.put('/markComplete', (req, res)=>{
+//     db.collection('todos').updateOne({todo: req.body.rainbowUnicorn},{
+//         $set: {
+//             completed: true
+//         }
+//     })
+//     .then(result =>{
+//         console.log('Marked Complete')
+//         res.json('Marked Complete')
+//     })
+// })
+
+// app.put('/undo', (req, res)=>{
+//     db.collection('todos').updateOne({todo: req.body.rainbowUnicorn},{
+//         $set: {
+//             completed: false
+//         }
+//     })
+//     .then(result =>{
+//         console.log('Marked Complete')
+//         res.json('Marked Complete')
+//     })
+// })
+
+// app.delete('/deleteTodo', (req, res)=>{
+//     db.collection('todos').deleteOne({todo:req.body.rainbowUnicorn})
+//     .then(result =>{
+//         console.log('Deleted Todo')
+//         res.json('Deleted It')
+//     })
+//     .catch( err => console.log(err))
+// })
+ 
+// app.listen(process.env.PORT || PORT, ()=>{
+//     console.log('Server is running, you better catch it!')
+// })    
+
 const express = require('express')
 const app = express()
 const MongoClient = require('mongodb').MongoClient
-const PORT = 2121
+const PORT = process.env.PORT || 6969
 require('dotenv').config()
 
 let db,
-    dbConnectionStr = process.env.DB_STRING,
+    dbConnectionStr = process.env.DB_STRING
     dbName = 'todo'
 
 MongoClient.connect(dbConnectionStr, {useUnifiedTopology: true})
     .then(client => {
-        console.log(`Hey, connected to ${dbName} database`)
+        console.log(`Connected to ${dbName} database`)
         db = client.db(dbName)
     })
-    .catch(err =>{
-        console.log(err)
-    })
+    .catch(err => console.log(err))
 
 app.set('view engine', 'ejs')
 app.use(express.static('public'))
 app.use(express.urlencoded({ extended: true }))
 app.use(express.json())
 
-app.get('/', async (req,res)=>{
-    const todoItems = await db.collection('todos').find().toArray()
-    const itemsLeft = await db.collection('todos').countDocuments({completed: false})
-    res.render('index.ejs', {zebra: todoItems, left: itemsLeft})
+app.get('/', (req, res) => {
+    db.collection('todos').find().toArray()
+        .then(data => {
+            res.render('index.ejs' , {dbarr : data})
+        })
+        .catch(err => console.log(err))
 })
 
-app.post('/createTodo', (req, res)=>{
-    db.collection('todos').insertOne({todo: req.body.todoItem, completed: false})
-    .then(result =>{
-        console.log('Todo has been added!')
-        res.redirect('/')
-    })
+app.post('/createTodo' , (req, res) => {
+    db.collection('todos').insertOne({todo : req.body.todoItem, completed : false})
+        .then(result => {
+            console.log('Item added')
+            res.redirect('/')
+        })
+        .catch(err => console.log(err))
 })
 
-app.put('/markComplete', (req, res)=>{
-    db.collection('todos').updateOne({todo: req.body.rainbowUnicorn},{
+app.put('/markComplete', (req, res) => [
+    db.collection('todos').updateOne({todo : req.body.updateItem} , {
         $set: {
             completed: true
         }
     })
-    .then(result =>{
-        console.log('Marked Complete')
-        res.json('Marked Complete')
-    })
-})
+        .then(result => {
+            console.log('Marked Complete')
+            res.json('Marked Complete')
+        })
+        .catch(err => console.log(err))
+])
 
-app.put('/undo', (req, res)=>{
-    db.collection('todos').updateOne({todo: req.body.rainbowUnicorn},{
+app.put('/markIncomplete', (req,res) => {
+    db.collection('todos').updateOne({todo: req.body.updateItem} , {
         $set: {
             completed: false
         }
     })
-    .then(result =>{
-        console.log('Marked Complete')
-        res.json('Marked Complete')
-    })
+        .then(result => {
+            console.log('Marked Incomplete')
+            res.json('Undo Complete')
+        })
+        .catch(err => console.log(err))
 })
 
-app.delete('/deleteTodo', (req, res)=>{
-    db.collection('todos').deleteOne({todo:req.body.rainbowUnicorn})
-    .then(result =>{
-        console.log('Deleted Todo')
-        res.json('Deleted It')
-    })
-    .catch( err => console.log(err))
+app.delete('/deleteTodo' , (req, res) => {
+    db.collection('todos').deleteOne({todo : req.body.delItem})
+        .then(result => {
+            console.log('Item deleted')
+            res.json('Item deleted')
+        })
+        .catch(err => console.log(err))
 })
- 
-app.listen(process.env.PORT || PORT, ()=>{
-    console.log('Server is running, you better catch it!')
-})    
\ No newline at end of file
+
+app.listen(PORT, () => {
+    console.log(`Connected to PORT ${PORT}`)
+})
\ No newline at end of file
diff --git a/views/index.ejs b/views/index.ejs
index f181aaf..de43ed3 100644
--- a/views/index.ejs
+++ b/views/index.ejs
@@ -4,31 +4,29 @@
     <meta charset="UTF-8">
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Document</title>
+    <title>TODO LIST APP</title>
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css" integrity="sha512-iBBXm8fW90+nuLcSKlbmrPcLa0OT92xO1BIsZ+ywDWZCvqsWgccV3gFoRBv0z+8dLJgyAHIhR35VZc2oM/gI1w==" crossorigin="anonymous" />
     <link rel="stylesheet" href="css/style.css">
 </head>
 <body>
-    <h1>Todos</h1>
-    <ul>
-    <% for(let i = 0; i < zebra.length; i++) { %>
-        <li class='todoItem'>
-            <% if(zebra[i].completed === true) {%>
-            <span class="completed"><%= zebra[i].todo %></span>
-            <% }else{ %>
-            <span><%= zebra[i].todo %></span>
-            <% } %>   
-            <span class='del'> Delete </span>
-        </li>
-    <% } %>    
+    <h1>Todos List</h1>
+    <ul class='todoItem'>
+        <% for(let i = 0; i<dbarr.length; i++) { %>
+            <li>
+                <% if(dbarr[i].completed){ %>
+                    <span class="completed"><%= dbarr[i].todo %></span>
+                <% }else{ %>
+                    <span class="item"><%= dbarr[i].todo %></span>
+                <% } %>
+                <span class='del'><i class="fas fa-trash"></i></span>
+            </li>
+        <% } %>
     </ul>
 
-    <h2>Things left to do: <%= left %></h2>
-
-    <form action="/createTodo" method='POST'>
-        <input type="text" placeholder="Enter Todo Item" name='todoItem'>
-        <input type="submit">
+    <form action="/createTodo" method="post">
+        <input type="text" placeholder="Todo Task" name="todoItem">
+        <button>Send</button>
     </form>
-
-    <script src="js/main.js"></script>
+    <script src='js/main.js'></script>
 </body>
 </html>
\ No newline at end of file