Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript Express Basics Parameters, Query Strings, and Modularizing Routes Using Data and Route Parameters

After watching the video and reading the other questions, still cant resolve 404 error

Hello, After watching the entire video and reading previous questions on this page I am still confused how to get the cards/1 page to render. I have tried multiple things and I get the same error every time.

cards.js

const express = require('express');
const router = express.Router();
const data = require('../data/flashcardData.json');
const { cards } = data; //separated out the cards because this is the array with data we want.

router.get('/:id', (request, response) => {
    response.render('card', { 
        prompt: cards[request.params.id].question,
        hint: cards[request.params.id].hint
    }); 
});

module.exports = router;

cards.pug

extends layout.pug

block content
    section#content
        h2= prompt
        if hint
            p
            i Hint: #{hint}

app.js

const express = require('express');
const bodyParser = require('body-parser');
const cookieParser = require('cookie-parser');
const { response, request } = require('express');

const app = express();
app.use(bodyParser.urlencoded({ extended: false}));
app.use(cookieParser());

app.set('view engine', 'pug');//tells Express where to look and to use pug


const mainRoutes = require('./routes/routes');
const cardRoutes = require('./routes/cards');

app.use(mainRoutes);
app.use('/cards', cardRoutes);

app.use((req, res, next) => {
    console.log("hello");
    // const err = new Error('Oh no!');
    // err.status = 500;
    next();
});

app.use((req, res, next) => {
    console.log("World");
    next();
});

app.use((request, response, next) => {
    const err = new Error('Not Found');
    err.status = 404;
    next(err);
});

app.use((err, request, response, next) => {
    response.locals.error = err;
    response.status(err.status);
    response.render('error', err);
    next();
});

app.listen(3000, () => {
    console.log("running!");
});

Sorry I know it's long, thanks in advance!

1 Answer

Hi William!

I could spot something at the beginning of your code, on the cards.js file.

Check the way you're accessing the json file, specifically the const data. See what Andrew has written in the video. Either you wite '{data}' or append the '.data' at the end of your require :)

This is a late reply, so I'm guessing you already solved this. But if not, I hope this helps :) Carlos