How to deploy Next.JS with Flask the easy way

Next.js and Flask are two popular web frameworks. While each of them can work on their own there are good reasons why you would like to combine them. I recently did on gym.realfeedback.app the best place to get feedback on gym exercises by professional coaches.

The obvious reason to use Next.js is for serverside rendering of a React application in order to get all the benefits like instant loading time and better SEO capabilities compared to a standard React application.

The reason to use Flask is if you already have experience using if you simply like using Python on the backend side, like data processing.

If you use Flask you most likely run it in uwsgi with Nginx. Here we will configure nginx in way to forward any frontend calls to a Node.js instance running Next.js wheres the backend is forwarded to Flask.

For this we need to adapt the server section of our nginx.conf file a follows:

server section from nginx.conf

With this the frontend calls are forwarded to an instance of Next.js running port 3000.

Calls to /api however, like form submission or uplaods are handled by Flask.

With this we have a working configuration that combines Next.js with Flask.

If this guide has been helpful to me, don’t forget to leave a comment or a clap.

--

--

--

Writing on SaaS entrepreneurship, building a SaaS business

Love podcasts or audiobooks? Learn on the go with our new app.

Recommended from Medium

JavaScript knowledge helps you to learn about React.js

Let’s learn about Koa.js.

12 Great Resources from my Journey in React

Javascript 30: 808s + JS

Getting started with React Three Fiber.

A Coding Writer’s Guide: A Simple Explanation to ‘this’ in JavaScript

3D Secure 2.0 card payments with Braintree

Principles of Redux and React/Redux

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Alexander Hupfer

Alexander Hupfer

Writing on SaaS entrepreneurship, building a SaaS business

More from Medium

Setting up a simple standard Knex/Express RESTful API with PostgreSQL

Deploying Applications for Free on Heroku

Read the User’s IP address in JavaScript

Create events on Google calendar using Google Calendar API in Node.js