fix: add BackendPort configuration to support dynamic backend port setting

.gitea/workflows/deploy.yml

@@ -10,6 +10,7 @@ jobs:
     runs-on: website-deploy-runner
     env:
       DOTNET_INSTALL_DIR: "$HOME/.dotnet"
+      NEXT_TELEMETRY_DISABLED: '1'
 
     steps:
       - name: Checkout Code
@@ -19,14 +20,35 @@ jobs:
         uses: actions/setup-dotnet@v4
         with:
           dotnet-version: '8.0.x'
-          cache: true
+
-          dotnet-solution: 'backend/JoaoLoureiro.Portfolio.slnx'
+      - name: Cache NuGet packages
+        uses: actions/cache@v4
+        with:
+          path: ~/.nuget/packages
+          key: ${{ runner.os }}-nuget-${{ hashFiles('**/packages.lock.json') }}
+          restore-keys: |
+            ${{ runner.os }}-nuget-
+
+      - name: Cache Node.js modules
+        uses: actions/cache@v4
+        with:
+          path: frontend/node_modules
+          key: ${{ runner.os }}-node-${{ hashFiles('**/package-lock.json') }}
+          restore-keys: |
+            ${{ runner.os }}-node-
+
+      - name: Cache Next.js build cache
+        uses: actions/cache@v4
+        with:
+          path: frontend/.next/cache
+          key: ${{ runner.os }}-next-cache-${{ hashFiles('frontend/package-lock.json') }}-${{ env.NODE_VERSION || 'node' }}
+          restore-keys: |
+            ${{ runner.os }}-next-cache-
 
       - name: Create Backend appsettings.Production.json
         run: |
           echo "Creating backend appsettings.Production.json file..."
-          # This creates the JSON file by mapping your Gitea secrets/vars
+          mkdir -p backend
-          # to the structure you provided.
           cat <<EOF > backend/appsettings.Production.json
           {
             "SmtpSettings": {
@@ -37,36 +59,34 @@ jobs:
               "FromEmail": "${{ vars.SMTP_FROM_EMAIL }}",
               "ReceivingEmail": "${{ vars.YOUR_RECEIVING_EMAIL }}"
             },
-            "CorsOrigins": "${{ vars.FRONTEND_URL }}"
+            "CorsOrigins": "${{ vars.FRONTEND_URL }}",
+            "BackendPort": "${{ vars.BACKEND_PORT }}"
           }
           EOF
 
       - name: Create Frontend .env.local file
         run: |
           echo "Creating frontend .env.local file..."
-          cd frontend
+          mkdir -p frontend
-          echo "NEXT_PUBLIC_GITHUB_URL=${{ vars.NEXT_PUBLIC_GITHUB_URL }}" >> .env.local
+          cat <<EOF > frontend/.env.local
-          echo "NEXT_PUBLIC_LINKEDIN_URL=${{ vars.NEXT_PUBLIC_LINKEDIN_URL }}" >> .env.local
+          NEXT_PUBLIC_GITHUB_URL=${{ vars.NEXT_PUBLIC_GITHUB_URL }}
-
+          NEXT_PUBLIC_LINKEDIN_URL=${{ vars.NEXT_PUBLIC_LINKEDIN_URL }}
-      - name: Cache Dependencies
+          EOF
-        uses: actions/cache@v4
-        with:
-          path: |
-            ~/.nuget/packages
-            frontend/node_modules
-            frontend/.next/cache
-          key: ${{ runner.os }}-${{ hashFiles('**/*.csproj') }}-${{ hashFiles('**/package-lock.json') }}
-          restore-keys: |
-            ${{ runner.os }}-
 
       - name: Install Dependencies and Build
         run: |
           echo "Restoring backend NuGet packages..."
-          dotnet restore backend
+          dotnet restore backend/JoaoLoureiro.Portfolio.Api/JoaoLoureiro.Portfolio.Api.csproj
 
           echo "Building and publishing backend..."
-          # This compiles the app and places the output in the 'publish' folder
+          dotnet publish backend/JoaoLoureiro.Portfolio.Api/JoaoLoureiro.Portfolio.Api.csproj --configuration Release --output ./publish
-          dotnet publish backend --configuration Release --output ./publish
+
+          echo "Copying backend appsettings to published output..."
+          # ensure the production appsettings travels with the published output so the deployed app reads it
+          if [ -f backend/appsettings.Production.json ]; then
+            mkdir -p ./publish
+            cp backend/appsettings.Production.json ./publish/
+          fi
 
           echo "Installing frontend dependencies..."
           cd frontend && npm install
@@ -76,18 +96,29 @@ jobs:
 
       - name: Sync Files to Production Directory
         run: |
-          # Sync the published backend from the './publish' directory
+          echo "Syncing files to production directory..."
-          rsync -a --delete ./publish/ /var/www/website.joaoloureiro.dev.br/
+          rsync -auv --itemize-changes --progress ./publish/ /var/www/website.joaoloureiro.dev.br/backend/
+          echo "rsync publish exit: $?"
 
