JavaScript Express Basics Parameters, Query Strings, and Modularizing Routes Randomize Cards

Hamzah Iqbal
seal-mask
.a{fill-rule:evenodd;}techdegree
Hamzah Iqbal
Full Stack JavaScript Techdegree Student 11,144 Points

404 is returned

So whenever opening the cards route, it is showing a 404 error app.js

const express = require('express');
const app = express();
const cookieParser = require('cookie-parser');



app.use(express.urlencoded({ extended: true }))

app.use(cookieParser());


app.set('view engine', 'pug');

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



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


app.use((req, res, next) => {
    const err = new Error('Nothing here');
    err.status = 404;
    next(err);


});

app.use((err, req, res, next) => {
    res.locals.error = err;
    res.status(err.status);
    res.render('error');


});



app.listen(3000, () => {
    console.log("The app is on the following local host: 3000 :)");


});

cards.js

const express = require('express');
const router = express.Router();
const { data } = require('../data/flashcardData.json');
const { cards } = data;

router.get('/:id', (req, res) => {

    const { side } = req.query;
    const { id } = req.params;
    const text = cards[id][side];
    const { hint } = cards[id];


    const templateData = { id, hint };



    if (side === 'question') {
        templateData.hint = hint;
        templateData.enddata = 'answer';


    }


    if (side === 'answer') {
        templateData.enddata = 'question';

    }


    res.render('cards', templateData);
});

module.exports = router;

cards.pug

doctype html
html(lang="en")
        head
        title Landing Page
        body
        header
        h1 Flash Cards
        section#content
        h2= text
        if hint
            p
            i Hint: #{hint}
        a(href=`${id}?side=${enddata}`)

        footer
            p Study app