Digital Ocean CloudHack: Deploy static site to DO Droplet easily

This story is about my journey in the Hackathon by Digital Ocean called CloudHack. In this hackathon, one is expected to pick a problem statement that he/she thinks can help the community and solve it by using Digital Ocean services.

The problem I’m trying to address

These days there are several good static site generators, like Hugo, Nikola, etc, in which creating a static site is easy and the end result is a beautiful and fast static site, but a major problem still remains the deployment part, that would you deploy the site on cloud that you’ve just created. There are several services that can do that for you like AWS Amplify but they charge you for that, but what’s the fun in letting someone else handle your deployment! Instead, the real fun lies in managing the deployment in a cool way as possible. Plus, sometimes these deployment services abstract a lot of implementation details and hence make the process of deployment less customizable. Moreover, deployment of the site can be done manually as well, but it’s really cumbersome and time-consuming to do it manually, also, when you can automate, why not automate :D

The solution I’m building

Here my goal to create a tool that can easily deploy your static site to Digital Ocean Droplet in the most convenient way possible. You can either deploy your local content or make your GitHub repo serve as a source for your static site using Hugo.

Solution

1. Create a cloud instance and assign it your system’s public SSH key (generally stored in ~/.ssh/id_rsa.pb)
2. Copy the public ssh key of this droplet to the GitHub account which has the contents for the site. (if the content is stored in local, it is advised to store it in Github as a repository).
3. Install Ansible on your machine. On Mac, you can install ansible using its brew package manager- brew install ansible
4. cd into the cloned repo i.e cloudhack/ then add executable permission to deploy.sh and conf<OS> by running chmod +x deploy.sh and chmod +x confLinux.
5. ./conf<OS> -ip <ip> -repo <repo-url> eg confMac -ip <ip> -repo <repo-url> on Mac.
6. ./deploy.sh

P.S: Make sure port 80 of this server is open in the firewall setting and is not busy.

DigitalOcean products/features that you have used in the hack

1. Digital Ocean droplet

Your Hugo powered static site is now available at http://<ip-address>. To make it point your custom domain name, follow this link. Hope this automation helped you deploy your site easily to the cloud of your choice.

Update:

I’ve secured 2nd rank in this hackathon. This is my very first win in a hackathon and I’m much delighted. This has just inspired me that I TOO CAN DO IT! This has fueled me to participate in more hackathons. This was a great learning experience for me!

On a serious note, I would like to emphasis the point that I’ve observed very often in my life, especially in this field, is that whenever I try to solve a problem I face in day to day life and I want to solve it for me, the solution is appreciated a lot and wins me big. When I was in an internship at www.hasura.io, I made an expense journal because I was not able to take care of my expenses, eventually this solution got me appreciation as well as my first job. Here too, I tried to develop a solution because I did not want to pay AWS Amplify for deploying my website, as a consequence this fetched me 2nd rank in this hackathon!
So, as I concluding advice I would like to tell the reader that, try to build a solution that you feel needs to be created for solving your own issue, eventually, people will find themselves in your shoes!