-          # Sync the built frontend from the 'frontend' directory
+          rsync -auv --itemize-changes --progress ./frontend/.next/ /var/www/website.joaoloureiro.dev.br/frontend/.next/
-          rsync -a --delete ./frontend/.next /var/www/website.joaoloureiro.dev.br/
+          echo "rsync .next exit: $?"
-          rsync -a --delete ./frontend/public /var/www/website.joaoloureiro.dev.br/
+
-          rsync -a ./frontend/package.json /var/www/website.joaoloureiro.dev.br/
+          rsync -auv --itemize-changes --progress ./frontend/public/ /var/www/website.joaoloureiro.dev.br/frontend/public/
-          rsync -a ./frontend/ecosystem.config.js /var/www/website.joaoloureiro.dev.br/
+          echo "rsync public exit: $?"
+
+          rsync -av --itemize-changes --progress ./frontend/package.json /var/www/website.joaoloureiro.dev.br/frontend/
+          echo "rsync package.json exit: $?"
+
+          # copy both frontend and backend ecosystem files into the deployment root so PM2 can find them
+          rsync -av --itemize-changes --progress ./frontend/ecosystem.config.json /var/www/website.joaoloureiro.dev.br/frontend/
+          echo "rsync frontend ecosystem exit: $?"
+
+          rsync -av --itemize-changes --progress ./backend/ecosystem.config.json /var/www/website.joaoloureiro.dev.br/backend/
+          echo "rsync backend ecosystem exit: $?"
 
       - name: Restart Applications with PM2
+        env:
+          DEPLOY_PATH: ${{ vars.DEPLOY_PATH }}
         run: |
-          # This command on your server should handle restarting both processes
+          echo "Restarting applications with PM2..."
-          # Ensure your PM2 ecosystem file now has entries for both the .NET app
-          # and the Next.js app.
           restart-portfolio

backend/JoaoLoureiro.Portfolio.Api/Program.cs

@@ -15,6 +15,11 @@ using System.Net;
 
 var builder = WebApplication.CreateBuilder(args);
 
+if (builder.Configuration["BackendPort"] is { Length: > 0 } port && ushort.TryParse(port, out _))
+{
+    builder.WebHost.UseUrls($"http://0.0.0.0:{port}");
+}
+
 builder.Host.UseSerilog((context, config) => config.ReadFrom.Configuration(context.Configuration));
 
 builder.Services.AddProblemDetails();

backend/ecosystem.config.json

