2
votes

I used express-generator to create a new express Project and wanted to add a subrouting system like the following "localhost/" would take me to the index and "localhost/projects" would send "projects page" and "localhost/projects/randomCircles" would send "circles".

Node versión:v10.15.1

Express versión:4.16.0

My Project directory

Also tried to make randomCircles direct route and it worked but i don't get what's the difference

**app.js**:
var createError = require('http-errors');
var express = require('express');
var path = require('path');
var cookieParser = require('cookie-parser');
var logger = require('morgan');

var indexRouter = require('./routes/index');
var projectsRouter = require('./routes/projects');
var circlesRouter = require('./routes/randomCircles');

var app = express();

// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'jade');

app.use(logger('dev'));
app.use(express.json());
app.use(express.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));

app.use('/', indexRouter);
app.use('/projects', projectsRouter);
app.use('/randomCircles', circlesRouter);

// catch 404 and forward to error handler
app.use(function(req, res, next) {
  next(createError(404));
});

// error handler
app.use(function(err, req, res, next) {
  // set locals, only providing error in development
  res.locals.message = err.message;
  res.locals.error = req.app.get('env') === 'development' ? err : {};

  // render the error page
  res.status(err.status || 500);
  res.render('error');
});

module.exports = app;





**index.js**:
var express = require('express');
var router = express.Router();
/* GET home page. */
router.get('/', function(req, res, next) {
  res.render('index', { title: 'ProjectManager',menu: ['About Me','Projects','Contact Me']});
});
module.exports = router;

**project.js**:
var express = require('express');
var router = express.Router();

/* GET projects list. */
router.get('/', function (req, res, next) {
    res.send('projects page');
});
router.get('/randomCircles', function (req, res, next) {
    res.send('circles');
});
module.exports = router;

**randomCircle.js*:

var express = require('express');
var router = express.Router();
/* GET project randomCircles. */
router.get('/', function(req, res, next) {
    res.render('randomCircles', {title: 'randomCircles'});
});
module.exports = router;

Routes that work:

  • localhost/
  • localhost/randomCircles

Routes that don't work: - localhost/projects - localhost/projects/randomCircles

I should be able to access "localhost/projects" but i get this error:

Not Found 404 NotFoundError: Not Found at C:\Users\josea\Documents\MEGAsync\coding\projectManager\app.js:27:8 at Layer.handle [as handle_request] (C:\Users\josea\Documents\MEGAsync\coding\projectManager\node_modules\express\lib\router\layer.js:95:5) at trim_prefix (C:\Users\josea\Documents\MEGAsync\coding\projectManager\node_modules\express\lib\router\index.js:317:13) at C:\Users\josea\Documents\MEGAsync\coding\projectManager\node_modules\express\lib\router\index.js:284:7 at Function.process_params (C:\Users\josea\Documents\MEGAsync\coding\projectManager\node_modules\express\lib\router\index.js:335:12) at next (C:\Users\josea\Documents\MEGAsync\coding\projectManager\node_modules\express\lib\router\index.js:275:10) at C:\Users\josea\Documents\MEGAsync\coding\projectManager\node_modules\express\lib\router\index.js:635:15 at next (C:\Users\josea\Documents\MEGAsync\coding\projectManager\node_modules\express\lib\router\index.js:260:14) at Function.handle (C:\Users\josea\Documents\MEGAsync\coding\projectManager\node_modules\express\lib\router\index.js:174:3) at router (C:\Users\josea\Documents\MEGAsync\coding\projectManager\node_modules\express\lib\router\index.js:47:12)

There was a typo in the routing system, edited the code of the post and now it works just fine <3

1
What error are you getting? Are any of the routes working? Can you post your entire app.js file?Rastalamm
What version of Express are you using?Rashomon
Thanks,edited the post to include all that information :Ditasahobby

1 Answers

1
votes

You also need to use app.listen

  • While configuring your routers is necessary to have a functional Express app, you also need at some point to listen for incoming requests. Somewhere in your main server starting point, do this
  • To import and integrate a router you defined in another file, first import it. Then add it using app.use(myOtherRouter)

const express = require('express')
const app = express()
const port = 3000

// Import your other router(s)
const someRouter = require('./myOtherRouter');

app.use(someRouter);

// Listen for incoming requests
app.listen(port, () => console.log(`Example app listening on port ${port}!`))