Vercel and Pythonanywhere | Deploy separtly frontend and backend on domain and subdomain - deployment

I've been working on a project using Django as backend and React as a framework for the frontend. I've deployed this project in Pythonanywhere and it worked fine. Now, I would like to implement Next.js in my project but, unfortunately, Pythonanywhere does not support Node.js. So I decided to deploy my frontend in Vercel and let the backend in Pythonanywhere.
To achieve this, I plan to create a subdomain that handles the API request. In the domain DNS panel, each domain and subdomain respectively will point to different sites. It'd look like this:
www.example.com (Pointing to Vercel, where the React app is hosted)
api.example.com (Pointing to Pythonanywhere, where the backend is hosted)
I've searched about this in Google and it should work. But, here comes my question, is this the best approach or should I consider other options?
Here is a post that is related to this one. In the post, the author plans to deploy both: backend and frontend on GCP.
Thank you in advance for your time and answers!

The setup you described is pretty standard and it will work perfectly. All you need is to take care of the following points:
Make sure "www" and "#" (aka root) points to Vercel's using DNS configuration. It should be an A record to 76.76.21.21 in the root domain and a CNAME record to cname.vercel-dns.com on the "www" subdomain. Remember to redirect the domains for optimal SEO score.
The DNS record for api.example.com should point to the other provider. You need to check if they require an A or CNAME record. They may require additional DNS records (CAA?).
CORS: Notice that example.com should trigger requests to api.example.com. Your CORS configuration should account for that. CORS is a whole different discussion but I will point you in the right direction. You need to check Next.js custom headers and CORS guides.
If you face any issues on Vercel, you can contact their support channel.

Related

The recommended way to set up DNS?

Brief background:
I am learning VPC with AWS lightsail(wordpress). I just realised it doesn't come with email service and have to be set up on our own.
What I want to do:
I would prefer to use a non Amazon's email service provider (maybe proton or g-suite) for daily email communications.
I'd prefer to have www.example.com to be redirected to example.com
My questions:
What is the recommended way to set up the email MX record?
Does it make any difference in configuring DNS with domain registrar or hosting service provider?
I remember Google Analytics has the option to direct www.example.com to example.com and vice versa. Is it similar to DNS directing or that is mainly for site traffic direction?
Extra info:
Currently, the domain is registered with Namecheap and I have the NS pointed to AWS. I'm open to any kind of configuration suggestions because it is mainly for learning purpose and can be changed/deleted anytime.

Can there be a redirect to a foreign domain while suing enforced https?

I am using guthub pages to host a simple website with a custom domain. To manage the the DNS I am using CloudFlare.
I had pages rules setup on CloudFlare for forwarding to my google drive file:
example.com/pdf Foreward rule code 301 https://drive.google.com/file/d/ZZZZZZZZZZZZZZZZZZZ
A while back I enabled HTTPS for my custom domain. Domain is assigned to the guthub page using CNAME and on the github settings page I have enabled Forced HTTPS
I only recently noticed my short links to the google drive files were down.
Is this due to HTTPS? Can replicate forwarding to foreign domain effect without compromising on HTTPS?
You need to make sure that site-wide SSL is reflected in the rule, because Cloudflare first enforces the SSL and only then processes the rules.
https://example.com/pdf 301 https://drive.google.com/file/.........

Health check route organisation in microservice(ish) setup behind AWS ALB