@@ -2,7 +2,8 @@
   "apps": [{
     "name": "portfolio-backend",
     "script": "dotnet",
-    "args": "JoaoLoureiro.Portfolio.Api/bin/Release/net8.0/JoaoLoureiro.Portfolio.Api.dll",
+    "args": "JoaoLoureiro.Portfolio.Api.dll",
+    "cwd": "/var/www/website.joaoloureiro.dev.br/backend",
     "instances": 1,
     "autorestart": true,
     "watch": false,

frontend/src/locales/en.json

@@ -23,7 +23,7 @@
   "about": {
     "title": "About Me",
     "paragraph1": "I am a Full Stack Developer driven by a passion for building, automating, and scaling robust applications. My journey into technology began with a desire to understand how complex systems work, and it has evolved into a career dedicated to crafting elegant, high-performance solutions.",
-    "paragraph2": "With a strong foundation in the .NET and JavaScript ecosystems, I specialize in creating modern web applications using technologies like .NET, Angular, Next.js, React, and Node.js. However, my curiosity extends beyond code. As you can see from my Homelab project, I am deeply engaged with the full development lifecycle, including CI/CD, containerization with Docker, and infrastructure management.",
+    "paragraph2": "With a strong foundation in the .NET and JavaScript ecosystems, I specialize in creating modern web applications using technologies like .NET, Angular, Next.js, and React. However, my curiosity extends beyond code. As you can see from my Homelab project, I am deeply engaged with the full development lifecycle, including CI/CD, containerization with Docker, and infrastructure management.",
     "paragraph3": "I thrive on challenges and am constantly exploring new technologies, from database administration with MariaDB and Redis to workflow automation with N8N and message queuing with RabbitMQ. This hands-on approach to DevOps and self-hosting allows me to build not just features, but resilient and scalable systems."
   },
   "skills": {
@@ -36,14 +36,14 @@
   "projects": {
     "title": "Projects I've Built",
     "project_1_title": "Personal Portfolio",
-    "project_1_description": "The very site you are on now! A full-stack application built with Next.js, Tailwind CSS, and a Node.js backend to showcase my work and skills.",
+    "project_1_description": "The very site you are on now! A full-stack application built with Next.js, Tailwind CSS, and a .NET 8 backend to showcase my work and skills.",
-    "project_1_details": "This portfolio is a full-stack application designed to showcase my skills and projects. It features a modern, decoupled architecture with a Next.js frontend and a Node.js backend. The project is automatically deployed via Gitea Actions, with PM2 managing the processes on the server for zero-downtime restarts.",
+    "project_1_details": "This portfolio is a full-stack application designed to showcase my skills and projects. It features a modern, decoupled architecture with a Next.js frontend and a .NET 8 backend. The project is automatically deployed via Gitea Actions, with PM2 managing the processes on the server for zero-downtime restarts.",
     "project_1_features_title": "Key Features:",
     "project_1_features": [
       "**Internationalization (i18n):** Fully translated in English and Portuguese with `next-intl`.",
       "**Responsive Design:** Optimized for all devices using Tailwind CSS.",
       "**Interactive UI:** Includes a theme switcher (dark/light mode) and toast notifications.",
-      "**Robust Backend:** An Express.js server handles contact form submissions securely using Nodemailer."
+      "**Robust Backend:** A .NET 8 API handles contact form submissions securely."
     ],
     "project_2_title": "Homelab & DevOps Playground",
     "project_2_description": "A self-hosted infrastructure running on Proxmox, showcasing a wide range of DevOps and backend services.",

frontend/src/locales/pt.json

@@ -23,7 +23,7 @@
   "about": {
     "title": "Sobre Mim",
     "paragraph1": "Sou um Desenvolvedor Full Stack movido pela paixão de construir, automatizar e escalar aplicações robustas. Minha jornada na tecnologia começou com o desejo de entender como sistemas complexos funcionam e evoluiu para uma carreira dedicada a criar soluções elegantes e de alta performance.",
-    "paragraph2": "Com uma base sólida nos ecossistemas .NET e JavaScript, minha especialidade é a criação de aplicações web modernas utilizando tecnologias como .NET, Angular, Next.js, React e Node.js. No entanto, minha curiosidade vai além do código. Como você pode ver no meu projeto de Homelab, estou profundamente envolvido com todo o ciclo de vida de desenvolvimento, incluindo CI/CD, conteinerização com Docker e gerenciamento de infraestrutura.",
+    "paragraph2": "Com uma base sólida nos ecossistemas .NET e JavaScript, minha especialidade é a criação de aplicações web modernas utilizando tecnologias como .NET, Angular, Next.js e React. No entanto, minha curiosidade vai além do código. Como você pode ver no meu projeto de Homelab, estou profundamente envolvido com todo o ciclo de vida de desenvolvimento, incluindo CI/CD, conteinerização com Docker e gerenciamento de infraestrutura.",
     "paragraph3": "Eu prospero em desafios e estou constantemente explorando novas tecnologias, desde a administração de bancos de dados com MariaDB e Redis até a automação de fluxos de trabalho com N8N e filas de mensagens com RabbitMQ. Essa abordagem prática em DevOps e auto-hospedagem me permite construir não apenas funcionalidades, mas sistemas resilientes e escaláveis."
   },
   "skills": {
@@ -36,14 +36,14 @@
   "projects": {
     "title": "Projetos que Construí",
     "project_1_title": "Portfólio Pessoal",
-    "project_1_description": "O próprio site em que você está agora! Uma aplicação full-stack construída com Next.js, Tailwind CSS e um backend Node.js para exibir meu trabalho e habilidades.",
+    "project_1_description": "O próprio site em que você está agora! Uma aplicação full-stack construída com Next.js, Tailwind CSS e um backend .NET 8 para exibir meu trabalho e habilidades.",
-    "project_1_details": "Este portfólio é uma aplicação full-stack projetada para mostrar minhas habilidades e projetos. Possui uma arquitetura moderna e desacoplada, com um frontend em Next.js e um backend em Node.js. O projeto é implantado automaticamente via Gitea Actions, com o PM2 gerenciando os processos no servidor para reinicializações sem tempo de inatividade.",
+    "project_1_details": "Este portfólio é uma aplicação full-stack projetada para mostrar minhas habilidades e projetos. Possui uma arquitetura moderna e desacoplada, com um frontend em Next.js e um backend em .NET 8. O projeto é implantado automaticamente via Gitea Actions, com o PM2 gerenciando os processos no servidor para reinicializações sem tempo de inatividade.",
     "project_1_features_title": "Principais Características:",
     "project_1_features": [
       "**Internacionalização (i18n):** Totalmente traduzido para inglês e português com `next-intl`.",
       "**Design Responsivo:** Otimizado para todos os dispositivos usando Tailwind CSS.",
       "**UI Interativa:** Inclui um seletor de tema (modo claro/escuro) e notificações para feedback de formulários.",
-      "**Backend Robusto:** Um servidor Express.js lida com os envios do formulário de contato de forma segura usando o Nodemailer."
+      "**Backend Robusto:** Uma API .NET 8 lida com os envios do formulário de contato de forma segura usando o MailKit."
     ],
     "project_2_title": "Homelab & Playground DevOps",
     "project_2_description": "Uma infraestrutura auto-hospedada rodando em Proxmox, demonstrando uma vasta gama de serviços de DevOps e backend.",