Home > Software design >  Vercel - Deploy Flask Backend React Frontend
Vercel - Deploy Flask Backend React Frontend

Time:09-28

I have a webapp that has React frontend with a Flask backend. I want to deploy this application onto a tool called Vercel. Can someone point me to an example tutorial/setup/example Github Repository that accomplishes this task

CodePudding user response:

As I know, you can't deploy the Flask back-end on Vercel. I'm not familiar with Flusk, but I checked right now and you can deploy your Flusk back-end server on railway.app. Then hit from your front-end that you can deploy on Vercel.

CodePudding user response:

It took me a while to figure this out as well, even though Flask usage is technically "documented" in the official docs. You need something like this:

your_app_root/
└── api/
    ├── function1/
    │   └── index.py
    ├── function2/
    │   └── index.py
    └── index.py

#!index.py
from flask import Flask, Response

app = Flask(__name__)


@app.route("/", defaults={"path": ""})
@app.route("/<path:path>")
def catch_all(path):
    # Everything above this line should look the same for each 
    # index.py. Modify lines below this to have different logic
    # for different routes.
    return Response(
        "<h1>Flask</h1><p>You visited: /%s</p>" % (path), mimetype="text/html"
    )

Basically, each function is going to be a separate Flask app. So you cannot do any routes within the Flask api with @app.route. It needs to all be folder based because Vercel is doing the routing.

  • Related