I'm making an application that takes codes from mongoDB and lists them onto a web page, but currently I'm getting an error in the console:

GET http://localhost:4200/api/code/codes/ 404 (Not Found) zone.js:2863

I haven't encountered this error before & I'm not sure if there is an error in my code or a problem with a port, my server starts on port 3000 and angular portion starts up on port 4200. here is my api to find all codes

router.get("/codes", async (req, res) => {
  try {
    Code.find({}, function (err, codes) {
      if (err) {
        console.log(err);
        res.status(501).send({
          message: `MongoDB Exception: ${err}`,
        });
      } else {
        console.log(codes);
        res.json(codes);
      }
    });
  } catch (e) {
    console.log(e);
    res.status(500).send({
      message: `Server Exception: ${e.message}`,
    });
  }
});

my service file

export class CodeService {
  constructor(private http: HttpClient) {}

  findAllCodes() {
    return this.http.get('api/code/codes/');
  }

}

and my home component ts where I'm trying to display the codes

export class HomeComponent implements OnInit {
  code: Code[];

  constructor(private codeService: CodeService) {
    this.codeService.findAllCodes().subscribe(
      (res) => {
        // Logging for debugging purposes
        console.log('--Server respons from findAllCodes--');
        console.log(res);
      },
      (err) => {
        console.log('--Server error--');
        console.log(err);
      },
      () => {

        console.log('--codes--');
        console.log(this.code);
      }
    );
  }

  ngOnInit(): void {}
}