chore: move backend to hono + typescript (#558)

* feat: setup secure presigned uploads and downloads

* clean up

* update lock

* Get presigned url finally working

* 557: Migrate backend to hono + ts

* chore: update Dockerfile and package.json for backend configuration

* add dev command

* remove unused packages

* Enhance backend API and frontend components for course management

- Updated CORS configuration in the backend to allow specific methods and headers.
- Refactored lesson download endpoint to use a new route for PDF downloads.
- Removed unused certificate download functionality from the lesson router.
- Updated frontend components to reflect changes in API endpoints and improve video upload functionality.
- Introduced new video upload component and adjusted video handling in lesson materials.
- Cleaned up unnecessary imports and optimized component structure for better performance.

* PR cleanups

* Enhance email configuration by adding SMTP_SENDER environment variable

- Updated docker-compose.yaml to include SMTP_SENDER.
- Modified Dockerfile to accept SMTP_SENDER as an argument.
- Updated environment schema in env.ts to define SMTP_SENDER as optional.
- Adjusted mail service to use SMTP_SENDER for the email 'from' field.
- Updated documentation to reflect the new SMTP_SENDER variable.

* Remove debug log statement from sendEmail function

---------

Co-authored-by: Iniubong Obonguko <iniubongobonguko2018@gmail.com>

apps/backend/src/utils/certificate.ts

@@ -0,0 +1,118 @@
+import type { TCertificateDownload } from '$src/types/course/lesson';
+import { getPdfBuffer } from '$src/utils/puppeteer';
+
+export interface CertificateData {
+  theme: string;
+  studentName: string;
+  courseName: string;
+  courseDescription: string;
+  orgLogoUrl: string;
+  orgName: string;
+  facilitator?: string;
+}
+
+export interface CertificateGenerationResult {
+  success: boolean;
+  buffer?: Buffer;
+  error?: string;
+}
+
+export const generateCertificate = async (data: TCertificateDownload): Promise<Buffer> => {
+  const html = generateCertificateHtml(data);
+  return getPdfBuffer(html);
+};
+
+function generateCertificateHtml(data: TCertificateDownload): string {
+  const { studentName, courseName, courseDescription, orgLogoUrl, orgName, facilitator } = data;
+
+  return `
+    <!DOCTYPE html>
+    <html>
+      <head>
+        <meta charset="utf-8">
+        <title>Certificate of Completion</title>
+        <style>
+          body {
+            font-family: 'Arial', sans-serif;
+            margin: 0;
+            padding: 0;
+            background-color: #f5f5f5;
+          }
+          .certificate {
+            width: 1123px;
+            height: 794px;
+            margin: 0 auto;
+            background-color: white;
+            position: relative;
+            box-shadow: 0 0 10px rgba(0,0,0,0.1);
+          }
+          .header {
+            text-align: center;
+            padding: 20px;
+          }
+          .logo {
+            max-width: 200px;
+            margin-bottom: 20px;
+          }
+          .title {
+            font-size: 36px;
+            color: #333;
+            margin-bottom: 10px;
+          }
+          .content {
+            text-align: center;
+            padding: 40px;
+          }
+          .student-name {
+            font-size: 48px;
+            color: #2c3e50;
+            margin-bottom: 20px;
+          }
+          .course-name {
+            font-size: 24px;
+            color: #34495e;
+            margin-bottom: 10px;
+          }
+          .description {
+            font-size: 18px;
+            color: #7f8c8d;
+            margin-bottom: 30px;
+          }
+          .footer {
+            position: absolute;
+            bottom: 40px;
+            width: 100%;
+            text-align: center;
+          }
+          .signature {
+            margin-top: 20px;
+          }
+          .date {
+            margin-top: 10px;
+            color: #95a5a6;
+          }
+        </style>
+      </head>
+      <body>
+        <div class="certificate">
+          <div class="header">
+            <img src="${orgLogoUrl}" alt="${orgName} Logo" class="logo">
+            <h1 class="title">Certificate of Completion</h1>
+          </div>
+          <div class="content">
+            <h2 class="student-name">${studentName}</h2>
+            <p class="course-name">${courseName}</p>
+            <p class="description">${courseDescription}</p>
+          </div>
+          <div class="footer">
+            <div class="signature">
+              <p>${facilitator || 'Course Facilitator'}</p>
+              <p>${orgName}</p>
+            </div>
+            <p class="date">${new Date().toLocaleDateString()}</p>
+          </div>
+        </div>
+      </body>
+    </html>
+  `;
+}