Getting Started

FlowInquiry front-end uses NextJs framework to develop its UI.

Get the latest sources from GitHub

The source code for FlowInquiry’s front-end is available at: https://github.com/flowinquiry/flowinquiry/tree/main/apps/frontend

You can also clone the repository to your local machine using the command below and navigate to the frontend directory:


git clone https://github.com/flowinquiry/flowinquiry.git
cd flowinquiry/apps/front-end

Development

Folders organization

public contains static assets, such as files and images, served by Next.js
src the FlowInquiry’s frontend source code

Configure the application

To run the FlowInquiry frontend, users need to provide their input in the local configuration file .env.local. To do that you need to execute scripts in the bash environments to create the .env.local file.

Checking environments

FlowInquiry’s front-end requires Node and pnpm to be installed on your machine. You can run the command pnpm check-env in the flowinquiry root folder to verify if your machine is set up to work with FlowInquiry


    ➜  flowinquiry ✗ pnpm check-env
 
    > flowinquiry@0.0.1 check-env flowinquiry
    > tools/check-env.sh
 
    🔍 Starting environment check...
 
    ⚙️  Backend Requirements
 
    🔍 Checking Java version...
    ✅ Java version 21 detected.
 
    🔍 Checking Docker...
    ✅ Docker is installed and running.
 
    -----------------------------
 
    🎨 Frontend Requirements
 
    🔍 Checking Node.js version...
    ✅ Node.js version v20.18.1 detected.
 
    🔍 Checking pnpm version...
    ✅ pnpm version: 10.6.5
 
    =============================
    📋 Summary
    =============================
    ✅ Backend environment is properly configured.
 
    ✅ Frontend environment is properly configured.
 
    🌱 All environment checks passed!

Create the local configuration file `.env.local`

Run the command pnpm frontend:setup in the flowinquiry’s root folder


➜  flowinquiry✗ pnpm frontend:setup
 
> flowinquiry@0.0.1 frontend:setup flowinquiry
> bash tools/setup/frontend-env.sh
 
Creating an empty apps/frontend/.env.local...
Enter the FlowInquiry back-end server URL address (e.g., http://localhost or http://localhost:8080): http://localhost:8080
Appended output of auth secret to flowinquiry/apps/frontend/.env.local.
Initialization complete.

Run in dev mode

You can launch the nextjs development server by running pnpm frontend:dev in the flowinquiry’s root folder

it will start the FlowInquiry frontend development server at the default port 3000


➜  flowinquiry ✗ pnpm frontend:dev
> flowinquiry@0.0.1 frontend:dev flowinquiry
> turbo run dev --filter=flowinquiry-frontend
turbo 2.4.4
 
• Packages in scope: flowinquiry-frontend
• Running dev in 1 packages
• Remote caching disabled
flowinquiry-frontend:dev: cache bypass, force executing dd479309225827e8
flowinquiry-frontend:dev:
flowinquiry-frontend:dev:
flowinquiry-frontend:dev: > flowinquiry-frontend@0.1.0 dev flowinquiry/apps/frontend
flowinquiry-frontend:dev: > next dev
flowinquiry-frontend:dev:
flowinquiry-frontend:dev:    ▲ Next.js 15.2.4
flowinquiry-frontend:dev:    - Local:        http://localhost:3000
flowinquiry-frontend:dev:    - Network:      http://192.168.0.78:3000
flowinquiry-frontend:dev:    - Environments: .env.local
flowinquiry-frontend:dev:
flowinquiry-frontend:dev:  ✓ Starting...
flowinquiry-frontend:dev:  ✓ Ready in 12.1s

️🚫

Make sure you run the back-end server before access the front-end. Check the section Run application to know how to start the FlowInquiry server

Open the browser, and access to the address http://localhost:3000. Use the default the either following credentials:

Administrator:
- Username: admin@flowinquiry.io
- Password: admin
User:
- Username: user@flowinquiry.io
- Password: user1234