Hostwizly

Deploy Flask App On Vercel For FREE

Published 1 November 2023 by Jarvis Silva

Looking to host your flask api on Vercel? then you are at the right place. In this tutorial, I will show you how to deploy flask app on Vercel for absolutely FREE.

Flask is a popular microframework in python which is used for developing apis and web apps in python.

Vercel is a web hosting platform which allows developers to easily host their websites, they have a hobby plan on which you can host your projects completely for free.

To use flask we need python and Vercel has serverless functions which supports python runtime which we can use to run our flask apps. So let's see how to do it step by step.

1. Configure flask project for deploying to Vercel

First we need to configure our flask app to make it deployable on Vercel, first we need to create a api folder and put all our python codes inside it, then we need to create a vercel.json file and add some configuration in it so let's see step by step.

  • First I will create a api folder in the root, add a app.py file inside it and add a basic flask api code that returns hello world on get request, you can see from below. Note that it is mandatory to create a api folder and put all your api codes inside it as Vercel will look for the codes in the api folder when deploying.
  • flask Api demo code
  • Now we need to create a vercel.json file in the root of the project and add some code in it so copy the below code and paste in your vercel.json file. This file will tell Vercel we want to use python runtime and define our routes.
  • {
      "builds": [
        {
          "src": "api/app.py",
          "use": "@vercel/python"
        }
      ],
      "routes": [
        {
          "src": "/(.*)",
          "dest": "api/app.py"
        }
      ]
    }
  • After adding the vercel.json file now since we are using flask we need to create a requirements.txt file in the root folder of our flask project and add flask in it and also add the name of any other third party library you are using in your project.
  • flask requirment.txt file

Now our flask app is ready for deployment on Vercel. Refer here for more advanced configuration: Using Vercel Serveless Functions.

2. Upload flask code to Github

To deploy any app on Vercel we need to first upload the code on Github repository then in Vercel connect github account and import the code from the Github repository, follow the below steps to push code to Github:

  • Open Github and login to your account, click on create a new repository, enter your app name, leave rest everything default and click create repository.
  • Now it will show you commands to push your code to this repository, open a terminal at your static website code location and run all the commands one by one or you can drag and drop.
  • Github new repository page with commands

Read: How to push code to github

After you run all the commands you should see your code upload to your Github repository.

3. Deploying Flask App to Vercel

Now we just need to deploy our flask app code on Vercel for that you need to have your Github connected with your Vercel account to do that you can login by Github account or use the connect Github option in Vercel, after connecting follow the below steps:

You don't need to buy any of Vercel paid plan as you can use Vercel's hobby plan to host your apps for free.

  • Go to your Vercel dashboard and click on the add new button it will open a dropdown in that click on project.
  • Vercel new project button page
  • Now it will open a new page displaying your Github repositories, now here you need to click on import of your flask app repository you just pushed to Github.
  • Vercel git repo import page
  • Now it will ask you to enter your project name, leave the other settings as default and click on deploy.
  • vercel project deployment final step

Now it will start building your flask app and deploy it on Vercel, it will generate some preview urls which you can use to visit your flask app, you can also connect a custom domain if you want.

Also Read: Deploy express app to Vercel

So we successfully deployed flask app on Vercel for FREE so the purpose of this article is complete, I hope you found this tutorial helpful and you were able to host your flask app on vercel. Thank you for reading, Have a nice day 😊

About the author

I am Jarvis Silva, a tech-savvy individual. I have 5 years of experience in website hosting and development, Now sharing all my knowledge related to web hosting and other various technologies on the internet through Hostwizly.