Vue.js + Spring Boot + MySQL Full-Stack Boilerplate

A modern, production-ready boilerplate for full-stack web applications using Vue.js 3 (with TypeScript) for the frontend, Spring Boot for the backend API, and MySQL for the database.

Features

• Frontend: Vue.js 3 with TypeScript, Vite for fast development
• Backend: Spring Boot with Java
• Database: MySQL
• Authentication: JWT-based authentication
• File Upload: Support for file uploads
• RESTful API: Well-structured API endpoints

Project Structure

.
├── client/             # Vue.js frontend
├── server/             # Spring Boot backend
└── uploads/            # Uploaded files storage

Prerequisites

• Node.js (v14+)
• Java JDK 11+
• MySQL
• Maven

Getting Started

Setting up the Database

1. Create a MySQL database
2. Update the database configuration in server/src/main/resources/application.properties

Running the Backend

cd server
./mvnw spring-boot:run

The backend will be available at http://localhost:4001

Running the Frontend

cd client
npm install
npm run dev

The frontend will be available at http://localhost:4000

Deployment

Backend

Build the JAR file:

cd server
./mvnw clean package

Run the JAR file:

java -jar target/server-0.0.1-SNAPSHOT.jar

Frontend

Build for production:

cd client
npm run build

The build artifacts will be stored in the client/dist/ directory.

License

MIT

Contributing

Contributions are welcome! Please feel free to submit a Pull Request.