Getting Started

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

Get the latest sources from GitHub

Access the latest source code for flowinquiry’s front-end at https://github.com/flowinquiry/flowinquiry-frontend

Development

Folders organization

public contains static assets, such as files and images, served by Next.js
scripts Includes useful scripts for validating environment settings, setting up project environment variables, and more
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. FlowInquiry offers two options for creating this configuration file:

Using Bash Scripts: Users can run provided Bash scripts, which prompt for inputs, validate the information, and then automatically generate the configuration file.
Editing a Template Manually: A template configuration file (.env.local.example) is provided, allowing users to manually edit and create their .env.local file. This option is recommended for Windows users who cannot run Bash scripts.

Creat config file by script

Checking environments

FlowInquiry’s front-end requires Node and pnpm to be installed on your machine. You can run the valid_checks.sh script located in the scripts folder to verify if your machine is set up to work with FlowInquiry


➜  FlowInquiry-frontend git:(main) scripts/valid_checks.sh
Running node_check.sh...
Node.js version: 20.14.0
Node.js version is 20.14.0, which is greater than or equal to 18.
node_check.sh succeeded.
Running pnpm_check.sh...
pnpm is installed.
pnpm version: 9.7.0
pnpm_check.sh succeeded.
Your environments settings satisfy FlowInquiry's conditions

Setup scripts

You will need to run the following scripts:

scripts/init_git_hooks.sh: Sets up a git hook to automatically format and check code logic each time you commit changes.
scripts/init_environments.sh: Create a new .env.local file, which is used by the Next.js application to read predefined environment variables

💡

You can run the scripts/all.sh script, which will check your environment settings and perform the necessary configurations, eliminating the need to run multiple scripts individually

Run in dev mode

Open the terminal and run the command


pnpm dev

it will launch the process to start the FlowInquiry front-end at the default port 3000


➜  flowinquiry-frontend git:(main) pnpm dev
 
> [email protected] dev ~/flowinquiry-frontend
> next dev
 
  ▲ Next.js xx.x.xx
  - Local:        http://localhost:3000
  - Environments: .env.local
 
 ✓ Starting...
 ✓ Ready in 1805ms

️🚫

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: [email protected]
- Password: admin
User:
- Username: [email protected]
- Password: user1234