Node.js
## ToDoList App Interface
## Backend
**Start project**
```javascript
mkdir myProject
cd myProject
npm init
npm install express body-parser ejs
code .
```
**app.js**
```js
const express = require("express");
const bodyParser = require("body-parser");
const myDate = require(__dirname + '/date.js')
console.log(myDate)
const app = express();
app.set('view engine', 'ejs');
app.use(bodyParser.urlencoded({extended: true}));
app.use(express.static("public"));
const items = [];
app.get("/", function (req, res) {
let typeofDay = myDate.getDate();
console.log(myDate.test());
res.render('list', { typeofDay: typeofDay, newItems: items });
});
app.post("/", function(req, res){
let item = req.body.newItem;
items.push(item);
res.redirect("/")
});
app.listen(3000, function () {
console.log("Server started on port 3000");
});
```
**date.js**
```js
module.exports.getDate = getDate;
module.exports.test = test;
function getDate() {
let today = new Date();
let options = {
weekday: "long",
day: "numeric",
month: "long"
};
let day = today.toLocaleDateString("en-US", options);
return day;
};
function test(){
return "test";
};
```
```js
exports.getDate = function () {
const today = new Date();
const options = {
weekday: "long",
day: "numeric",
month: "long"
};
return today.toLocaleDateString("en-US", options);
};
exports.test = function (){
return "test";
};
```
## frontend
**views/header.ejs**
```html
<!DOCTYPE html>
<html lang="en">
<head>
<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>TODO LIST</title>
<link rel="stylesheet" href="css/style.css">
</head>
```
**views/list.ejs**
```html
<%- include('header') -%>
<body>
<h1>
<%= typeofDay %>
</h1>
<ul>
<li>Buy Food</li>
<li>Shopping</li>
<li>Hang out</li>
<% for (let i=0; i<newItems.length; i++){ %>
<li> <%=newItems[i] %></li>
<% } %>
</ul>
<form action="/" method="post">
<input type="text" name="newItem" id="">
<button type="submit" name="button">Add</button>
</form>
</body>
<%- include('footer') -%>
```
**views/footer.ejs**
```html
<div>
I am the footer
</div>
</html>
```
`Start server`
```js
nodemon app.js
```
**Error: listen EADDRINUSE: address already in use :::3000**
```cml
sudo lsof -i :<Port>
kill -9 <PID>
```
**Import Loadash**
```
npm install lodash
```
```
const _ = require("lodash");
```