I am trying to break free from tutorial hell and create something to make my life easier (the irony), it's an hours calculator.
I won't go too much into the functionality but basically it's just an app that stores all my months hours to which I can calculate at the end of the month by clicking a button.
However I am stuck, I am fairly new to this (backend especially) and I can't find a way to access the DOM and from my understanding that's normal given it's serverside code.
However I just need to know how you grab DOM elements and assign them to variables if this functionality doesn't exist backend? Is there an alternative to...
document.querySelector('...')
?
I did install JSDOM however from my understanding you can only pass in sections of code as opposed to accessing the full page? I may be completely wrong...
Can someone please help me get a clearer understanding of what I need to understand/do?
Here is my app.js code, go easy :)
const express = require('express'),
app = express(),
bodyParser = require('body-parser'),
mongoose = require('mongoose'),
jsdom = require("jsdom"),
{ JSDOM } = jsdom,
dom = new JSDOM('localhost:3000/');
// ----------------------------------------//
const date = new Date(),
day = date.getDate(),
month = date.toLocaleString('default', { month: 'long' }),
table = dom.window.document.querySelector('table'),
totalShiftHours = dom.window.document.querySelectorAll('.totalShiftHours');
app.use(bodyParser.urlencoded({ extended: true }));
app.use(express.static('public'));
app.set('view engine', 'ejs');
app.listen(3000, () => console.log("I'm listening"));
mongoose.connect('mongodb://localhost:27017/hours_calculator', { useNewUrlParser: true, useUnifiedTopology: true });
const shiftSchema = new mongoose.Schema({
date: Number,
startTime: Number,
finishTime: Number,
lunchTime: Number,
});
const Shift = mongoose.model('Shift', shiftSchema);
app.get('/', (req, res) => {
Shift.find({}, (err, allShifts) => {
if (err) console.log(`There's an error: ${err}`)
else res.render('index', {
shifts: allShifts,
day: day,
month: month,
table: table,
totalShiftHours: totalShiftHours
})
})
});
app.post('/', (req, res) => {
const startTime = Number(req.body.startTime),
finishTime = Number(req.body.endTime),
lunchTime = Number(req.body.lunchTime),
newShift = {
date: day,
startTime: startTime,
finishTime: finishTime,
lunchTime: lunchTime
};
Shift.create(newShift, (err, newShift) => {
if (err) console.log(`Somethings wrong, ${err}`);
else res.redirect('/')
})
});