keeplearningandtrying/full-stack-auth

Full-Stack Authentication with Vue.js, Spring Boot, and Spring Security

I have been building a lot of tutorials on how to get started with Spring Security. In almost all of these tutorials, I have focused on the backend with Spring Boot and Spring Security.

• Spring Security JWT
• Spring Security JWT - Username & Password
• Spring Security CORS
• Spring Security JDBC

I have not really talked about the frontend. In this tutorial, I will show you how to build a full-stack application with Spring Boot, Spring Security, and Vue.js. The same concepts would apply no matter what frontend framework you are using.

If you're interested in the video version of this tutorial, reach out and let me know!

Getting Started

You should be familiar with the following technologies:

• Backend:
  • Spring Boot
  • Java 17
  • Spring Web
  • Spring Security
• Frontend:
  • Vue 3
  • Vite
  • TypeScript
  • Pinia
  • Vue Router
  • Tailwind CSS

Prerequisites

• Node.js version 16.0 or higher
• Java 17 or higher

Running the application

To run the application, you need to start the backend and the frontend. You can do this by running each application in a separate terminal.

cd frontend
npm install
npm run dev

cd backend
./mvnw spring-boot:run

You can run both applications at once by using the script run.sh in the root directory.