Introduction:
I have used ExpressJs framework with node as server and pug as a template engine. I want to bundle .js , .pug & .css.
I'm aware of webpack (module bundler) configuration for static files (CSR-client side rendering) . For CSR appoach we will follow the steps below.
- Bundle all files using webpack
- Host html & bundle.js(created by webpack earlier) using server (iis / npm serve or of any other choice).
So, I tried the same with ExpressJs which is(SSR-server side rendering), webpack bundled all files (excluding NodeModules) including index.js which contains server(nodeJs).
- Is it the right ? If so how to serve the files using the bundled host inside index.js?
- If that is totally a wrong then, can you please suggest some good practice?
index.js
var express = require('express');
var cookieParser = require('cookie-parser');//cookie Parser
var bodyParser = require('body-parser');//JSON data
//Inbuild Functions
const userManagementRoutes = require('./src/routes/userManagementRoutes');
const app = express();
//view Engine
app.set('view engine', 'pug');
app.set('views', './src/views/userManagement');
//for cookie parser
app.use(cookieParser());
// for parsing application/xwww-form-urlencoded
app.use(bodyParser.urlencoded({ extended: true }));
//Static File Server
app.use('/Malips', express.static('public'));
//Routes
app.use('/', userManagementRoutes)
//server
app.listen(3000);
src
outesUserManagementRoutes.js
const express = require('express');
const loginController = require('../controllers/userManagement/loginController');
const router = express.Router();
router.get('/', function(req, res){
res.render('app.pug');
});
router.get('/Login', function(req, res){
res.render('login.pug');
});
router.post('/Login', function(req, res){
const { userName, password } = req.body;
if(loginController(userName, password)){
res.render('home.pug',{userName : userName});
}
else{
res.render('login.pug',{errorMessage : 'Invalid Credentials'});
}
});
module.exports = router;
srccontrolleruserManagementLoginController
module.exports = function LoginController(userName, password)
{
if(userName == '[email protected]' && password == 'admin')
return true;
else
return false;
}
srcviewsuserManagementLogin.pug
extends _layout.pug
block content
div
form(action="/Login", method="post")
label UserName
br
input(type='email', name = 'userName' required autofocus)
br
label Password
br
input(type='text' name = 'password' required autofocus)
br
input(type="submit")
h3 #{errorMessage}
package.json
"scripts": {
"start": "nodemon index.js",
"test": "echo "Error: no test specified" && exit 1"
},