├── README.md ├── public ├── images │ └── dustbin.png └── css │ └── styles.css ├── views ├── footer.ejs ├── header.ejs ├── aboutMe.ejs └── list.ejs ├── package.json ├── date.js └── app.js /README.md: -------------------------------------------------------------------------------- 1 | # TodoV1 -------------------------------------------------------------------------------- /public/images/dustbin.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/NimeshJohari02/TodoV1/HEAD/public/images/dustbin.png -------------------------------------------------------------------------------- /views/footer.ejs: -------------------------------------------------------------------------------- 1 | 2 | 3 | 6 | 7 | -------------------------------------------------------------------------------- /views/header.ejs: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | To Do List 7 | 8 | 9 | 10 | -------------------------------------------------------------------------------- /views/aboutMe.ejs: -------------------------------------------------------------------------------- 1 | <%-include("header")-%> 2 |

Hello Nimesh Here

3 |

Since you were unlucky enough to click this link now.You have to read the never ending diary of a person 4 | who was just a nobody and probably still is a nodbody .. He is just your Fellow Mr Anonymous

5 | <%-include("footer")-%> 6 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "todov1", 3 | "version": "1.0.0", 4 | "description": "", 5 | "main": "app.js", 6 | "scripts": { 7 | "test": "echo \"Error: no test specified\" && exit 1" 8 | }, 9 | "author": "N", 10 | "license": "ISC", 11 | "dependencies": { 12 | "body-parser": "^1.19.0", 13 | "ejs": "^3.1.2", 14 | "express": "^4.17.1", 15 | "nodemon": "^2.0.3" 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /views/list.ejs: -------------------------------------------------------------------------------- 1 | 2 | <%- include("header") -%> 3 |

4 |

<%= listTitle %>!

5 |

6 | 7 |

8 | 9 | <% for(var i =0;i 10 |

11 | 12 |

<%= newListItems[i]%>

13 |

14 | 15 | <%}%> 16 | 17 | 21 | 22 |

23 | <%- include("footer") -%> 24 | -------------------------------------------------------------------------------- /date.js: -------------------------------------------------------------------------------- 1 | //it is tradiionalyy module.export- fnaem 2 | //fname(){} 3 | /* It can be reduced to a generic function like so 4 | Also By readimg Node Documentation we can see that modeule.eeports can be replaced by just .export*/ 5 | //module.exports.getDate=function() 6 | 7 | 8 | exports.getDate=function() 9 | { 10 | const today = new Date(); 11 | const currday = today.getDay(); 12 | 13 | const options = { 14 | weekday: "long", 15 | day: "numeric", 16 | month: "long" 17 | } 18 | const day = today.toLocaleDateString("en-US", options); 19 | return day; 20 | 21 | } 22 | 23 | exports.getDay=function(){ 24 | var today = new Date(); 25 | var currday = today.getDay(); 26 | 27 | var options = { 28 | day: "numeric", 29 | } 30 | let day = today.toLocaleDateString("en-US", options); 31 | return day; 32 | 33 | } 34 | -------------------------------------------------------------------------------- /app.js: -------------------------------------------------------------------------------- 1 | const express = require('express'); 2 | const app = express(); 3 | const bodyParser = require("body-parser"); 4 | app.set("view engine", "ejs"); 5 | app.use(bodyParser.urlencoded({ 6 | extended: true 7 | })); 8 | const date=require(__dirname+"/date.js"); 9 | 10 | app.use(express.static("public")); 11 | 12 | let items = []; 13 | let worklist = []; 14 | 15 | 16 | 17 | app.get("/", function(req, res) { 18 | //res.sendFile(__dirname+"/index.html") 19 | let day=date.getDate(); 20 | res.render("list", { 21 | listTitle: day, 22 | newListItems: items 23 | }); 24 | 25 | }); 26 | 27 | 28 | 29 | app.post("/", function(req, res) { 30 | var item = req.body.newItem; 31 | if(req.body.list=="Work List") 32 | { 33 | 34 | worklist.push(item); 35 | res.redirect("/Work") 36 | // res.redirect("/Work"); 37 | } 38 | else 39 | { 40 | items.push(item); 41 | res.redirect("/"); 42 | 43 | } 44 | //console.log(items) 45 | 46 | }); 47 | app.get("/Work", function(req, res) { 48 | 49 | res.render("list", { 50 | listTitle: "Work List", 51 | newListItems: worklist 52 | }) 53 | }); 54 | // app.post("/Work", function(req, res) { 55 | // let workitem=req.body.newItem; 56 | // worklist.push(workitem); 57 | // res.redirect("/Work"); 58 | // 59 | // 60 | // }) 61 | 62 | app.get("/about-me",function(req,res){ 63 | res.render("aboutMe"); 64 | 65 | }) 66 | app.listen(3000, function() { 67 | console.log("Server Up at 3000"); 68 | }); 69 | -------------------------------------------------------------------------------- /public/css/styles.css: -------------------------------------------------------------------------------- 1 | html { 2 | background-color: #E4E9FD; 3 | background-image: -webkit-linear-gradient(65deg, #A683E3 50%, #E4E9FD 50%); 4 | min-height: 1000px; 5 | font-family: 'helvetica neue'; 6 | } 7 | 8 | h1 { 9 | color: #fff; 10 | padding: 10px; 11 | } 12 | 13 | .box { 14 | max-width: 400px; 15 | margin: 50px auto; 16 | background: white; 17 | border-radius: 5px; 18 | box-shadow: 5px 5px 15px -5px rgba(0, 0, 0, 0.3); 19 | } 20 | 21 | #heading { 22 | background-color: #A683E3; 23 | text-align: center; 24 | } 25 | 26 | .item { 27 | min-height: 70px; 28 | display: flex; 29 | align-items: center; 30 | border-bottom: 1px solid #F1F1F1; 31 | } 32 | 33 | .item:last-child { 34 | border-bottom: 0; 35 | } 36 | 37 | input:checked+p { 38 | text-decoration: line-through; 39 | text-decoration-color: #A683E3; 40 | } 41 | 42 | input[type="checkbox"] { 43 | margin: 20px; 44 | } 45 | 46 | p { 47 | margin: 0; 48 | padding: 20px; 49 | font-size: 20px; 50 | font-weight: 200; 51 | color: #00204a; 52 | } 53 | 54 | form { 55 | text-align: center; 56 | margin-left: 20px; 57 | } 58 | 59 | button { 60 | min-height: 50px; 61 | width: 50px; 62 | border-radius: 50%; 63 | border-color: transparent; 64 | background-color: #A683E3; 65 | color: #fff; 66 | font-size: 30px; 67 | padding-bottom: 6px; 68 | border-width: 0; 69 | } 70 | 71 | input[type="text"] { 72 | text-align: center; 73 | height: 60px; 74 | top: 10px; 75 | border: none; 76 | background: transparent; 77 | font-size: 20px; 78 | font-weight: 200; 79 | width: 313px; 80 | } 81 | 82 | input[type="text"]:focus { 83 | outline: none; 84 | box-shadow: inset 0 -3px 0 0 #A683E3; 85 | } 86 | 87 | ::placeholder { 88 | color: grey; 89 | opacity: 1; 90 | } 91 | 92 | footer { 93 | color: white; 94 | color: rgba(0, 0, 0, 0.5); 95 | text-align: center; 96 | } 97 | --------------------------------------------------------------------------------