loading...

How do you deploy frontend and backend separately?

patarapolw profile image Pacharapol Withayasakpunt ・1 min read

Initially, the idea comes from Now.sh, where frontend is static, backend is serverless. The website loads faster, but when we need an API, there will be a little warm-up time.

But what if I want a full-blown powerful backend? (I use Fastify, actually.)

I plan to put backend on Heroku, as I am not sure about the cost if I put on Google Cloud Run...

For frontend, I'll just put on Netlify. An issue with Now.sh is just it knows too much. It won't let you host a static site without building first, for instance.

My concern is security. OK, I can use a CORS header on Heroku side, but do I need some kind of API secret to protect the API? If so, how do I put API secret on Netlify?

Discussion

markdown guide
 
  • Most things that runs on client-side can be tampered with, if they so choose to, they could inspect your page (or just look at the network requests) and extract out the API key.

  • If you try out Google APIs, they let you generate a key and restrict it by HTTP Referrer.

  • You can also use Netlify’s proxy to put both the front-end and back-end under the same domain, eliminating problems with CORS.

 

Thanks. If it's netlify.toml, it is easy to hide.

 

Heroku is also bit slow for me.i would prefer gcp or aws(non serverless way as u say it is slow).

If you are looking for budget vms.digitalocean is the option.

 
 

I am not happy with the price to performance. Serverless is much better. Heroku also takes time to spin up

 

You can set environment variables on the Netlify dashboard just like Heroku: docs.netlify.com/configure-builds/...