Deploy Serverless Python App into Free Vercel Cloud to Show Visitor's Public IP

It is pretty easy to deploy a simple serverless script into cloud. Following three vendors are providing a free service for that"

• Heroku - is a platform that lets developers deploy, manage, scale web apps. It provides its own CLI which lets you use your terminal to track changes or deploy your code directly to Heroku after logging in.
• Netlify -  is a saas platform to build, deploy and host your static site or app with a drag and drop interface and automatic delpoys from GitHub or Bitbucket. Netlify is smart enough to process your site and make sure all assets gets optimized and served with perfect caching-headers from a cookie-less domain. 
• Vercel - is also a platform to deploy and manage your web apps but the front-end part only. Though the steps are very easy. You just need to connect your Github account with Vercel and then choose the repository which has the project you wish to deploy. Once added, it will also keep track of any changes you’ll do in your master branch and will keep re-deploying the app with those changes.

In this post, I am going to use Vercel as the platform to run my small Python web app to show the visitor's public ip.

What you will need is only a Github account and a Vercel account. 

Create a Python script at GitHub

Here are steps to create your own Github repository, folder structure and file you will need:

1. Log into Github account
2. Create repository
3. Create folder , api
4. Create a file and name it as index.py

Or, you can direct folk my project from https://github.com/51sec/ip/  to your own Github account

from http.server import BaseHTTPRequestHandler
class handler(BaseHTTPRequestHandler):
  def do_GET(self):
    self.send_response(200)
    self.end_headers()
    self.wfile.write(self.headers.get('x-forwarded-for').encode())
    return

For deploying our python app, it is already enough. By default, there is no special configuration needed to use Python Runtime. Only thing required is to put your python file under api folder. If there is any special module needed, you can create requirements.txt file at the root folder. 

Here is another typical example for Python github file directory strucutre you can find from :

https://vercel.com/docs/runtimes#advanced-usage/advanced-python-usage

├── README.md: 
├── api
|  ├── user.py
├── data
|  └── file.txt
└── requirements.txt 

With the above directory structure, your function in api/user.py can read the contents of data/file.txt in a couple different ways.

You can use the path relative to the project's base directory.

For other runtime, you might need another special file, such as php code, you will need vercel.json fole created. 

More can be found about how to deploy PHP code into Vercel from https://github.com/juicyfx/vercel-php

Here are some notes:

Most simple example project is this one, using following project structure.

project
├── api
│   └── index.php
└── vercel.json

First file api/index.php is entrypoint of our application. It should be placed in api folder, it's very standard location for Vercel.

<?php
phpinfo();

Second file vercel.json is pure gold here. Setup your project with configuration like this and voila. That's all.

{
  "functions": {
    "api/*.php": {
      "runtime": "[email protected]"
    }
  }
}

Create Your Vercel Account and Deploy Github project

Here are steps to deploy the Github myip project:

1. Log into your Vercel account
2. Connect it with your Github account
3. Import myip project
4. Once deployed, visit app using Vercel's links which it will be emailed to you.
5. 
6. You can add your own domain as well 

Add Your Own Domain for Vercel Project

You can also add your own domain into your project. You will get invalid configuration errors if you did not set up cname record or a record firstL

Cloudflare configuration, Proxy Status has to be DNS Only:

Now we can get this app working by browsing to https://ip.51sec.eu.org/api

The reason for api folder is to let Vercel python to run your script at api page. Basically "the only requirement is to create an api directory at the root of your project directory, placing your Serverless Functions inside" based on Vercel documentation. 

YouTube