- Deployed the backend: I deployed the Whinst backend to a Digital Ocean Droplet which is Linux-based virtual machine. The process was pretty straight forward because I’ve done deployment like this a couple of times😅. I first setup the Droplet and started an Nginx server. I then cloned the backend code to the the Droplet and imported all the required Node packages. I performed a few more configurations and the backend was up and running.
- Setup the database: The Whinst web app uses a PostgreSQL database. I setup the database server and database on the same Digital Ocean Droplet. I first installed PostgreSQL on the droplet then created a database user and a database server for the Whinst web app. I then connected the database server to the Whinst application running on the droplet. I then created the actual database that the Whinst application uses.
- Deployed the frontend: The Whinst web app is a Nextjs project. I deployed it to Vercel, a process which is by far the easiest I’ve ever come across😁. I first created a Vercel account via my Github account. I then pushed the application code to my Github and cloned it to my Vercel account. On Vercel I then setup up the required environmental variables and deployed the application. A process which took less than hour🙌.
- Bought a domain: I purchased two domains, one for the frontend and one for the backend. I linked the first one to the frontend via Vercel, a process which was very straightforward and was automatically made secure. I linked the second one to the Digital Ocean Droplet also made pretty straightforward by the domain provider but extra configuration was need to secure the connection
With all these steps completed I can now proudly say the Whinst web app is completed and ready use. Stay tuned for the next article which will be final of the series where I’ll fully reveal the application and how you can access it. Thank you for reading!🙏