forked from Abdulbari/sgeUpdated
109 lines
2.8 KiB
Markdown
109 lines
2.8 KiB
Markdown
# SGE System Frontend
|
||
|
||
## Overview
|
||
|
||
The frontend of the SGE System is a modern web application built with **React**, providing an interactive and user-friendly interface. It communicates with the backend API to deliver a seamless experience for users.
|
||
|
||
## Technology Stack
|
||
|
||
- **React** – UI library
|
||
- **React Router** – Routing
|
||
- **i18n** – Internationalization
|
||
- **Docker** – Containerization
|
||
|
||
## Repository Structure
|
||
|
||
```
|
||
SGE/
|
||
├── sge-backend/ # Backend source code
|
||
├── sge-frontend/ # Frontend source code
|
||
├── config.conf # Centralized configuration file (see below)
|
||
├── docker-compose.yml # Docker Compose file (see below)
|
||
```
|
||
|
||
## Setup and Installation
|
||
|
||
### Prerequisites
|
||
|
||
- **Node.js** (v14.0.0 required) and npm
|
||
- **Docker** (for containerized deployment)
|
||
|
||
#### Node.js Version Management
|
||
|
||
If you need to switch Node versions, use nvm:
|
||
|
||
```sh
|
||
nvm install v14.0.0
|
||
nvm use v14.0.0
|
||
unset NODE_OPTIONS
|
||
```
|
||
|
||
### Frontend Setup
|
||
|
||
#### Local Development
|
||
|
||
1. Clone the repository and navigate to the frontend directory:
|
||
|
||
```sh
|
||
git clone <repository-url>
|
||
cd SGE/sge-frontend
|
||
```
|
||
|
||
2. Ensure `config.conf` is in the project root (`SGE/`).
|
||
You can either:
|
||
|
||
- Manually set environment variables from `config.conf`
|
||
- Or configure your IDE to load variables from `config.conf`
|
||
|
||
3. Install dependencies:
|
||
|
||
```sh
|
||
npm install
|
||
```
|
||
|
||
4. Start the development server:
|
||
```sh
|
||
npm start
|
||
```
|
||
|
||
#### Docker Deployment
|
||
|
||
1. Ensure both `config.conf` and `docker-compose.yml` are in the project root (`SGE/`).
|
||
2. From the root directory, build and run the frontend (and backend) using Docker:
|
||
```sh
|
||
docker-compose up --build
|
||
```
|
||
|
||
## Configuration Management
|
||
|
||
The SGE System uses a centralized `config.conf` file for all environment variables.
|
||
**Location:** Place `config.conf` in the root directory of your project, alongside `docker-compose.yml`.
|
||
|
||
This file contains environment variables for both backend and frontend components, including:
|
||
|
||
- API connection settings
|
||
- Mail configuration
|
||
- Application URLs
|
||
|
||
When running with Docker, environment variables are automatically loaded from `config.conf` via the `env_file` directive in `docker-compose.yml`.
|
||
|
||
For local development, you can either:
|
||
|
||
- Use the same `config.conf` file and manually set the environment variables
|
||
- Configure your IDE to load these variables from the file
|
||
|
||
Refer to the backend README for more details on configuration options and structure.
|
||
|
||
## Integration with Backend
|
||
|
||
The frontend expects the backend API to be available at the host and port specified in `config.conf` (`API_PROTOCOL`, `API_HOST`, `SERVER_PORT`).
|
||
Ensure both services are configured consistently.
|
||
|
||
## License
|
||
|
||
[Insert your license information here]
|
||
|
||
## CI/CD Testing v13
|
||
|
||
|