Javascript Question posted in
A very good W3school tutorial can be found here.

Javascript – Stuck on express routing

app.js file

// home route
app.get("/home", async(req, res)=>{
    let allCards = await  Card.find({});
    let skills = await Skill.find({});
    res.render("index", {allCards, skills});
})


// add new skill route
app.get("/home/newskill", (req, res)=>{
    res.render("newskill");
});

// submiting a new skill to the database
app.post("/home/newskill", async(req, res)=>{
    let {title, image}= req.body;
    let newskill = new Skill({
        image: image,
        title: title
    });
    await newskill.save();
    res.redirect("/home");
})


// signup route
app.get("/home/signup", (req, res)=>{
    res.render("signup.ejs");
});

// signup 2nd route
app.post("/home/signup", async(req, res)=>{
    let {userName, email, password}= req.body;
    let newUser = new User({
        userName: userName,
        email: email,
        password: password
    });
    await newUser.save().then(res =>{console.log(res)}).catch(err =>{console.log(err)});
    res.redirect("/home");
})


// login route
app.get("/home/login", (req, res)=>{
    res.render("login.ejs");
});

// login second route
// app.post("/home/login", async(req, res)=>{
//     let {userName, email, password} = req.body;
//     let user = await User.findOne({email: email, password: password})
//     res.render("index.ejs", {user});
    
// })

html login file


<div id="main">
    
    <form action="/home/login" method="post">
        <h3>Please input your login info</h3>
        <br>
        <input type="email" name="email" placeholder="Enter your email">
        <br><br>
        <input type="password" name="password" placeholder="Enter Password">
        <br><br>
        <button class="btn btn-light">Submit</button>
    </form>


</div>

index.ejs file

<% for( let skill of skills) { %>
                <div>
                    <img src="<%= skill.image %>" alt="">
                    <p><%= skill.title %></p>
                </div>
            <% } %>

I’m a student and I’m currently working on a project that involves user login. I’m encountering an error when attempting to add a second route for user login in my application. The error message reads ‘cannot get skill’. However, if I comment out the second login route, the error disappears. I’m looking for a basic explanation of why this error is occurring and some guidance on the fundamental principles of routing to help me avoid similar issues in the future. Any help would be greatly appreciated!

Tags:

3

Answers


  1. 0

    The second login route does not contain any errors, it is strange that the error disappears when you comment it out. This error message you mentioned, "cannot get skill", should be displayed when trying to access the "/skill" route, and it seems it does not exist in your server code. Check your code to see if you are trying to access this route at any point.

    Login or Signup to reply.
  2. 0

    In the login post route (second login route), While rendering index.ejs that is looking for skills however you have not passed the skills while rendering it. After logging in you can redirect to /skills route you have used earlier or pass the skills while rendering index.

    Login or Signup to reply.
  3. 0

    In your first route you are using the GET method and sending the login.ejs page. The variable skills is not being utilised on login.ejs so there is no error:

    app.get("/home/login", (req, res)=>{
    res.render("login.ejs");
});

    The second route is a POST request which is sending the index.ejs page with data contained in the user variable:

    app.post("/home/login", async(req, res)=>{
   let {userName, email, password} = req.body;
   let user = await User.findOne({email: email, password: password})
   res.render("index.ejs", {user});  
})

    However, your index.ejs always expects a variable named skills to exist. When you post to /home/login there won’t be a skills variable like there will be when you do a GET to app.get("/home",...)

    My advice would be to use if in your index.ejs file like so:

    <%if (skills) { %>
   <% for( let skill of skills) { %>
      <div>
         <img src="<%= skill.image %>" alt="">
         <p><%= skill.title %></p>
      </div>
   <% } %>
<% } %>
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search