A simple file uploading web service in Vue.js, Axios and Flask

Deprecation notice this was a simple toy project I threw together to show some API and client-server concepts to the graduating students I was supervising in 2018/2019. This is now probably superseded by more recent bundling tools (erm.. webpack) and technologies. Keep that in mind and take a look at more modern /updated webdev practises.

Deploy

Supposing you have NodeJS, npm, Python3 and pip3 installed:

# Install npm dependencies
npm install

# Install python3 dependencies
pip3 install -r requirements.txt

# Start Flask backend server
python3 app.py

# Serve with hot reload at localhost:8080
npm run dev

Backend

Flask, sqlite3 as database.

Frontend

Vue.js, the CSS framework is bootstrap-vue (Bootstrap 4). Requests are handled with Axios.

Build Setup

# serve with hot reload at localhost:8080
npm run dev

# build for production with minification
npm run build

# build for production and view the bundle analyzer report
npm run build --report

# run unit tests
npm run unit

# run e2e tests
npm run e2e

# run all tests
npm test

Documentation Resources

• VueJS webpack template guide
• docs for vue-loader

Thanks to Cristian Baldi for its Vue wisdom.