var express = require('express'),
routes = require('./routes'),
http = require('http'),
path = require('path'),
fs = require('fs');
var app = express();
app.set('port', process.env.PORT || 3000);
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'jade');
app.use(express.json());
app.use(app.router);
app.use(express.static(path.join(__dirname, 'public')));
app.get('/', routes.index);
http.createServer(app).listen(app.get('port'), function(){
console.log('Express server listening on port ' + app.get('port'));
});
I'm getting the error Most middleware (like json) is no longer bundled with....
I've npm installed connect in the same folder.
But how do i use it?
I couldn't find any combined tutorial on connect & express, they either talk about connect or express.
Quoting from the Express.js's middleware documentation,
As of 4.x, Express no longer depends on Connect. All of Express' previously included middleware are now in separate repos. Please view the list of middleware. The only included middleware is now express.static().
So, to use json middleware, you need to include the body-parser in the package.json and then use like this
var bodyParser = require('body-parser');
app.use(bodyParser.json());
Related
We built a web app using node, express and ejs. We want to deploy to CPanel. We copied the folders and the pages are not rendering. Do we need to change the routes to reflect the new folder structures and/or install node and all dependencies in the CPanel server? I did move things around and play with the routes a bit without much success. On my localhost I can see it perfectly, but once up it does not work.
So far my index.ejs is this:
<head>
<meta charset="UTF-8">
<title>Test de Zülliger</title>
<link rel="stylesheet" href="styles/style.css">
<link rel="shortcut icon" href="images/favicon.png">
</head>
the app.js is this:
const express = require('express');
const path = require('path');
const methodOverride = require('method-override');
const app = express();
const ejsMate = require('ejs-mate');
app.engine('ejs', ejsMate);
app.set('view engine', 'ejs');
app.set('views', path.join(__dirname, 'views'));
app.use(express.urlencoded({ extended: true }))
app.use(methodOverride('_method'));
app.use(express.static(path.join(__dirname, 'public')))
app.get('/', (req, res) => {
res.render('index')
});
app.get('/localizaciones', (req, res) => {
res.render('localizaciones/map')
});
app.get('/drawingpad', (req, res) => {
res.render('drawingpad/drawing-pad')
});
app.get('/finalizar', (req, res) => {
res.render('finalizar/finalizar')
});
const port = process.env.PORT || 3000;
app.listen(port, () => {
console.log(`Serving on port ${port}`)
});
my folder structure:
I did put index.ejs inside views and didn't make any difference, the CSS does not render and when on browser manually writing map.ejs it appears all the code, no render at all.
Deploying statically by just copying the files will only work for a static app, e.g. the build folder of a React application.
Node.js has to be installed and the server started in order for your application to work. This tutorial should help you when doing this in cpanel.
I am not sure how CPanel works, but for my knowledge (i do use MERN stack) you need all the code in one file. Therefore you need yarn run build or npm run build, which will make a build folder. Afterwards you upload just that folder and specify it in your hoster
I am totally new to Expressjs (Nodejs) and I am using "Express application generator" here is a link. I am building simple website and using (Embedded JavaScript templating / EJS) and I want to add webpack to my app.
Here is my project structure.
Here is my app.js
var express = require('express');
var path = require('path');
var logger = require('morgan');
var index = require('./routes/index');
var app = express();
// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'ejs');
// set path for static assets
app.use(express.static(path.join(__dirname, 'public')));
// routes
app.use('/', index);
// catch 404 and forward to error handler
app.use(function(req, res, next) {
var err = new Error('404 page.');
err.status = 404;
next(err);
});
// error handler
app.use(function(err, req, res, next) {
// render the error page
res.status(err.status || 500);
res.render('error', {status:err.status, message:err.message});
});
module.exports = app;
Does anyone have an idea how to do it, some example or anything that would help me?
Thanks everyone
Webpack is for single page application. There is only one index.html as the
hook, all the front-end contents will be generated by js files and bundled together by webpack then attached to the html hook.
If you use ejs or other template engine, you don't need webpack bundling your scripts, since you can split and load the scripts in your ejs files.
And your app.js and other Express things are backend things which run on your server, they don't need to be bundled or manipulated at all, you can do whatever you want, since those are on your server not users' browsers.
so just start to code your application.
const functions = require('firebase-functions');
const admin = require('firebase-admin');
const express = require('express');
const engines = require('consolidate');
const app = express();
const firebaseApp = admin.initializeApp(
functions.config().admin
);
app.engine('hbs', engines.handlebars); =>> this handlebars can't be loaded
app.set('views', './views');
app.set('view engine', 'hbs');
app.get('/time', (req, res)=>{
res.set('Cache-Control', 'public, max-age=300, s-maxage=600');
res.render('index')
});
exports.app = functions.https.onRequest(app);
related to this project
index.js
i am using expressjs in firebase hosting, firebase cli, i need view engine to get view tamplate hbs but i can't get the file
From consolidate's readme:
NOTE: you must still install the engines you wish to use, add them to
your package.json dependencies.
Install handlebars by running, npm install --save handlebars.
I try to connect backend (NodeJS, Express) with Frontend (Angular 2), but have a problem.
When I start two servers separately, both client-side and server-side work fine.
In my situation:
localhost:4200 - Angular
localhost:3000 - NodeJS, Express
When I render any static html file in my VIEWS folder, it works correctly, but when I change the content of the html file to Angular Index.html, that uses components, it doesn’t work. I mean, it works, but doesn't load my components.
I suppose that problem is in the configuration, and my index.html doesn't know how to find and load components, but I don’t understand exactly where a mistake might be.
When I try to start both servers at the same port, my frontend part stops working.
I use Angular-CLI, NodeJS, Express and EJS.
My server.js code is:
var express = require('express');
var path = require('path');
var bodyParser = require('body-parser');
var index = require('./routes/index');
var tasks = require('./routes/tasks');
var port = 3000;
var app = express();
app.set('views', path.join(__dirname, 'views'));
app.set('view enjine', 'ejs');
app.engine('html', require('ejs').renderFile);
app.use(express.static(path.join(__dirname, 'views')));
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false}));
app.use('/', index);
app.use('/api', tasks);
app.listen(port, function () {
console.log('Server started on port ' + port);
});
In the ROUTES folder my index.js code is:
var express = require('express');
var router = express.Router();
router.get('/', function(req, res, next) {
res.render('index.html');
});
module.exports = router;
My folders structure:
Picture of foldes
node_modules
routes
ruen-app
views
package.json
server.js
ruen-app is my client (Angular 2) folder.
So, my questions are:
How to connect these two parts?
Is it correct to start two servers at the same time - one for the frontend, another for the backend?
What is the best practice for MEAN applications to start from the scratch? I mean, what is the best way - two servers or one?
Spent 3 days, but found the solution.
On the stackoverflow:
Different ports for frontend and backend. How to make a request?
Angular-CLI proxy to backend doesn't work
I'm trying to access a static 'home.html' file from the public folder. The architecture of the app is:
public
home.html
routes
index.js
views
myapp.js
myapp.js:
var express = require('express');
var path = require('path');
var routes = require('./routes/index');
var app = express();
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'jade');
app.use(express.static(path.join(__dirname, 'public')));
app.use('/', routes);
index.js:
var express = require('express');
var router = express.Router();
router.get('/', function(req, res, next) {
res.render('index', { title: 'Express' });
});
router.get('/about', function(req, res, next){
res.sendFile(__dirname + '/home.html');
});
module.exports = router;
The main problem I'm having is I'm unable to load the home.html file at '/about'. The "__dirname" in index.js is pointing to the routes folder, and I've tried concatenating '/../' to move up a directory, but I just get a 403 Forbidden Error. I suppose I could put the home.html file in the routes directory, but I really want to figure out how to solve the underlying problem. Of course, rendering the jade file from the views folder at '/' works perfectly fine. Thank you in advance for your help and expertise.
You are trying to use it in the wrong way. The reason that you get the forbidden error is that the clients shouldn't be able to access folders outside the static folder that you have selected.
What you can do is to select multiple static directories, like Setting up two different static directories in node.js Express framework
Though I recommend that you just place all your publically available files in the same directory.