Skip to content
Alexander Owren Elton edited this page Apr 3, 2025 · 1 revision

Project Wiki

Overview

Introduction

Provide a brief overview of your full-stack application. Describe its purpose, functionality, and high-level architecture.

Example: This project is a full-stack web application built using Vue.js for the front-end, Spring Boot for the back-end, MySQL for the database, and Docker for containerization. The application allows users to manage their tasks, create projects, and collaborate with other users.

Features

  • User registration and authentication
  • Task and project management
  • Real-time notifications
  • Admin dashboard for managing users and projects

Tech Stack

  • Frontend: Vue.js
  • Backend: Spring Boot
  • Database: MySQL
  • Containerization: Docker
  • Build tools: Maven (for Spring Boot), npm (for Vue.js)

Getting Started

Prerequisites

Before you begin, make sure you have the following installed:

  • Docker
  • Java (JDK 11 or higher)
  • Node.js (v14 or higher)
  • MySQL (or use Dockerized MySQL)

Installation

  1. Clone the repository:

    git clone https://github.com/yourusername/yourproject.git
    cd yourproject
  2. Frontend (Vue.js):

    1. Go to the frontend folder:
      cd frontend
    2. Install dependencies:
      npm install
  3. Backend (Spring Boot):

    1. Go to the backend folder:
      cd backend
    2. Build the backend with Maven:
      mvn clean install
  4. Database (MySQL):

    • You can use the MySQL instance provided in Docker, or you can install MySQL locally.
    • If using Docker, run the following to start the database container:
      docker-compose up -d mysql

Configuration

MySQL Configuration

  1. Create a src/main/resources/application.properties file in the backend project and configure the database connection:

    spring.datasource.url=jdbc:mysql://localhost:3306/yourdb
    spring.datasource.username=root
    spring.datasource.password=rootpassword
    spring.datasource.driver-class-name=com.mysql.cj.jdbc.Driver
  2. Alternatively, if using Docker for both backend and database, use the following in docker-compose.yml.

Docker Configuration

The project includes a docker-compose.yml file to run the application in containers.

  1. Docker Compose:

    • To start the application in Docker containers (frontend, backend, and MySQL):
      docker-compose up --build
  2. This will start the following services:

    • Frontend: Vue.js app
    • Backend: Spring Boot API
    • Database: MySQL

Usage

Running the Project

  1. Frontend: After installing dependencies, you can run the Vue.js application:
    npm run serve
    

The app will be available at http://localhost:8080.

  1. Backend: If running Spring Boot separately (not via Docker), use:
    mvn spring-boot:run
    

The backend will be available at http://localhost:8081.

Access the Application: Open your browser and go to http://localhost:8080 to access the frontend.

API Documentation

Authentication

POST /api/auth/login: Logs in a user and returns a JWT token.

POST /api/auth/register: Registers a new user.

User Endpoints

GET /api/users: Retrieve all users.

GET /api/users/{id}: Retrieve a user by ID.

PUT /api/users/{id}: Update user details.

Task Endpoints

GET /api/tasks: Retrieve all tasks.

POST /api/tasks: Create a new task.

PUT /api/tasks/{id}: Update task details.

DELETE /api/tasks/{id}: Delete a task.

Docker Setup

Running the Application with Docker

  1. Ensure you have Docker installed and running.

  2. Run the following command to start all services:

docker-compose up --build

This will start the backend, frontend, and database in their respective containers.