My routes are returning a 404 error with axios

Hey guys here is my heroku link - https://enigmatic-cliffs-10818.herokuapp.com/

I'm having problems with all my routing and I've tried multiple solutions yet I can't seem to fix it.

here is my folder structure for my routes - i was trying to copy this tutorial on github: https://github.com/ac524/mern-jwt-auth-setup/

and im getting a 404 not found error in my console when trying to use these - I am using Axios for my routing.

here is my Repo link - https://github.com/MarketingPlus/Tipsy I need massive help and i would appreciate it if someone could help me resolve the issue and make my application function properly

here are some of the files that manage the requests -

authentication.js there is only a small amount of code

router.post("/user/login", validateBodyWith( loginValidator ), async (req, res) => {

  const { email, password } = req.body;
  console.log("login routes is being called")
  try {

    const user =
      await User
        .findOne({ email });

    if (!user) {
      // User not found by email.
      return res.status(404).json({ default: "Email or password is invalid." });
    }

    const {
      password: encryptedPassword,
      // User object without the password
      ...secureUser
    } = user._doc;

    const isMatch = await bcrypt.compare( password, encryptedPassword );
    
    if( !isMatch ) {
      // User's password is invalid.
      return res.status(404).json({ default: "Email or password is invalid." });
    }

    const payload = {
      id: secureUser._id,
      email: secureUser.email
    };

    // Create a signed JWT token to send back to the client for reauthentication.
    const token = await jwtSign(
      payload,
      process.env.JWT_SECRET,
      {
        expiresIn: 31556926 // 1 year in seconds
      }
    );

    return res.json({
      success: true,
      token: "Bearer " + token,
      user: secureUser
    })
  

  } catch( err ) {

    console.log(err);
    res.status(500).json({ default: "Something went wrong trying to log in." });

  }

});

my register-api.js in my utils folder in my client

import axios from "axios";

class API {

    axios;

    constructor() {

        this.axios = axios.create();

    }

    /**
     * @param {String} name 
     * @param {String} value 
     */
    setHeader( name, value ) {

        if( value )

            this.axios.defaults.headers.common[name] = value;

        else

            delete this.axios.defaults.headers.common[name];

    }

    /**
     * @param {object} userData 
     * @param {String} userData.email
     * @param {String} userData.password
     * 
     * @returns {Promise}
     */
    register( userData ) {
      console.log("------");
      console.log(userData);
      console.log("------");

        return this.axios.post("/api/user/register", userData);

    }

and my index.js file in my routes folder

const path = require("path");
const router = require("express").Router();
const apiRoutes = require("./api");

router.use("/api", require("./authentication"));

//api routes
router.use("/api", apiRoutes);

//react route
router.use(function(req, res) {
  res.sendFile(path.join(__dirname, "../client/build/index.html"));
});

module.exports = router;

I have tried multiple solutions and I believe it is a routing URL issue because my routes aren't getting found at all I really need help with this one.

I've tested offline and I have constantly changed routing for the application with no luck still. not sure why my application isnt working. Do i need to install packages i might be missing?

I have also included my user.js file

const router = require("express").Router();
const UserController = require("../../controllers/UserController");

router.route("/addFavorite/:id")
  .post(UserController.addFavorite);

module.exports = router;

Do I need to add my routes here? I don't believe I do because I'm using Axios.

Here is more of my code for my login card js which handles the signup submit

  const handleSignUpSubmit = async e => {
    e.preventDefault();
    const email = signupEmail;
    const password = signupPassword;
    try {
      await api.register({ email, password });
      await login({ email, password });
    } catch (err) {
      console.log(err)
    }
  };

I have attached my error message when i try signup