Live code build of a Vue.js app with a Python FastAPI backend
Our website backend uses Python and FastAPI to serve and update sports team data. FastAPI uses PyDantic to model and validate our team data before hosting. Normally our API would be connected to a database, but the data just lives in memory. This means all changes will be reset between reloads.
To run our server, install the requirements and serve the app using uvicorn. Note: one line in this code requires Python 3.9+
cd backend/
pip install -r requirements.txt
uvicorn app:app --reloadOur website frontend uses Vue.js and Typescript to display and update our sports team data. Unlike most implementations of Django or Flask templating, a full Javascript front-end let's our web app be more responsive and update itself without page refreshes or using other tools like HTMX.
The code here contains a lot of starter template generated by the Vue CLI, but our quick data implementation can be found on the teams page that we added.
To run our client,you'll need to have Node installed first. Then install the requirements and serve using npm.
cd frontend/
npm install --include=dev
npm run serve