Arijit Roy
radioactive11's Blog

radioactive11's Blog

Introducing Diode: Easily deploy your web apps in two steps ๐Ÿš€

Hosted on Linode, for Linode ๐Ÿ’š

Arijit Roy's photo
Arijit Roy
ยทJun 29, 2022ยท

4 min read

Introducing Diode: Easily deploy your web apps in two steps ๐Ÿš€

Table of contents

What is Diode ๐Ÿง‘โ€๐Ÿ’ป

Screenshot 2022-06-30 at 1.21.28 AM.png

Diode is a platform that lets you deploy your web apps on Linode in two easy steps

  • Connect your source code
  • Choose instance details

so that you can spend more time on developing awesome products and less time worrying about getting them up and running ๐Ÿ˜‰

Inspiration ๐Ÿ’ก

The inspiration to build Diode came from two different demographic of people, sharing the same problem.

Side Projects ๐Ÿ—ƒ

As developers, we all have side-projects that got stashed away and never made it to production. A lot of people find getting their application up and running takes a lot of time, both in terms of operations and learning the tools.

Newbies ๐Ÿ‘ถ

A vast majority of newbies skip the deployment part after they have built their initial projects. Learning the tools and setting them up on a remote server is quite daunting for someone who just learned the basics of how things work.

EVVBLqjXgAAX5Il.jpeg

Even though there are some platforms like Heroku and Railway, they require some additional files like a Procfile to deploy. We tried making Diode as easy to use as possible so that it saves effort and is beginner-friendly at the same time.

Features โœจ

  • Choose region & Linode Plan suited as per your needs ๐ŸŒ
  • Monitor deployment status ๐Ÿ”ด ๐ŸŸก ๐ŸŸข
  • Check live metrics like CPU usage, memory usage of your Linode instance ๐Ÿ“ˆ
  • Check output & error logs of your application ๐Ÿ“
  • Re-deploy changes โ™ป๏ธ

Supported Buildpacks

Currently, we support the following frameworks/libraries for 2 step deployment:

FastAPI Flask Flask NodeJS

Instructions ๐Ÿ‘ฉโ€๐Ÿซ

Ingredients

  • A GitHub account
  • A repository which you want to host
  • A Linode account (obviously!)

Note: Currently, we only support Public Repositories. We are planning to bring support for private & organization repositories soon*

Recipe

1. Generate a Personal Access Token from your Linode Account

Screenshot 2022-06-29 at 12.35.15 PM.png

While generating the token, make sure you have selected Read/Write access for Account, IPs and Linodes.

Copy the token generated as it will be used in the next step.

2. Head to diode.radioactive11.com

login.png

Enter your Personal Access token which was generated in the previous step. This will allow us to manage instances from your account.

3. Choose a Repository

repo.png

For this example, I will choose my FastAPI Sample App. Next, choose the buildpack, which in this case would be FastAPI

4. Enter Environment Variables (optional)

env.png

Enter the environment variables (often saved in the .env file)

5. Name your Project and Select a Region

name.png

Choose a name for your project and the region where it will be hosted. Prefer choosing geographically closer regions for less latency. In this case, I will choose ap-west

6. Choose Instance Type

instance.png

Based on the performance requirements of your application, choose an instance type. For this example, I will choose a g6-nanode-1 as it is the simplest Linode option for this sample app.

Note: The create instance action takes a little bit of time so please be patient ๐Ÿ˜…

7. Deploy ๐Ÿš€

deployment.png

8. Metrics ๐Ÿ“ˆ

graph.png

You can view your Linode's metrics from the dashboard by selecting an app.

Sit back and watch your app get deployed ๐Ÿ˜Ž

Result

result.png

Built With ๐Ÿ› 

Backend

There are two backend servers, one using NodeJS with Mongo DB for handling the user accounts, and FastAPI with Celery and Redis for automating the deployments and managing User Linode accounts. We used Linode to host these servers.

Frontend

We built the frontend using Next.js which was hosted on Vercel.

Code Quality

We used ESLint & Prettier for JavaScript and Black for Python to keep the codebase nice and clean ๐ŸŒŸ

Development Roadmap ๐Ÿ›ฃ

While building Diode, we felt that there were a ton of useful features that we could have implemented but weren't able to do so because of time constraints (we had our end-semester exams ๐Ÿ˜ข). Here's a list of things that we plan to integrate soon!

1. Support for Private GitHub repositories

2. Automatic deploy on git push to selected branch (CI/CD)

3. Providing domain name instead of IP addresses to user (eg. superbass.diode.com)

4. Improving the UI

Open Source ๐Ÿค—

Contributions are what make the open-source community such an amazing place to learn, inspire, and create. Any contributions you make are greatly appreciated.

  • Fork the Project
  • Create your Feature Branch `(git checkout -b feature/AmazingFeature)``
  • Commit your Changes (git commit -m 'Add some AmazingFeature')
  • Push to the Branch (git push origin feature/AmazingFeature)
  • Open a Pull Request

Try it out ๐Ÿ‘พ

Link to Website

The Team ๐Ÿค–

Note of Thanks ๐Ÿ’š

Thank you Linode & Hashnode for hosting this amazing hackathon. We got to learn a lot while building this project ๐Ÿฅณ

ย 
Share this