LeapAheadX

LeapAheadX is a form management system to digitalize the form management processes of the client company Quantum Leap.

Features include:

• Versatile form fields: Nine different field types, including phone number, address, email, and checkboxes, making it easy to collect the data you need.
• Robust security: Secured with Spring Security authentication, ensuring that only authorized users can access sensitive information.
• Streamlined workflows: All-in-one dashboard provides easy access for admins and vendors to view, edit, and submit forms in a seamless workflow.
• User-friendly customization: Drag-and-drop workflow and form builders makes customization easy, allowing you to create workflows from created forms quickly.
• Efficient validation: Form validation and approval, with the added function of saving partially edited forms, streamlining your workflow.
• Automated emailing: Sends automatic email notifications for form submissions and reminders, making it easy to keep track of submissions.
• Automated scoring: For forms enabled with evaluation ratings, the system automatically calculates scores, saving you time and effort.
• PDF generation: Generate printouts in PDF format, making it easy to share information with others.

Table of Contents

• Tech Stack
• UML Diagram
• Database Entity-Relationship Diagram
• Project Setup
• Screenshots

Tech Stack

Frontend

• Sass
• Bootstrap
• Vue.js
• Vite

Backend

• Spring Boot MVC
• MySQL

UML Diagram

Click the image for the expanded view

Database Entity-Relationship Diagram

Click the image for the expanded view

Project Setup

Pre-requisites

• JDK 17+
• Maven 3+
• Docker
• MySQL
• WAMP
• Spring Boot 3.0
• Spring Security
• bcrypt

Pre-installation

Backend (located in leapaheadx-backend folder)

During development it is recommended to use the profile local. In IntelliJ, -Dspring.profiles.active=local can be added in the VM options of the Run Configuration after enabling this property in "Modify options".
Update your local database connection in application.yml or create your own application-local.yml file to override settings for development.
After starting the application it is accessible under localhost:8080.

Installation

Clone the git repository:

$ git clone git@github.com:xavierkoo/leapaheadx.git

Frontend

Install dependencies via

npm install

Compile and Hot-Reload for Development

npm run dev

Compile and Minify for Production

npm run build

Lint with ESLint

npm run lint

Backend

Local:

1. Make sure MAMP/WAMP is on
2. Run create.sql
3. Compile and Run

build.sh

4. Run data_v2.sql

Docker:

1. Navigate to leapaheadx-backend folder
2. First build the image:

$ docker-compose build

3. When ready, run it:

$ docker-compose up

4. Once “leapahead-backend” & “leapahead-db” is up. Run the “population” container to populate mock data

The server-side application base URL is http://localhost:8080

Test Accounts

Screenshots

Dashboard

Form Builder

Workflow Builder