In this tutorial, we will learn how to build a full stack Django + Vue.js example with a CRUD Application. The back-end server uses Django with Rest Framework for REST APIs and interacts with MySQL/PostgreSQL/MongoDB database. Front-end side is made with Vue, Vue Router, Axios & Bootstrap.
In this tutorial, I will show you way to use Vuetify to build File Upload example with Axios and Multipart File for making HTTP requests. You will also know how to add progress bar, show response message and display list of files’ information (with url).
– Vuetify Image Upload with Preview example
– Vuetify Multiple Images Upload example
– Vuetify data-table example with a CRUD App | v-data-table
– Vue.js JWT Authentication with Vuex and Vue Router
Using Bootstrap: Vue File Upload example with Axios & Bootstrap
In this React tutorial, I will show you way to build React Hooks File Upload example using Axios and Multipart File for making HTTP requests, Bootstrap for progress bar and display list of files’ information (with download url).
– React File Upload/Download example with Spring Boot Rest Api
– React Hooks CRUD example with Axios and Web API
– React Form Validation with Hooks example
– React Hooks: JWT Authentication (without Redux) example
– React + Redux: JWT Authentication example
Multiple Files Upload:
React Hooks Multiple File upload example with Axios & Progress Bar
Using React Components instead:
React File Upload with Axios and Progress Bar to Rest API
In this tutorial, I will show you way to build React.js File Upload example with Spring Boot Rest APIs. The React App uses Axios and Multipart File for making HTTP requests, Bootstrap for progress bar. You also have a display list of files’ information (with download url).
More Fullstack Practice:
– React + Spring Boot: Pagination example
– Spring Boot + React: CRUD example
– Spring Boot + React: JWT Authentication with Spring Security
Run both projects in one place:
How to integrate React.js with Spring Boot