Vercel App Deploment Failure for Jinja Based Website

[goodbyekittyy]

Hi everyone, I am new to vercel.app!

This is the repository I tried to deploy: GitHub - GoodbyeKittyy/GoodbyeKittyy.github.io: Fully responsive personal portfolio single-page website, responsive for all devices, built using HTML, CSS, JavaScript and Python.

This is what happened:

Did I use the wrong Framework Preset? Do I need to change something in my repository?

I would greatly appreciate any help!

[pawlean (Pauline P. Narvas)]

Hi and welcome to the community, @goodbyekittyy!

The error you’re encountering indicates that Vercel is expecting a web application handler (either handler or app) to be defined in your main.py. The provided script appears to be generating a static HTML file, rather than running a web server.

To resolve this, you can use a simple web framework like Flask to serve your generated HTML.

You would need to specify the following in your requirements.txt:

Flask==2.1.1

Then you’d need to import Flask and define Flask App in you main.py. Something like:

from flask import Flask, render_template_string
app = Flask(__name__)

And create Flask Route to Serve HTML.

@app.route("/")
def index():

And serve the application with Flask.

if __name__ == "__main__":
    app.run(host='0.0.0.0', port=8000)

Full code example

from datetime import datetime
import toml  # type: ignore
from jinja2 import Environment, FileSystemLoader  # type: ignore
from flask import Flask, render_template_string

app = Flask(__name__)

class Portfolio:
    # (class definition remains the same)

portfolio = Portfolio()
env = Environment(loader=FileSystemLoader("src/jinja"))
env.filters["format_date"] = portfolio.format_date
template = env.get_template("index.jinja")

@app.route("/")
def index():
    about = portfolio.about()
    doing = portfolio.doing()
    social = portfolio.social()
    softskills = portfolio.softskills()
    technologies = portfolio.technologies()
    resume = portfolio.resume()
    projects = portfolio.projects()
    blog = portfolio.blog()
    categories = portfolio.categories()

    html_render = template.render(
        about=about,
        social=social,
        doing=doing,
        softskills=softskills,
        technologies=technologies,
        resume=resume,
        projects=projects,
        blog=blog,
        categories=categories,
    )
    return render_template_string(html_render)

if __name__ == "__main__":
    app.run(host='0.0.0.0', port=8000)

These changes convert the script from generating a static HTML file to serving the HTML via a Flask web application, allowing it to be deployed on Vercel.

I’ve also linked related documentation from Flask in case it’s helpful:

https://flask.palletsprojects.com/en/3.0.x/

[goodbyekittyy]

@pawlean Hello! Thank you for your helpful comment

I have one question about the host, 0.0.0.0 is just an example or it’s the default I should use? How can I find it if I have to change it?

[pawlean (Pauline P. Narvas)]

Oops, sorry! You can actually change that to just:

app.run()

You’d only specify that in development Vercel will handle these settings for you.

[goodbyekittyy]

@pawlean Hi there! Thanks for your help. I have managed to deploy it.

The website looks very weird and I am guessing it’s missing the css. Do you know what I need to change or include because of my Jinja usage?

Current Deployment: https://zy-resume.vercel.app/

What it should look like: https://goodbyekittyy.github.io/