I have a website with the frontend and backend hosted with different hosting providers. The frontend of the app is in Vercel while the backend is in Linode. I also bought a domain in Cheapname, namely example.com. Right now both example dot com and example.com redirect to the Vercel frontend app. The backend is hosted on a VPS and I'm using Nginx for the server. The backend can be accessed using the IP of the
cheap VPS.
What I want: Access the frontend app with example.com and example dot com (so far this part works), and access the backend when using the subdomain api.example.com (this does not).
What I have done so far: Changed the DNS for Cheapname and Vercel:
A Record @ 76.76.21.21
CNAME Record www cname.vercel-dns.com.
CAA Record 0 issue "letsencrypt.org"
Because I want the backend to only be accessed through api.example.com I set the configuration of nginx as follows:
server {
listen 80;
server_name api.exaple.com;
location = /favicon.ico { access_log off; log_not_found off; }
location /static/ {
root /home/myuser/myproject;
}
location / {
include proxy_params;
proxy_pass http://unix:/home/myuser/myproject/myproject.sock;
}
client_max_body_size 100M;
}
Then, I put this on Namecheap:
A Record api xxx.xx.xx.xx
CNAME Record api xxx-xx-xx-xx.ip.linodeusercontent.com.
where xxx.xx.xx.xx is the IP address of the VPS
The Problem: When I try to access api.example.com it redirects me to https:\\api.example.com and it gives me a 404 error (Vercel 404!!!). I'm a newbie with DNS, I would appreciate any help!!! Thank you in advance! =)
