This is part of a series on how to deploy your Angular application to cloud servers for free.
First on this series is DigitalOcean
DigitalOcean released a feature called App Platform, simplifying the deployment of your project with few clicks, this gives you the chance to host 3 free static sites.
So let me list prerequisites, before we try out DigitalOcean
- Everything mentioned in the first article of this series.
- A DigitalOcean Account, If you don't have one already and you won't mind using my referral link to register https://m.do.co/c/429a858104af. Plus, you get a $100 free credit, for using the link.
- And finally, it will be amazing if you would follow me and also subscribe to my newsletter, this is an optional prerequisite, and you can choose to ignore it.
With all these in place let start.
On DigitalOcean's main page, at the top right, click on create, this will give you a drop-down list of menu to select
Select Apps from the menu list
This will navigate to the app platform displaying 3 major git hosts for you to select one. Select the git service where your code is hosted, in this case, we are using GitHub.
This will navigate you to GitHub's authorization page, select your profile name
Authorize and install DigitalOcean's service to your GitHub profile, choose whichever access you want to grant DigitalOcean, for this article I will choose all repository, (you may not want to do this for your profile).
Now select from the dropdown of your repositories, the name of the app you want to deploy, for this article I am using a demo repository called cloud-free
(I'm not good with naming things), select the branch you will want to deploy, mine is main branch
Now, you get to configure your deployment commands, DigitalOcean will auto-detect the source code's environment. Important: change the type to Static Site
, and edit the Output directory to the dist/app-name
, replace app-name with the name of your Angular App mine is cloud
. Like I said, 'not good with naming'
At this point, you get to select the billing option for your app, by default it should be on the starter section it's free for us.
Now your app is deploying, go for a break, make sure you are staying hydrated, drink a lot of water and hey before I forget if you not already following me, why don't you do that now, but again you are taking a break so you can choose not to.
Okay, let get back here and check, you should see Deployed successfully!
We are Done!
Click on Live App and you should see you app
Stay here I will be writing about another cool service you can use in the next article.