Can get ejs file to render, im using node - javascript

I would like to get my ejs file to display on the server ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
<html>
<head><title><%= title %></title></head>
<body>
welcome <%= user%>;
</body>
</html>
//////////////////////////////////////////////////////////////////////////////////////
var express = require("express");
var app = express();
var port = process.env.PORT || 3000;
app.set('view engine', 'ejs');
app.get("/", function(req, res){
res.sendFile(__dirname + '/about.html');
});
app.get("/news", function(req, res){
res.sendFile(__dirname + '/news.html');
});
//app.get('/student/:id', function(req, rep){
// rep.render('student', { name : student[req.params.id] , id : req.params.id});
//});
//app.get('/student', function(req, res) {
// res.render('student');
//});
app.get('/', function(req, res){
res.render('student',{user:"John Smith"})
});
app.listen(port);

You have conflicting routes configured for '/'.
Do you want to use a separate route for student? like following
app.get('/student', function(req, res){
res.render('student',{user:"John Smith"})
});

You need to create a views folder, and put your .ejs template in there. For example if you create the file views/student.ejs , then you can use this route to render this ejs file
app.get('/', function(req, res){
res.render('student', {user:"John Smith"})
});
Scotch.io tutorial

Related

Creating routing for a static site using Express

I am creating a static site, (HTML, CSS, JS) using nodeJS and express for the server...
I am trying to create routes, so that the user sees /about, as opposed to about.html...
For the main, home page (home.html), it works fine. However, when trying to access the pages using the defined routes via app.get, I keep getting errors - any pointers...
Code is as follows - my styling and JS files ate in the public directory and the HTML files are in the views directory :
const express = require('express');
const app = express();
const path = require('path');
app.use(express.static(path.join(__dirname + '/public')));
app.use(express.static(path.join(__dirname + '/views')));
app.get('/', (req, res) => {
res.sendFile(__dirname + '/views/home.html');
});
app.get('/about', (req, res) => {
res.sendFile(__dirname + '/views/about.html');
});
app.get('/contact', (req, res) => {
res.sendFile(__dirname + '/views/contact.html');
});
// app.use(express.static('public'));
// app.use(express.static('views'));
// console.log(__dirname);
module.exports = app;
The error I get is :
Cannot GET /views/contact.html
if your foldering is like the following photo you can do like this:
app.get('/about', (req, res) => {
res.sendFile(__dirname + '/views/about.html');
});
app.get('/contact', (req, res) => {
res.sendFile(__dirname + '/views/contact.html');
});
app.get('/', (req, res) => {
res.sendFile(__dirname + '/views/home.html');
});

Express: Serving static files for defined routes

When I visit mysite.com/verify/myusn the result is a 404 error. When I visit mysite.com/ it serves me the index page as expected.
When I turned on the debugger, I realized Express was trying to serve a static file instead. But it also shows my route being registered properly. Please help me out.
Here is my debugger:
Here is my server.js:
var express = require('express');
var app = express();
var path = require('path');
app.get('/*', function(req, res, next){
next();
});
app.use(express.static(path.join(__dirname , '/_site/') , {maxAge:0}));
app.use('/assets/', express.static(path.join(__dirname , '/_site/assets') , {maxAge:0}));
var routesLogin = require(path.join(__dirname, '/api/routes/users'));
routesLogin(app);
app.get('/', function(req, res) {
res.sendFile( path.join(__dirname , '/_site/landing.html'));
});
app.get('*', function(req, res) {
res.send('404');
});
app.post('*', function(req, res) {
res.send('404');
});
port = process.env.PORT || 3000;
app.listen(port);
console.log('listening on ' + port);
./api/routes/users.js:
module.exports = function(app){
var users = require('../controllers/userController');
app.route('verify/:usn')
.get(users.verifyUSN)
};
./api/controllers/userController.js:
exports.verifyUSN = function(req, res, next){
res.status(200)
.json({
status: 'success',
data: data,
message: 'USN Verified.'
});
}
I believe your problem could potentially be in /api/routes/users.js
module.exports = function(app){
var users = require('../controllers/userController');
// previously app.route('verify/:usn')
app.route('/verify/:usn')
.get(users.verifyUSN)
};
Hope this helps.

