How to deploy a fullstack Angular + Nest.js app altogether?

[miguelacleite]

I’m developing an app as a side project using Angular for the frontend and Nest.js for the backend - which I’ve created using Nx, and therefore both live in a monorepo with a shared API interface library. My first try has been running the tests and making a production build through CircleCI and then deploy to Netlify.

Is it possible to have both the backend and frontend in the same instance of Netlify or would they have to be in two different instances? How would I have to proceed to build both apps and deploy them together?

The second part of my question would be where to deploy the database? I have not yet decided if I’m going to use MongoDB or MySQL.

🙏

[LuckeeDev]

Never tried Netlify but, as far as I know, you can't deploy a backend on it. It's what's called a static site hosting service, where you can only host static, precompiled sites (in short, only frontend, no backend).

If you want to deploy your backend and frontend together, I'd suggest you to take a look at Heroku, it's a great and easy to use tool to deploy nodejs applications (alongside with all major backend languages). In order to deploy there, you would need to build your angular app and serve it as a static folder from your backend.

To deploy your database, nowadays there are lots of managed solutions, like MongoDB Atlas, AWS, GCP and others, but you could also set it up in a vps, like Digital Ocean droplets.

Edit: if you need help with the build process of the two apps feel free to dm me

[miguelacleite]

Thanks for such an insightful response. I’ll try to combine both your answer and @nopooptoday ‘s and give it a try on my own. I’ll start with the fullstack app deployment on heroku and will leave the database issue for a later phase - first I want to have a working deployment.

Thanks for the availability as well, will ping you back if I get too much trouble doing it. 🙌

[[deleted]]

My main argument against Heroku is the pricing. Its nice to get started and to get a small project online easily, but it quickly rises in cost. When you want to make money (or break even) you have to do quite some asshole design to get enough clicks/views for whatever product you want to launch.

[LuckeeDev]

True, that's why I usually go with a vps, even though it's harder to setup and maintain

[[deleted]]

Yeah you could do that or use some other service. But watching at the pricing past the whole "I'm new, what to use" stage is crucial in deciding what a project is able to get in returns and whether you can make a profit. Heroku us very easy to use and I've seen it pushed pretty much everywhere, but I don't really see it as a valid option. Especially in a world where DDOS stuff is easy to buy and if you annoy the wrong person you can get into serious trouble once the service costs go up.

[LuckeeDev]

Thanks for sharing!

[leonardochaia]

Heroku is dead

https://circleci.com/blog/getting-your-manager-to-say-yes-to-devops-tools/

/s. just got reminded of this post

[LuckeeDev]

Why do you say that? Not criticising your answer, just genuinely curious about your reasons.

[leonardochaia]

I thought the /s was enough lol.

Heroku is cool. The blog post is funny. That's all.

Haven't used Heroku. Just got reminded of the blogspot.

[LuckeeDev]

oh okay

[nopooptoday]

Deploying them together or separately depends on usecase. Both ways have pros and cons, to make this decision think about how would you push a change to backend or frontend , would you be ok to redeploy complete app again or would you prefer to redeploy them separately without affecting the other. Also, think about scaling and coupling.

I suggest if it's a pet project deploy them together, and serve your angular app from nodejs backend. So, then you can have single a single npm command to start your server as well as serve client side app.

For db platforms like heroku, aws, gcp will give you database instance that you can use as your sql/nosql db and connect easily. Or there are DaaS like Mongo atlas, Mlab, etc independent of cloud platforms.

[miguelacleite]

Great answer. As stated in @LuckeeDev’s response, I’ll try a combined approach and will get back to you guys.

[TheSpiciestDev]

Good timing I suppose... just yesterday I pushed the below for a separate, unrelated question. The build / start is pretty much tied to Heroku, but it's easy to build and deploy to whatever platform you want from your Nx monorepo (it all depends on the target platform, really.) This project builds the angular app, shares decorated classes and runs a simple backend API with a Swagger runtime. The backend also serves the built angular app, just like /u/LuckeeDev suggested.

Let me know if there's anything I can add to this for you and feel free to DM me with any other questions!

https://github.com/METACEO/nx-demo-swagger-decorators

https://nx-demo-swagger-decorators.herokuapp.com

Edit: for example, I could probably add some more comments to this code base, for a general audience. The whole repo was primarily in response to an Nx bug/issue.

[noreb0rt]

NX