NodeJS – Cannot Set Up Port Proxy with NodeJS, React, Apache, and LetsEncrypt

I've got the following server setup (Ubuntu 19.04):

• NodeJS (Express) backend on port 3333
• React frontend in /var/www/example.com
• Apache with LetsEncrypt and automatic http > https redirect

I'm trying to force all requests from example.com/api/* to the NodeJS backend on port 3333. This is my sites-enabled/example.com.conf:

<VirtualHost *:80>
    ServerAdmin support@example.com
    ServerName example.com
    ServerAlias example.com
    DocumentRoot /var/www/example.com
    ErrorLog ${APACHE_LOG_DIR}/error.log
    CustomLog ${APACHE_LOG_DIR}/access.log combined
    RewriteCond %{SERVER_NAME} =example.com [OR]
    RewriteCond %{SERVER_NAME} =www.example.com
    RewriteRule ^ https://%{SERVER_NAME}%{REQUEST_URI} [END,NE,R=permanent]
    ProxyRequests on
    ProxyPreserveHost on
    ProxyPass /api https://127.0.0.1:3333/api
    ProxyPassReverse /api https://127.0.0.1:3333/api
</VirtualHost>

If it helps, this is my sites-enabled/example.com-le-ssl.conf:

<IfModule mod_ssl.c>
    <VirtualHost *:443>
        ServerAdmin support@exampl
        ServerName example.com
        ServerAlias example.com
        DocumentRoot /var/www/example.com
        ErrorLog ${APACHE_LOG_DIR}/error.log
        CustomLog ${APACHE_LOG_DIR}/access.log combined
        Include /etc/letsencrypt/options-ssl-apache.conf
        ServerAlias www.example.com
        SSLCertificateFile /etc/letsencrypt/live/example.com/fullchain.pem
        SSLCertificateKeyFile /etc/letsencrypt/live/example.com/privkey.pem
    </VirtualHost>
</IfModule>

With this config:

• Requests to https://example.com/api/test give me the React Router 404 page and a 404 error in access.log
• Requests to http://example.com/api/test give me a 500 error

How do I get the frontend to correctly proxy/redirect example.com/api/* requests to the NodeJS backend?