Can't seem to render a page through express

I'm trying to render an html page with express. Here's what I have so far:
var express = require('express');
var app = express();
app.use(express.static(__dirname + '/public'));
app.set('view engine', 'ejs');
app.listen(3000, function() {
console.log('listening on PORT 3000');
})
app.get('/', function(req, res){
res.send('Home page!')
})
app.get('/events', function(req, res){
res.render('eventForm')
})
my file tree so far:
-Project
-node_modules
-public
index.html
-views
eventForm.html
I tried putting the eventForm.html in public as well but for some reason my server can't "find" it. I get the following error:
Error: Failed to lookup view "eventForm" in views directory "/Users/username/LearnProgramming/api_playground/stubhub/views"
set your views before setting view engine
app.set('views', path.join(__dirname, 'views'));
var express = require('express');
var app = express();
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'ejs');
app.listen(3000, function() {
console.log('listening on PORT 3000');
})
app.get('/', function(req, res){
res.send('Home page!')
})
app.get('/events', function(req, res){
res.render('eventForm')
})
app.use(express.static(__dirname + '/public'));
How about eventForm with .html?

In Node.js, res.render is returning a 404 error on router.get

I'm building my first Node application and having some trouble displaying the page that I want with a GET request. I have installed ejs (opinions welcome on that!) so my understanding is that I do not need to define the 'views' folder. Here is my routes file so far:
const express = require('express');
const router = express.Router();
const Event = require('../models/event')
router.get('/'), function(req, res, next){
/* Event.find({}).then(function(events){
res.send(events);
});
});*/
res.render('../../index');
};
router.post('/events', (req, res) => {
Event.create(req.body);
res.send({type: POST})
});
module.exports = router;
The database is connecting just fine, which I can see with the code that I have commented out in the get request. But for some reason I can't render my index file. My file structure is as follows:
File tree:
So I need to go up two levels, correct? I tried index, index.ejs, ../index, views/index, nothing has worked. What am I doing wrong?
EDIT: this is my server.js:
const express = require('express');
const app = express();
const bodyParser = require('body-parser');
const mongoose = require('mongoose');
const routes = require('./routes/index');
var path = require("path");
app.set('view engine', 'ejs');
app.set('views', path.join(__dirname, 'views'));
app.use(bodyParser.json());
app.use(express.static('public'));
app.use(routes);
app.use(bodyParser.urlencoded({extended: true}))
mongoose.connect('mongodb://junk:junk#ds141242.mlab.com:41242/alaska-events');
app.listen(3000, () => {
console.log('listening on 3000')
});
views folder is placed directly in root folder, and using we app.set('views', path.join(__dirname, 'views')); point it to views folder. So in render directly mention the view name.
router.get('/', function(req, res, next){
res.render('index');
});
Thanks for your help everyone, turned out to be just a typo. router.get('/'), function(req, res, next) should have been router.get('/', function(req, res, next).

Static Content Serving Not Working In Express

var express = require('express');
var app = express();
app.get('/', function(req, res){
app.use(express.static('../../www'))
})
app.listen(8080)
according to docs this should work but it just returns a page of garbled text
It's better to use path module to join the current folder and relative path to an absolute path.
var express = require('express');
var app = express();
app.use(express.static(path.join(__dirname, '../../www')));
app.get('/', function(req, res){
res.send('done');
});
app.listen(8080);
As #bulkan comments, you use /style.css to access www/style.css.
Move the app.use(express.static('../../www')); outside of the app.get like so;
var express = require('express');
var app = express();
app.use(express.static('../../www'));
app.get('/', function(req, res){
res.send('done');
});
app.listen(8080);
http://expressjs.com/api.html#app.use

Categories