Progyssey Traineeship Program

Welcome to the Progyssey Traineeship Program! This project serves as the web application for managing applications to the Progyssey Traineeship Program, where aspiring IT professionals can apply for the program, learn, and grow in the tech industry.

Features

• Landing Page: Introduction to the program and resources for prospective trainees.
• Application Form: Users can submit their applications via a form.
• Listmonk Integration: Form submissions are sent to Listmonk for managing mailing lists.
• Admin Notifications (SMTP): After each signup, an admin notification email is sent to recipients you configure via SMTP, containing the submitted form details (name, email, message).
• Static File Serving: Static files such as images, stylesheets, and scripts are served from a dedicated public directory.
• Server and Route Handling: Routes are organized into separate files to keep the application modular.

Project Structure

/Progodyssey
├── /public
│   ├── /images           # Images directory
│   ├── index.html        # Main landing page
│   ├── styles.css        # Stylesheet for the landing page
│   ├── index.js          # JavaScript for client-side interactions
├── /src
│   ├── envValidator.js   # Validates environment variables
│   ├── formHandler.js    # Handles form submission to Listmonk
│   ├── routes.js         # Contains route definitions
│   └── server.js         # Main server setup
├── .env                  # Environment variables for configuration
├── .gitignore            # Git ignore file
├── .dockerignore         # Docker ignore file
├── .gitattributes        # Git attributes file
├── Dockerfile            # Docker build instructions
├── package.json          # Node.js project configuration
├── README.md             # Project documentation

Prerequisites

• Node.js: Make sure you have Node.js (v14 or higher) installed on your system.
• Listmonk Account: You need a Listmonk account to manage the mailing lists.

Setup

1. Clone the repository

git clone git@forge.ftt.gmbh:Progyssey/progyssey-web.git

2. Install Dependencies

Run the following command to install the necessary dependencies:

npm install

3. Configure Environment Variables

Create a .env file at the root of the project. This file will store sensitive information like your Listmonk API URL and your API key.

Example .env file:

LISTMONK_URL=https://your-listmonk-instance.com/api/subscribers
LISTMONK_USERNAME=listmonk-username
LISTMONK_PASSWORD=listmonk-password
LIST_ID=listmonk-listid
LISTMONK_BASE_URL=https://your-listmonk-instance.com/api
PRESET_CAMPAIGN_ID=1                # Example: 1 (numeric ID of your welcome campaign/template in Listmonk)
TEMPLATE_ID_WEEK_1=101              # Example: 101 (numeric ID of week 1 email template)
TEMPLATE_ID_WEEK_2=102              # Example: 102 (numeric ID of week 2 email template)
TEMPLATE_ID_WEEK_3=103              # Example: 103 (numeric ID of week 3 email template)
TEMPLATE_ID_WEEK_4=104              # Example: 104 (numeric ID of week 4 email template)
PORT=3002

# Admin SMTP notification settings
ADMIN_NOTIFY_RECIPIENTS=janek@melonion.me,ryan@progodyssey.com
SMTP_HOST=smtp.example.com
SMTP_PORT=587
SMTP_SECURE=false                   # true for port 465, else usually false
SMTP_USER=your-smtp-username        # optional if server allows unauthenticated relay
SMTP_PASS=your-smtp-password        # optional if server allows unauthenticated relay
SMTP_FROM="ProgOdyssey" <no-reply@progodyssey.com>

4. Run the Development Server

To start the development server, run:

npm start

The server will be available at http://localhost:3002.

5. Testing the Form Submission

• Open the landing page in a browser (http://localhost:3002).
• Fill in the application form and submit.
• Check your Listmonk instance to confirm that the form submission data is received and processed.
• Check your SMTP logs/inbox to confirm that an admin notification email was sent to the configured ADMIN_NOTIFY_RECIPIENTS.

Notes on Admin Notifications

• Admin notification emails are sent directly via SMTP and do not rely on Listmonk templates.
• Set ADMIN_NOTIFY_RECIPIENTS as a comma or semicolon-separated list of emails.
• If SMTP_HOST or ADMIN_NOTIFY_RECIPIENTS are not set, admin notifications are skipped with a warning in logs.

Building and Running with Docker

1. Build the Docker Image

Run the following command to build the Docker image:

docker build -t progodyssey-app .

2. Run the Docker Container

To start the container, use:

docker run -d --name progodyssey -p 3002:3002 --env-file .env progodyssey-app

This maps the container's port 3002 to the host system's port 3002 and uses the .env file for environment variables. The application will be accessible at http://localhost:3002.

3. Using Docker Compose (Optional)

If you prefer to use Docker Compose, ensure you have a docker-compose.yml file in your project directory. Then, run:

docker compose up -d

This will automatically build and start the container based on the configuration in the docker-compose.yml file.

4. Stopping the Docker Container

To stop the running container, use:

docker stop progodyssey

To remove the container:

docker rm progodyssey

Routes

• GET /: Serves the landing page (index.html).
• POST /submit: Handles form submissions. Data from the form is sent to Listmonk via its API.

Contributing

If you'd like to contribute to the project, follow these steps:

1. Fork the repository
2. Create a new branch (git checkout -b feature-name)
3. Make your changes and commit them (git commit -am 'Add new feature')
4. Push to your forked repository (git push origin feature-name)
5. Submit a pull request