https://github.com/wpcodevo/nextjs-flask-framework

In this article, you will learn how to integrate a Flask API project with Next.js and deploy them on Vercel.
https://github.com/wpcodevo/nextjs-flask-framework

flask flask-api flask-restful nextjs vercel vercel-deployment vercel-serverless-functions

Last synced: 8 months ago
JSON representation

In this article, you will learn how to integrate a Flask API project with Next.js and deploy them on Vercel.

• Host: GitHub
• URL: https://github.com/wpcodevo/nextjs-flask-framework
• Owner: wpcodevo
• Created: 2023-06-03T20:14:05.000Z (over 2 years ago)
• Default Branch: main
• Last Pushed: 2023-06-06T08:32:22.000Z (over 2 years ago)
• Last Synced: 2025-03-27T09:11:34.521Z (9 months ago)
• Topics: flask, flask-api, flask-restful, nextjs, vercel, vercel-deployment, vercel-serverless-functions
• Language: TypeScript
• Homepage: https://nextjs-flask-framework.vercel.app
• Size: 54.7 KB
• Stars: 46
• Watchers: 2
• Forks: 25
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

          
# How to Integrate Flask Framework with Next.js

In this article, you will learn how to integrate a Flask API project with Next.js and deploy them on Vercel. Traditionally, Vercel primarily supported a Node.js serverless runtime, which required writing API logic in JavaScript or TypeScript. However, Vercel has recently introduced support for other runtimes, including Golang, Ruby, Node.js, and Python.

![How to Integrate Flask Framework with Next.js](https://codevoweb.com/wp-content/uploads/2023/06/How-to-Integrate-Flask-Framework-with-Next.js.webp)

## Topics Covered

- Running the Flask and Next.js Projects

- Setting up the Next.js and Flask Projects

    - Setting up the Next.js Project

    - Setting up the Flask Project

    - Forwarding Requests to the Flask App

    - Testing the Projects in the Development Environment

- Deploying the Projects to Vercel

- Building a Todo List CRUD API with Flask

- Building the Todo List Frontend with Next.js

    - Making HTTP Requests to the Flask Server

    - Creating the Todo List Form Component

    - Creating the Todo Item Component

    - Displaying the Components in a Page File

- Redeploying the Project to Vercel

- Conclusion

Read the entire article here: [https://codevoweb.com/how-to-integrate-flask-framework-with-nextjs/](https://codevoweb.com/how-to-integrate-flask-framework-with-nextjs/)