VikeEats is a web map application displaying all food outlets on the University of Victoria campus. This project was started under the University of Victoria Vikelabs Club to counteract the lack of a centralized information hub regarding the food options on campus: especially regarding dietary restrictions. It is built as a hybrid Next.js + Python app that uses Next.js as the frontend and Flask as the API backend.
npm installThen, run the development server:
npm run devIf this doesn't work run
npm install -g pnpmThe Python/Flask server is mapped into to Next.js app under /api/.
This is implemented using next.config.js rewrites to map any request to /api/:path* to the Flask API, which is hosted in the /api folder.
On localhost, the rewrite will be made to the 127.0.0.1:5328 port, which is where the Flask server is running.
In production, the Flask server is hosted as Python serverless functions on Vercel.
https://nextjs-flask-starter.vercel.app/
You can clone & deploy it to Vercel with one click:
You can clone & create this repo with the following command
npx create-next-app nextjs-flask --example "https://github.com/vercel/examples/tree/main/python/nextjs-flask"First, install the dependencies:
npm install
# or
yarn
# or
pnpm installThen, run the development server:
npm run dev
# or
yarn dev
# or
pnpm devOpen http://localhost:3000 with your browser to see the result.
The Flask server will be running on http://127.0.0.1:5328 – feel free to change the port in package.json (you'll also need to update it in next.config.js).
To learn more about Next.js, take a look at the following resources:
- Next.js Documentation - learn about Next.js features and API.
- Learn Next.js - an interactive Next.js tutorial.
- Flask Documentation - learn about Flask features and API.
You can check out the Next.js GitHub repository - your feedback and contributions are welcome!