DEV Community


How do you deploy frontend and backend separately?

patarapolw profile image Pacharapol Withayasakpunt ・1 min read

Initially, the idea comes from, 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 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 (6)

dtinth profile image
Thai Pangsakulyanont • Edited
  • 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.

patarapolw profile image
Pacharapol Withayasakpunt Author

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

chathula profile image
Chathula Sampath

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.

jsn1nj4 profile image

Heroku is slow on paid plans?

chathula profile image
Chathula Sampath

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

bitdweller profile image
Pedro Pimenta

You can set environment variables on the Netlify dashboard just like Heroku:

Forem Open with the Forem app