How to name health check routes among several services behind ALB?
I'm moving my API and database to AWS. Before moving I split up my monolith REST API into four services:
public API (to which apps and websites connects)
admin API (for admin web site)
messaging API (web socket server for realtime communication with apps)
workers (queue based task processors)
I'm now trying to figure out a good organisation of the routes. At first created two subdomains, api.mydomain.com and www.mydomain.com.
I directed the api subdomain to my ALB which routed traffic based on the path only, like this:
"/sockets" -> messaging-api
"/admin" -> admin-api
"/" -> public-api
Now I'm trying to implement the health check routes. I'd like to name them "/health". But the health checks needs to be directed to each target group. Since the ALB only routes based on the path I cannot have /health on more than one server.
Possible solutions:
1. Separate the services via subdomains
I could create a subdomain for each service like:
- api.mydomain.com
- sockets.mydomain.com
- admin.mydomain.com
With this setup I could have a /health in each service without collisions.
2. Separate the health check routes via naming
I could name the health check route differently for each service like:
api.mydomain.com/health-public-api
api.mydomain.com/health-messaging-api
api.mydomain.com/health-admin-api
Suggestions?
Both the above solutions seems viable, but I'd like to know if maybe one of the solutions will bite me later, when for example more services are added, or when I'll add a graphQL API later on.
edit:
I just bumped into one drawback with solution #1. My local
dev-enviromnemt is setup with a docker image for each service and
nginx for routing the requests. On top of this I use ngrok to be able
to reach the dev environment from the Internet.
I think it would be hard to solve the service separation in based on
subdomains, but I really don't need the /health routes in the dev
enviromnent, so I guess I could just pretend they are not there.
Answering my own question as documentation and possibly some input to others.
tl;dr:
I went with a third option, separating all services via the first level in the the path. The main difference from my previous structure is that my main api (aka public-api) has moved from the root to a subpath called /app. I also renamed it to app-api.
api.mydomain.com/app/..
api.mydomain.com/admin/..
api.mydomain.com/sockets/..
api.mydomain.com/auth/..
www.mydomain.com/..
This solution gives me several pros and no cons (I think).
Pros:
Easy to route request both in ALB and in local dev environment via nginx without the extra work needed for SNI
subdomains separates api vs web sites very clearly
/health routes gets unique names by default since they live under separate paths.
the apps (web and smartphones) can use a common api url (api.mydomain.com/) and still reach all services, i.e. they don't need to store several differently initialized Axios connections. No biggie, but still..
I also opted for making /health a little more future proof and standardized on the following structure in each service.
api.mydomain.com/servicename/health
api.mydomain.com/servicename/health/is-up
api.mydomain.com/servicename/health/is-ready
up = responding to requests, ready = all dependencies are connected (i.e. databases, etc)
/health returns status 200 along with a json object describing the readiness.
/health/is-up responds with 200 or nothing (i.e. not reachable at all)
/health/is-ready responds with 200 if all dependencies are ready, otherwise 500.
The target groups in AWS will use /is-ready for health checks, but for now it's the same thing as /is-up since I haven't implemented the readiness tests yet.

custom domain mapping to subdomains

I have searched and have not been able to find anything helpful.
I have a mydomain.com that is setup to allow wildcard subdomains (*.mydomain.com).
I need to be able to have clientdomain.com point to clientdomain.mydomain.com.
I've setup a CNAME clientdomain.com > clientdomain.mydomain.com, though I get the standard CPANEL error page since clientdomain.com is not configured on that host.
I need to be able to do this on the fly - so I cannot ad a hostrecord for each domain, unless there is a way to do it programmatically.
CNAME record will not work as the parent and source domains are not hosted on the same server.
You will have to the redirection feature in cpanel to get this task done by creating proper subdomain. You can set the redirection through redirection option in cpanel.

Subdomain redirect to subdirectory

I have a domain in which I want the subdirectory to be shown as a subdomain in the url.
I do not want it to be a subdomain because it'll cause problems with the integration of two cms's that I have.
I would like
forum.domain.com -> domain.com/forum
to redirect to there but I would also like it to keep saying forum.domain.com in the url and not change to /forum.
I do have access to the DNS zones but I am completely lost on how to do this. So far my forum.domain.com is a website by itself in which I do not want it to be.
*Server Htaccess is running helicon ape.
This cannot be done purely through DNS. It's not hard, but it does involve your web server's configuration.
In DNS, create a CNAME (an alias) for forum.domain.com to point to your server, probably domain.com.
In your webserver's configuration, configure a new virtual host with that path as its document home. The way you do this will depend on whether you use Apache, Nginx, etc.