React 404 Axios Cannot POST

New to Axios and Node as a backend- have inherited some code in React for a login page and am trying to figure out why I can’t make a POST to the backend.

This is my .env file:

REACT_APP_BACKEND_URL=http://localhost:3000/admin

And there is a file called API.js

import axios from "axios";

// Set config defaults when creating the instance

export const CompanyAPI = () => {
  let api = axios.create({
    baseURL: process.env.REACT_APP_BACKEND_URL,

    timeout: 10000,
    headers: {
      "Content-Type": "application/json",
    },
  });

  return api;
};

And then there is a LoginPage.js:

export const LoginPage = () => {
  const API = CompanyAPI();
  const [email, setEmail] = useState("");
  const [password, setPassword] = useState("");
  const getAuth = (e) => {
    e.preventDefault();
    API.post("/auth/login", {
      email: email,
      password: password,
    })
      .then(async (response) => {
        if (response.status === 200) {
          await localStorage.setItem("jwt_key_admin", response.data.token);

          setTokenKey(response.data.token);
          setIsAuth(true);
          navigate("/");
        }
      })
      .catch((error) =>
        alert(
          "Login Failed"
        )
      );
  };

enter image description here

enter image description here

My question is, is there an example on how I could use express to handle the /auth/login endpoint and complement the existing API.js file?

Leave a Comment