Running backend and web app on different subdomains

I have setup a server running on server.mydomain.com and I have one device reporting to it already.
Now I want to run the web app on app.mydomain.com. The problem is I get a 404 at app.mydomain.com/api/server and the error page as expected.
It is running on apache httpd, and this is the conf files I have:

traccar.conf:

< VirtualHost *:80>
        ServerName server.mydomain.com
        ProxyPass /api/socket ws://localhost:8082/api/socket
        ProxyPassReverse /api/socket ws://localhost:8082/api/socket
        ProxyPass / http://localhost:8082/
        ProxyPassReverse / http://localhost:8082/
< /VirtualHost>

traccar-web.conf:

< VirtualHost *:80>
        ServerName app.mydomain.com
        DocumentRoot /var/www/html/traccar-web/modern/build
< /VirtualHost>

I have tried changing the proxy at vite.config.js and building again many times, but nothing works on the server.
In my local dev environment I can make it work like this:

  server: {
    port: 3000,
    proxy: {
      '/api/socket': 'ws://server.mydomain.com:8082',
      '/api': 'http://server.mydomain.com:8082',
    },
  },

Any suggestions?

You have to proxy the API.

Thanks for the quick response, it works now.

One another thing I noticed, is that if I refreshed the page while not in the main page ( at app.mydomain.com/settings/preferences for example), I would get a 404. The server was looking for /settings/preferences folder, but obviously it doesn't exist.

xxx.xx.xx.xxx - - [09/Feb/2024:12:16:15 -0500] "GET /settings/preferences HTTP/1.1" 404 196 "-" "Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:122.0) Gecko/20100101 Firefox/122.0"

I solved by adding this directory section with a rewrite

        < Directory path/to/app>
                RewriteEngine on
                RewriteBase /
                RewriteCond %{REQUEST_FILENAME} !-f
                RewriteCond %{REQUEST_FILENAME} !-d
                RewriteRule . /index.html [L]
        < /Directory>

But there must be a better way, because any input after / will be a blank page instead of a 404

You have to return index.html content for non-existing URLs. That's how it works in Traccar.