POST http://localhost:5173/register 404 (Not Found) & axios error

Backend Development
1

I have been trying to get the response from the server but it shows error. I’m using vs code for this program. When I check the “process.env.MONGO_URL” using console.log() ,it says undefined. (It worked untill yesterday)

and when check the network in inspect mode in chrome, for register page , it shows

POST http://localhost:5173/register 404 (Not Found)
Uncaught (in promise) AxiosError {message: 'Request failed with status code 404', name: 'AxiosError', code: 'ERR_BAD_REQUEST', config: {…}, request: XMLHttpRequest, …}

The network page shows

Request URL: http://localhost:5173/register
Request Method: POST
Status Code: 404 Not Found
Remote Address: [::1]:5173
Referrer Policy: strict-origin-when-cross-origin

Register page

import { Link } from "react-router-dom";
import axios from "axios"
import { useState } from "react";

export default function RegisterPage(){
    const [name,setName] = useState('');
    const [email,setEmail] = useState('');
    const [password,setPassword] = useState('');
    function registerUser(ev){
        ev.preventDefault();
        axios.post('http://localhost:5173/register',{
            name,
            email,
            password
        });
    }

    return (
        <div className="mt-4 grow flex items-center justify-around">
            <div className="mb-32">
                <h1 className="text-4xl py-4 text-center mb-4" >Register</h1>
                <form className="max-w-md mx-auto" onSubmit={registerUser}>
                    <input  type="text" placeholder="your name" 
                            value={name} onChange={
                            ev =>setName(ev.target.value)}>

                    </input>
                    
                    <input  type='email'placeholder="your@email.com" 
                            value={email} onChange = {
                            ev =>setEmail(ev.target.value)}>

                    </input>

                    <input  type='password' placeholder="password"
                            value={password} onChange= {
                            ev=>setPassword(ev.target.value)}>

                    </input>
                    
                    <button className="primary">Register</button>

                    <div className="text-center p-3 text-gray-500">
                        Already have an account?
                        <Link className="underline text-black"
                        to={"/login"}>login</Link>
                    
                    
                    </div>

                </form>
            </div>
        </div>
    );
}

index.js page

const express = require("express")
const cors = require("cors")
const bcrypt = require('bcryptjs')
require('dotenv').config({debug : true})
const User = require('./models/User.js')
const app = express()
const mongoose = require('mongoose')
mongoose.set('strictQuery', true);

const bcryptSalt =  bcrypt.genSaltSync(10);

app.use(express.json());
app.use(cors({
    credentials:true,
    origin: 'http://localhost:5173',
}));
console.log(process.env.MONGO_URL)
mongoose.connect(process.env.MONGO_URL);

app.get('/test',(req,res)=>{
    res.json("test done")
})

app.post('/register', async (req,res)=>{
    const {name,email,password} = req.body;
    const userDoc = await User.create({            /*User = usermodel   userDoc = user created user*/
        name,
        email,
        password:bcrypt.hashSync(password,bcryptSalt),

    }) 


    res.json(userDoc)
})
app.listen(3000);

User.js page

const mongoose = require('mongoose');
const {Schema} = mongoose;
const UserSchema = new Schema({
    name: String,
    email:{ type:String,
            unique:true},
    password :String,
});     

const UserModel = mongoose.model('User',UserSchema)

module.exports = UserModel;