Dev (#38)

* ✨ chore: update CI workflow to include testing and multi-arch build (#29)

* ✨ chore: remove unused dependencies from package-lock.json and updated to a better local dev environment (#30)

* ✨ test: add unit tests

* ✨ test: add unit tests for whole project

* ✨ feat: add whatwg-fetch for improved fetch support

* ✨ chore: update Node.js version to 22 in workflow

* ✨ refactor: update types and improve email handling tests

* ✨ refactor: remove unused imports

* ✨ fix: normalize image name to lowercase in workflows

* ✨ fix: ensure Docker image names are consistently lowercase

* ✨ chore: update

* ✨ chore: update base URL to use secret variable

* ✨ chore: update to login to ghcr

* ✨ fix: add missing 'fi' to close if statement in workflow

* D branch 1 (#32)

* full upgrade (#31)

* ✨ chore: update CI workflow to include testing and multi-arch build (#29)

* ✨ chore: remove unused dependencies from package-lock.json and updated to a better local dev environment (#30)

* ✨ test: add unit tests

* ✨ test: add unit tests for whole project

* ✨ feat: add whatwg-fetch for improved fetch support

* ✨ chore: update Node.js version to 22 in workflow

* ✨ refactor: update types and improve email handling tests

* ✨ refactor: remove unused imports

* ✨ fix: normalize image name to lowercase in workflows

* ✨ fix: ensure Docker image names are consistently lowercase

* ✨ chore: update

* ✨ chore: update base URL to use secret variable

* ✨ chore: update to login to ghcr

* ✨ fix: add missing 'fi' to close if statement in workflow

* 🚀 fix: update Docker run commands to use specific network

* D branch 1 (#34)

* full upgrade (#31)

* ✨ chore: update CI workflow to include testing and multi-arch build (#29)

* ✨ chore: remove unused dependencies from package-lock.json and updated to a better local dev environment (#30)

* ✨ test: add unit tests

* ✨ test: add unit tests for whole project

* ✨ feat: add whatwg-fetch for improved fetch support

* ✨ chore: update Node.js version to 22 in workflow

* ✨ refactor: update types and improve email handling tests

* ✨ refactor: remove unused imports

* ✨ fix: normalize image name to lowercase in workflows

* ✨ fix: ensure Docker image names are consistently lowercase

* ✨ chore: update

* ✨ chore: update base URL to use secret variable

* ✨ chore: update to login to ghcr

* ✨ fix: add missing 'fi' to close if statement in workflow

* 🚀 fix: update Docker run commands to use specific network

* ✨ fix: add error handling for invalid project data

* D branch 2 (#35)

* full upgrade (#31)

* ✨ chore: update CI workflow to include testing and multi-arch build (#29)

* ✨ chore: remove unused dependencies from package-lock.json and updated to a better local dev environment (#30)

* ✨ test: add unit tests

* ✨ test: add unit tests for whole project

* ✨ feat: add whatwg-fetch for improved fetch support

* ✨ chore: update Node.js version to 22 in workflow

* ✨ refactor: update types and improve email handling tests

* ✨ refactor: remove unused imports

* ✨ fix: normalize image name to lowercase in workflows

* ✨ fix: ensure Docker image names are consistently lowercase

* ✨ chore: update

* ✨ chore: update base URL to use secret variable

* ✨ chore: update to login to ghcr

* ✨ fix: add missing 'fi' to close if statement in workflow

* ✨ fix: format code for better readability in Contact and Footer components

* D branch 2 (#36)

* full upgrade (#31)

* ✨ chore: update CI workflow to include testing and multi-arch build (#29)

* ✨ chore: remove unused dependencies from package-lock.json and updated to a better local dev environment (#30)

* ✨ test: add unit tests

* ✨ test: add unit tests for whole project

* ✨ feat: add whatwg-fetch for improved fetch support

* ✨ chore: update Node.js version to 22 in workflow

* ✨ refactor: update types and improve email handling tests

* ✨ refactor: remove unused imports

* ✨ fix: normalize image name to lowercase in workflows

* ✨ fix: ensure Docker image names are consistently lowercase

* ✨ chore: update

* ✨ chore: update base URL to use secret variable

* ✨ chore: update to login to ghcr

* ✨ fix: add missing 'fi' to close if statement in workflow

* ✨ fix: format code for better readability in Contact and Footer components

* 🚀 fix: update Docker commands and remove hardcoded API URL

* Update main.yml

* Update main.yml

* Update main.yml

* D branch 1 (#37)

* full upgrade (#31)

* ✨ chore: update CI workflow to include testing and multi-arch build (#29)

* ✨ chore: remove unused dependencies from package-lock.json and updated to a better local dev environment (#30)

* ✨ test: add unit tests

* ✨ test: add unit tests for whole project

* ✨ feat: add whatwg-fetch for improved fetch support

* ✨ chore: update Node.js version to 22 in workflow

* ✨ refactor: update types and improve email handling tests

* ✨ refactor: remove unused imports

* ✨ fix: normalize image name to lowercase in workflows

* ✨ fix: ensure Docker image names are consistently lowercase

* ✨ chore: update

* ✨ chore: update base URL to use secret variable

* ✨ chore: update to login to ghcr

* ✨ fix: add missing 'fi' to close if statement in workflow

* ✨ feat: display base URL in Hero component

* Update main.yml

* Update next.config.ts

* next.config.ts aktualisieren

* Update main.yml

* ✨ chore: refactor environment variable handling in workflow

* ✨ chore: update GitHub Actions workflow for improved security and caching

* 🚀 chore: update Trivy action version and enhance config

* ✨ chore: update GitHub Actions workflows and add linter

* 🚫 chore: remove Docker image vulnerability scan step

* ✨ chore: update environment variable logging in workflow

* ✨ chore: add dynamic environment for deployment jobs

* 🚀 chore: set deployment environment to GitHub ref name

* 🎉 chore: remove environment variable exposure in CI/CD

* ✨ chore: remove sensitive environment variable logging and update variable references

* ✨ chore: log environment variables for debugging purposes

* ✨ chore: create .env file for environment variables setup

* ✨ feat: copy .env file to Docker image for config

* ✨ refactor: update environment variables to public scope

* ✨ chore: remove environment variable from Hero component

* ✨ fix: update environment variable references in workflow

* ✨ chore: add folder structure display to workflow steps

* ✨ chore: reorder CI steps for improved workflow clarity

* ✨ fix: remove unnecessary console logs and correct base URL variable

.github/workflows/linter.yml

@@ -0,0 +1,55 @@
+name: Lint Code Base
+
+on:
+  push:
+    branches:
+      - dev
+      - preview
+      - production
+    paths:
+      - 'app/**'
+      - 'public/**'
+      - 'styles/**'
+      - 'Dockerfile'
+      - 'docker-compose.yml'
+      - '.github/workflows/**'
+      - 'next.config.ts'
+      - 'package.json'
+      - 'package-lock.json'
+      - 'tsconfig.json'
+      - 'tailwind.config.ts'
+  pull_request:
+    branches:
+      - dev
+      - preview
+      - production
+    paths:
+      - 'app/**'
+      - 'public/**'
+      - 'styles/**'
+      - 'Dockerfile'
+      - 'docker-compose.yml'
+      - '.github/workflows/**'
+      - 'next.config.ts'
+      - 'package.json'
+      - 'package-lock.json'
+      - 'tsconfig.json'
+      - 'tailwind.config.ts'
+
+jobs:
+  build:
+    name: Check and Lint Code Base
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Check Out Code
+        uses: actions/checkout@v4
+        with:
+          fetch-depth: 0
+
+      - name: Lint Code Base
+        uses: github/super-linter@v4
+        env:
+          VALIDATE_ALL_CODEBASE: false
+          DEFAULT_BRANCH: production
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

.github/workflows/main.yml

@@ -6,6 +6,18 @@ on:
       - production
       - dev
       - preview
+    paths:
+      - 'app/**'
+      - 'public/**'
+      - 'styles/**'
+      - 'Dockerfile'
+      - 'docker-compose.yml'
+      - '.github/workflows/main.yml'
+      - 'next.config.ts'
+      - 'package.json'
+      - 'package-lock.json'
+      - 'tsconfig.json'
+      - 'tailwind.config.ts'
 
 jobs:
   test_and_build:
@@ -15,10 +27,32 @@ jobs:
         uses: actions/checkout@v4
 
       - name: Set up Node
-        uses: actions/setup-node@v3
+        uses: actions/setup-node@v4
         with:
           node-version: '22'
 
+      - name: Cache Node.js modules
+        uses: actions/cache@v4
+        with:
+          path: ~/.npm
+          key: ${{ runner.os }}-node-${{ hashFiles('**/package-lock.json') }}
+          restore-keys: |
+            ${{ runner.os }}-node-
+
+      - name: Create env file
+        run: |
+          touch .env
+          echo "NEXT_PUBLIC_BASE_URL=${{ vars.NEXT_PUBLIC_BASE_URL }}" >> .env
+          echo "NEXT_PUBLIC_GHOST_API_URL=${{ vars.NEXT_PUBLIC_GHOST_API_URL }}" >> .env
+          echo "NEXT_PUBLIC_GHOST_API_KEY=${{ secrets.NEXT_PUBLIC_GHOST_API_KEY }}" >> .env
+          echo "NEXT_PUBLIC_MY_EMAIL=${{ vars.NEXT_PUBLIC_MY_EMAIL }}" >> .env
+          echo "NEXT_PUBLIC_MY_PASSWORD=${{ secrets.NEXT_PUBLIC_MY_PASSWORD }}" >> .env
+          cat .env
+
+      - name: Show folder structure
+        run: |
+          ls -la
+
       - name: Install Dependencies
         run: npm install
 
@@ -32,14 +66,12 @@ jobs:
       - name: Build and Push Multi-Arch Docker Image
         run: |
           IMAGE_NAME="ghcr.io/${{ github.repository_owner }}/my-nextjs-app:${{ github.ref_name }}"
-          IMAGE_NAME=$(echo "$IMAGE_NAME" | tr '[:upper:]' '[:lower:]')
           docker buildx create --use
           docker buildx build \
-            --platform linux/arm64,linux/amd64 \
+            --platform linux/arm64 \
             -t "$IMAGE_NAME" \
             --push \
             .
-
   deploy:
     runs-on: self-hosted
     needs: test_and_build
@@ -82,19 +114,19 @@ jobs:
             docker rm -f "$NEW_CONTAINER_NAME" || true
           fi
 
+          echo "Deploying $CONTAINER_NAME with $IMAGE_NAME"
+
           # Start new container on a temporary internal port
-          docker run -d --name "$NEW_CONTAINER_NAME" -p 40000:3000 \
+          docker run -d --name "$NEW_CONTAINER_NAME" --network big-bear-ghost_ghost-network -p 40000:3000 \
-            -e GHOST_API_KEY="${{ secrets.GHOST_API_KEY }}" \
-            -e NEXT_PUBLIC_BASE_URL="${{ secrets.NEXT_PUBLIC_BASE_URL }}" \
-            -e MY_EMAIL="${{ secrets.MY_EMAIL }}" \
-            -e MY_PASSWORD="${{ secrets.MY_PASSWORD }}" \
-            -e GHOST_API_URL="${{ secrets.GHOST_API_URL }}" \
             "$IMAGE_NAME"
 
           # Wait for the new container to start
           sleep 10
 
-          if [ "$(docker inspect --format='{{.State.Running}}' $NEW_CONTAINER_NAME)" = "true" ]; then
+          # Debugging: Check if the environment variables are set correctly
+          docker exec "$NEW_CONTAINER_NAME" printenv
+
+          if [ "$(docker inspect --format='{{.State.Running}}' "$NEW_CONTAINER_NAME")" = "true" ]; then
             # Stop/remove the old container
             if [ "$(docker ps -aq -f name=$CONTAINER_NAME)" ]; then
               docker stop "$CONTAINER_NAME" || true
@@ -104,12 +136,8 @@ jobs:
             # Replace the new container with final name/port
             docker stop  "$NEW_CONTAINER_NAME" || true
             docker rm    "$NEW_CONTAINER_NAME" || true
-            docker run -d --name "$CONTAINER_NAME" -p $PORT:3000 \
+
-              -e GHOST_API_KEY="${{ secrets.GHOST_API_KEY }}" \
+            docker run -d --name "$CONTAINER_NAME" --network big-bear-ghost_ghost-network -p $PORT:3000 \
-              -e NEXT_PUBLIC_BASE_URL="${{ secrets.NEXT_PUBLIC_BASE_URL }}" \
-              -e MY_EMAIL="${{ secrets.MY_EMAIL }}" \
-              -e MY_PASSWORD="${{ secrets.MY_PASSWORD }}" \
-              -e GHOST_API_URL="${{ secrets.GHOST_API_URL }}" \
               "$IMAGE_NAME"
           else
             echo "New container failed to start."

Dockerfile

@@ -13,6 +13,9 @@ RUN npm install
 # Copy the application code
 COPY . .
 
+# Copy the .env file
+COPY .env .env
+
 # Build the Next.js application
 RUN npm run build
 

app/__tests__/api/email.test.tsx

@@ -10,8 +10,8 @@ jest.mock('next/server', () => ({
 
 beforeEach(() => {
   nodemailermock.mock.reset();
-  process.env.MY_EMAIL = 'test@dki.one';
+  process.env.NEXT_PUBLIC_MY_EMAIL = 'test@dki.one';
-  process.env.MY_PASSWORD = 'test-password';
+  process.env.NEXT_PUBLIC_MY_PASSWORD = 'test-password';
 });
 
 describe('POST /api/email', () => {
@@ -35,8 +35,8 @@ describe('POST /api/email', () => {
   });
 
   it('should return an error if EMAIL or PASSWORD is missing', async () => {
-    delete process.env.MY_EMAIL;
+    delete process.env.NEXT_PUBLIC_MY_EMAIL;
-    delete process.env.MY_PASSWORD;
+    delete process.env.NEXT_PUBLIC_MY_PASSWORD;
 
     const mockRequest = {
       json: jest.fn().mockResolvedValue({

app/__tests__/api/fetchAllProjects.test.tsx

@@ -10,8 +10,8 @@ jest.mock('next/server', () => ({
 
 describe('GET /api/fetchAllProjects', () => {
   beforeAll(() => {
-    process.env.GHOST_API_URL = 'http://localhost:2368';
+    process.env.NEXT_PUBLIC_GHOST_API_URL = 'http://localhost:2368';
-    process.env.GHOST_API_KEY = 'some-key';
+    process.env.NEXT_PUBLIC_GHOST_API_KEY = 'some-key';
     global.fetch = mockFetch({
       posts: [
         {

app/__tests__/api/fetchProject.test.tsx

@@ -10,8 +10,9 @@ jest.mock('next/server', () => ({
 
 describe('GET /api/fetchProject', () => {
   beforeAll(() => {
-    process.env.GHOST_API_URL = 'http://localhost:2368';
+    process.env.NEXT_PUBLIC_GHOST_API_URL = 'http://localhost:2368';
-    process.env.GHOST_API_KEY = 'some-key';
+    process.env.NEXT_PUBLIC_GHOST_API_KEY = 'some-key';
+
     global.fetch = mockFetch({
       posts: [
         {

app/__tests__/api/sitemap.test.tsx

@@ -7,8 +7,8 @@ jest.mock('next/server', () => ({
 
 describe('GET /api/sitemap', () => {
   beforeAll(() => {
-    process.env.GHOST_API_URL = 'http://localhost:2368';
+    process.env.NEXT_PUBLIC_GHOST_API_URL = 'http://localhost:2368';
-    process.env.GHOST_API_KEY = 'test-api-key';
+    process.env.NEXT_PUBLIC_GHOST_API_KEY = 'test-api-key';
     process.env.NEXT_PUBLIC_BASE_URL = 'https://dki.one';
     global.fetch = mockFetch({
       posts: [

app/__tests__/components/Projects.test.tsx

@@ -6,8 +6,8 @@ import { mockFetch } from '@/app/__tests__/__mocks__/mock-fetch';
 
 describe('Projects', () => {
     beforeAll(() => {
-      process.env.GHOST_API_URL = 'http://localhost:2368';
+      process.env.NEXT_PUBLIC_GHOST_API_URL = 'http://localhost:2368';
-      process.env.GHOST_API_KEY = 'some-key';
+      process.env.NEXT_PUBLIC_GHOST_API_KEY = 'some-key';
       global.fetch = mockFetch({
         posts: [
           {

app/__tests__/projects/[slug]/page.test.tsx

@@ -13,8 +13,8 @@ jest.mock('next/navigation', () => ({
 
 describe('ProjectDetails', () => {
   beforeAll(() => {
-    process.env.GHOST_API_URL = 'http://localhost:2368';
+    process.env.NEXT_PUBLIC_GHOST_API_URL = 'http://localhost:2368';
-    process.env.GHOST_API_KEY = 'some-key';
+    process.env.NEXT_PUBLIC_GHOST_API_KEY = 'some-key';
     global.fetch = mockFetch({
       posts: [
         {

app/api/email/route.tsx

@@ -11,8 +11,8 @@ export async function POST(request: NextRequest) {
     };
     const { email, name, message } = body;
 
-    const user = process.env.MY_EMAIL ?? "";
+    const user = process.env.NEXT_PUBLIC_MY_EMAIL ?? "";
-    const pass = process.env.MY_PASSWORD ?? "";
+    const pass = process.env.NEXT_PUBLIC_MY_PASSWORD ?? "";
 
     if (!user || !pass) {
         console.error("Missing email/password environment variables");

app/api/fetchAllProjects/route.tsx

@@ -2,8 +2,8 @@ import { NextResponse } from "next/server";
 
 export const runtime = "nodejs"; // Force Node runtime
 
-const GHOST_API_URL = process.env.GHOST_API_URL || "http://192.168.179.31:2368";
+const GHOST_API_URL = process.env.NEXT_PUBLIC_GHOST_API_URL;
-const GHOST_API_KEY = process.env.GHOST_API_KEY;
+const GHOST_API_KEY = process.env.NEXT_PUBLIC_GHOST_API_KEY;
 
 export async function GET() {
   try {
@@ -15,6 +15,11 @@ export async function GET() {
       return NextResponse.json([]);
     }
     const posts = await response.json();
+
+    if (!posts || !posts.posts) {
+      console.error("Invalid posts data");
+      return NextResponse.json([]);
+    }
     return NextResponse.json(posts);
   } catch (error) {
     console.error("Failed to fetch posts from Ghost:", error);

app/api/fetchProject/route.tsx

@@ -2,8 +2,8 @@ import { NextResponse } from "next/server";
 
 export const runtime = "nodejs"; // Force Node runtime
 
-const GHOST_API_URL = process.env.GHOST_API_URL || "http://192.168.179.31:2368";
+const GHOST_API_URL = process.env.NEXT_PUBLIC_GHOST_API_URL;
-const GHOST_API_KEY = process.env.GHOST_API_KEY;
+const GHOST_API_KEY = process.env.NEXT_PUBLIC_GHOST_API_KEY;
 
 export async function GET(request: Request) {
   const { searchParams } = new URL(request.url);

app/api/sitemap/route.tsx

@@ -12,8 +12,8 @@ interface ProjectsData {
 export const dynamic = "force-dynamic";
 export const runtime = "nodejs"; // Force Node runtime
 
-const GHOST_API_URL = process.env.GHOST_API_URL || "http://192.168.179.31:2368";
+const GHOST_API_URL = process.env.NEXT_PUBLIC_GHOST_API_URL;
-const GHOST_API_KEY = process.env.GHOST_API_KEY;
+const GHOST_API_KEY = process.env.NEXT_PUBLIC_GHOST_API_KEY;
 
 // Funktion, um die XML für die Sitemap zu generieren
 function generateXml(sitemapRoutes: { url: string; lastModified: string }[]) {
@@ -38,7 +38,7 @@ function generateXml(sitemapRoutes: { url: string; lastModified: string }[]) {
 }
 
 export async function GET() {
-  const baseUrl = process.env.NEXT_PUBLIC_BASE_URL || "https://dki.one";
+  const baseUrl = process.env.NEXT_PUBLIC_BASE_URL;
 
   // Statische Routen
   const staticRoutes = [

app/components/Contact.tsx

@@ -54,7 +54,6 @@ export default function Contact() {
       setBanner((prev) => ({ ...prev, show: false }));
     }, 3000);
   }
-
   return (
     <section
       id="contact"

app/components/Footer.tsx

@@ -28,24 +28,30 @@ export default function Footer() {
             Connect with me on social platforms:
           </p>
           <div className="flex justify-center items-center space-x-4 mt-4">
-                        <Link aria-label={"Dennis Github"} href="https://github.com/Denshooter" target="_blank">
+            <Link
+              aria-label={"Dennis Github"}
+              href="https://github.com/Denshooter"
+              target="_blank"
+            >
               <svg
                 className="w-10 h-10"
                 fill="currentColor"
                 viewBox="0 0 24 24"
               >
-                                <path
+                <path d="M12 0C5.37 0 0 5.37 0 12c0 5.3 3.438 9.8 8.205 11.387.6.11.82-.26.82-.577v-2.17c-3.338.726-4.042-1.61-4.042-1.61-.546-1.387-1.333-1.757-1.333-1.757-1.09-.746.083-.73.083-.73 1.205.084 1.84 1.237 1.84 1.237 1.07 1.835 2.807 1.305 3.492.997.108-.774.42-1.305.763-1.605-2.665-.305-5.466-1.332-5.466-5.93 0-1.31.467-2.38 1.235-3.22-.123-.303-.535-1.527.117-3.18 0 0 1.008-.322 3.3 1.23.957-.266 1.98-.4 3-.405 1.02.005 2.043.14 3 .405 2.29-1.552 3.297-1.23 3.297-1.23.653 1.653.24 2.877.118 3.18.77.84 1.233 1.91 1.233 3.22 0 4.61-2.803 5.62-5.475 5.92.43.37.823 1.1.823 2.22v3.293c0 .32.218.694.825.577C20.565 21.8 24 17.3 24 12c0-6.63-5.37-12-12-12z" />
-                                    d="M12 0C5.37 0 0 5.37 0 12c0 5.3 3.438 9.8 8.205 11.387.6.11.82-.26.82-.577v-2.17c-3.338.726-4.042-1.61-4.042-1.61-.546-1.387-1.333-1.757-1.333-1.757-1.09-.746.083-.73.083-.73 1.205.084 1.84 1.237 1.84 1.237 1.07 1.835 2.807 1.305 3.492.997.108-.774.42-1.305.763-1.605-2.665-.305-5.466-1.332-5.466-5.93 0-1.31.467-2.38 1.235-3.22-.123-.303-.535-1.527.117-3.18 0 0 1.008-.322 3.3 1.23.957-.266 1.98-.4 3-.405 1.02.005 2.043.14 3 .405 2.29-1.552 3.297-1.23 3.297-1.23.653 1.653.24 2.877.118 3.18.77.84 1.233 1.91 1.233 3.22 0 4.61-2.803 5.62-5.475 5.92.43.37.823 1.1.823 2.22v3.293c0 .32.218.694.825.577C20.565 21.8 24 17.3 24 12c0-6.63-5.37-12-12-12z"/>
               </svg>
             </Link>
-                        <Link aria-label={"Dennis Linked In"} href="https://linkedin.com/in/dkonkol" target="_blank">
+            <Link
+              aria-label={"Dennis Linked In"}
+              href="https://linkedin.com/in/dkonkol"
+              target="_blank"
+            >
               <svg
                 className="w-10 h-10"
                 fill="currentColor"
                 viewBox="0 0 24 24"
               >
-                                <path
+                <path d="M19 0h-14c-2.76 0-5 2.24-5 5v14c0 2.76 2.24 5 5 5h14c2.76 0 5-2.24 5-5v-14c0-2.76-2.24-5-5-5zm-11 19h-3v-10h3v10zm-1.5-11.5c-.83 0-1.5-.67-1.5-1.5s.67-1.5 1.5-1.5 1.5.67 1.5 1.5-.67 1.5-1.5 1.5zm13.5 11.5h-3v-5.5c0-1.38-1.12-2.5-2.5-2.5s-2.5 1.12-2.5 2.5v5.5h-3v-10h3v1.5c.83-1.17 2.17-1.5 3.5-1.5 2.48 0 4.5 2.02 4.5 4.5v5.5z" />
-                                    d="M19 0h-14c-2.76 0-5 2.24-5 5v14c0 2.76 2.24 5 5 5h14c2.76 0 5-2.24 5-5v-14c0-2.76-2.24-5-5-5zm-11 19h-3v-10h3v10zm-1.5-11.5c-.83 0-1.5-.67-1.5-1.5s.67-1.5 1.5-1.5 1.5.67 1.5 1.5-.67 1.5-1.5 1.5zm13.5 11.5h-3v-5.5c0-1.38-1.12-2.5-2.5-2.5s-2.5 1.12-2.5 2.5v5.5h-3v-10h3v1.5c.83-1.17 2.17-1.5 3.5-1.5 2.48 0 4.5 2.02 4.5 4.5v5.5z"/>
               </svg>
             </Link>
           </div>

app/components/Footer_Back.tsx

@@ -20,24 +20,30 @@ export default function Footer_Back() {
             Connect with me on social platforms:
           </p>
           <div className="flex justify-center items-center space-x-4 mt-4">
-                        <Link aria-label={"Dennis Github"} href="https://github.com/Denshooter" target="_blank">
+            <Link
+              aria-label={"Dennis Github"}
+              href="https://github.com/Denshooter"
+              target="_blank"
+            >
               <svg
                 className="w-10 h-10"
                 fill="currentColor"
                 viewBox="0 0 24 24"
               >
-                                <path
+                <path d="M12 0C5.37 0 0 5.37 0 12c0 5.3 3.438 9.8 8.205 11.387.6.11.82-.26.82-.577v-2.17c-3.338.726-4.042-1.61-4.042-1.61-.546-1.387-1.333-1.757-1.333-1.757-1.09-.746.083-.73.083-.73 1.205.084 1.84 1.237 1.84 1.237 1.07 1.835 2.807 1.305 3.492.997.108-.774.42-1.305.763-1.605-2.665-.305-5.466-1.332-5.466-5.93 0-1.31.467-2.38 1.235-3.22-.123-.303-.535-1.527.117-3.18 0 0 1.008-.322 3.3 1.23.957-.266 1.98-.4 3-.405 1.02.005 2.043.14 3 .405 2.29-1.552 3.297-1.23 3.297-1.23.653 1.653.24 2.877.118 3.18.77.84 1.233 1.91 1.233 3.22 0 4.61-2.803 5.62-5.475 5.92.43.37.823 1.1.823 2.22v3.293c0 .32.218.694.825.577C20.565 21.8 24 17.3 24 12c0-6.63-5.37-12-12-12z" />
-                                    d="M12 0C5.37 0 0 5.37 0 12c0 5.3 3.438 9.8 8.205 11.387.6.11.82-.26.82-.577v-2.17c-3.338.726-4.042-1.61-4.042-1.61-.546-1.387-1.333-1.757-1.333-1.757-1.09-.746.083-.73.083-.73 1.205.084 1.84 1.237 1.84 1.237 1.07 1.835 2.807 1.305 3.492.997.108-.774.42-1.305.763-1.605-2.665-.305-5.466-1.332-5.466-5.93 0-1.31.467-2.38 1.235-3.22-.123-.303-.535-1.527.117-3.18 0 0 1.008-.322 3.3 1.23.957-.266 1.98-.4 3-.405 1.02.005 2.043.14 3 .405 2.29-1.552 3.297-1.23 3.297-1.23.653 1.653.24 2.877.118 3.18.77.84 1.233 1.91 1.233 3.22 0 4.61-2.803 5.62-5.475 5.92.43.37.823 1.1.823 2.22v3.293c0 .32.218.694.825.577C20.565 21.8 24 17.3 24 12c0-6.63-5.37-12-12-12z"/>
               </svg>
             </Link>
-                        <Link aria-label={"Dennis Linked In"} href="https://linkedin.com/in/dkonkol" target="_blank">
+            <Link
+              aria-label={"Dennis Linked In"}
+              href="https://linkedin.com/in/dkonkol"
+              target="_blank"
+            >
               <svg
                 className="w-10 h-10"
                 fill="currentColor"
                 viewBox="0 0 24 24"
               >
-                                <path
+                <path d="M19 0h-14c-2.76 0-5 2.24-5 5v14c0 2.76 2.24 5 5 5h14c2.76 0 5-2.24 5-5v-14c0-2.76-2.24-5-5-5zm-11 19h-3v-10h3v10zm-1.5-11.5c-.83 0-1.5-.67-1.5-1.5s.67-1.5 1.5-1.5 1.5.67 1.5 1.5-.67 1.5-1.5 1.5zm13.5 11.5h-3v-5.5c0-1.38-1.12-2.5-2.5-2.5s-2.5 1.12-2.5 2.5v5.5h-3v-10h3v1.5c.83-1.17 2.17-1.5 3.5-1.5 2.48 0 4.5 2.02 4.5 4.5v5.5z" />
-                                    d="M19 0h-14c-2.76 0-5 2.24-5 5v14c0 2.76 2.24 5 5 5h14c2.76 0 5-2.24 5-5v-14c0-2.76-2.24-5-5-5zm-11 19h-3v-10h3v10zm-1.5-11.5c-.83 0-1.5-.67-1.5-1.5s.67-1.5 1.5-1.5 1.5.67 1.5 1.5-.67 1.5-1.5 1.5zm13.5 11.5h-3v-5.5c0-1.38-1.12-2.5-2.5-2.5s-2.5 1.12-2.5 2.5v5.5h-3v-10h3v1.5c.83-1.17 2.17-1.5 3.5-1.5 2.48 0 4.5 2.02 4.5 4.5v5.5z"/>
               </svg>
             </Link>
           </div>

app/components/Header.tsx

@@ -4,7 +4,6 @@ import {useEffect, useState} from "react";
 import Link from "next/link";
 
 export default function Header() {
-
   const [isVisible, setIsVisible] = useState(false);
 
   useEffect(() => {
@@ -30,9 +29,10 @@ export default function Header() {
   };
 
   return (
-        <div className={`p-4 ${isVisible ? 'animate-fly-in' : 'opacity-0'}`}>
+    <div className={`p-4 ${isVisible ? "animate-fly-in" : "opacity-0"}`}>
       <div
-                className={`fixed top-4 left-4 right-4 p-4 bg-white/45 text-gray-700 backdrop-blur-md shadow-xl rounded-2xl z-50 ${isSidebarOpen ? 'transform -translate-y-full' : ''}`}>
+        className={`fixed top-4 left-4 right-4 p-4 bg-white/45 text-gray-700 backdrop-blur-md shadow-xl rounded-2xl z-50 ${isSidebarOpen ? "transform -translate-y-full" : ""}`}
+      >
         <header className="w-full">
           <nav className="flex flex-row items-center px-4">
             <Link href="/" className="flex justify-start">
@@ -62,17 +62,20 @@ export default function Header() {
             <div className="hidden md:flex space-x-4 md:space-x-6">
               <button
                 onClick={() => scrollToSection("about")}
-                                className="relative px-4 py-2 text-gray-700 hover:text-gray-900 text-xl md:text-2xl group">
+                className="relative px-4 py-2 text-gray-700 hover:text-gray-900 text-xl md:text-2xl group"
+              >
                 About
               </button>
               <button
                 onClick={() => scrollToSection("projects")}
-                                className="relative px-4 py-2 text-gray-700 hover:text-gray-900 text-xl md:text-2xl group">
+                className="relative px-4 py-2 text-gray-700 hover:text-gray-900 text-xl md:text-2xl group"
+              >
                 Projects
               </button>
               <button
                 onClick={() => scrollToSection("contact")}
-                                className="relative pl-4 py-2 text-gray-700 hover:text-gray-900 text-xl md:text-2xl group">
+                className="relative pl-4 py-2 text-gray-700 hover:text-gray-900 text-xl md:text-2xl group"
+              >
                 Contact
               </button>
             </div>
@@ -81,12 +84,12 @@ export default function Header() {
       </div>
 
       <div
-                className={`fixed inset-0 bg-black bg-opacity-50 transition-opacity ${isSidebarOpen ? 'opacity-100' : 'opacity-0 pointer-events-none'}`}
+        className={`fixed inset-0 bg-black bg-opacity-50 transition-opacity ${isSidebarOpen ? "opacity-100" : "opacity-0 pointer-events-none"}`}
         onClick={toggleSidebar}
       ></div>
 
       <div
-                className={`fixed z-10 top-0 right-0 h-full bg-white w-1/3 transform transition-transform flex flex-col ${isSidebarOpen ? 'translate-x-0' : 'translate-x-full'}`}
+        className={`fixed z-10 top-0 right-0 h-full bg-white w-1/3 transform transition-transform flex flex-col ${isSidebarOpen ? "translate-x-0" : "translate-x-full"}`}
       >
         <button
           aria-label={"Close menu"}
@@ -111,17 +114,20 @@ export default function Header() {
         <div className="pt-8 space-y-4 flex-grow">
           <button
             onClick={() => scrollToSection("about")}
-                        className="w-full px-4 py-2 pt-8 text-gray-700 hover:text-gray-900 text-xl md:text-2xl group">
+            className="w-full px-4 py-2 pt-8 text-gray-700 hover:text-gray-900 text-xl md:text-2xl group"
+          >
             About
           </button>
           <button
             onClick={() => scrollToSection("projects")}
-                        className="w-full px-4 py-2 text-gray-700 hover:text-gray-900 text-xl md:text-2xl group">
+            className="w-full px-4 py-2 text-gray-700 hover:text-gray-900 text-xl md:text-2xl group"
+          >
             Projects
           </button>
           <button
             onClick={() => scrollToSection("contact")}
-                        className="w-full px-4 py-2 text-gray-700 hover:text-gray-900 text-xl md:text-2xl group">
+            className="w-full px-4 py-2 text-gray-700 hover:text-gray-900 text-xl md:text-2xl group"
+          >
             Contact
           </button>
         </div>

app/components/Hero.tsx

@@ -1,4 +1,3 @@
-// app/components/Hero.tsx
 import React, { useEffect, useState } from "react";
 import Image from "next/image";
 

app/components/Projects.tsx

@@ -31,6 +31,10 @@ export default function Projects() {
           return [];
         }
         const projectsData = (await response.json()) as ProjectsData;
+        if (!projectsData || !projectsData.posts) {
+          console.error("Invalid projects data");
+          return;
+        }
         setProjects(projectsData.posts);
 
         setTimeout(() => {

app/projects/[slug]/page.tsx

@@ -72,7 +72,11 @@ const ProjectDetails = () => {
         setError("Failed to fetch project Data");
       }
       const projectData = (await response.json()) as { posts: Project[] };
-            if (projectData.posts.length === 0) {
+      if (
+        !projectData ||
+        !projectData.posts ||
+        projectData.posts.length === 0
+      ) {
         setError("Project not found");
       }
       setProject(projectData.posts[0]);
@@ -112,8 +116,7 @@ const ProjectDetails = () => {
       <div className="min-h-screen flex flex-col bg-radiant">
         <Header />
         <div className="flex-grow flex items-center justify-center">
-                    <div
+          <div className="loader ease-linear rounded-full border-8 border-t-8 border-gray-200 h-32 w-32"></div>
-                        className="loader ease-linear rounded-full border-8 border-t-8 border-gray-200 h-32 w-32"></div>
         </div>
         <Footer_Back />
       </div>
@@ -152,8 +155,7 @@ const ProjectDetails = () => {
 
         {/* Project Content */}
         <div className="p-10 pt-12">
-                    <div
+          <div className="flex flex-col p-8 bg-gradient-to-br from-white/60 to-white/30 backdrop-blur-lg rounded-2xl shadow-xl">
-                        className="flex flex-col p-8 bg-gradient-to-br from-white/60 to-white/30 backdrop-blur-lg rounded-2xl shadow-xl">
             <div
               className="content mt-4 text-gray-600 text-lg leading-relaxed"
               dangerouslySetInnerHTML={{ __html: project.html }}

app/sitemap.xml/route.tsx

@@ -3,7 +3,7 @@ import {NextResponse} from "next/server";
 export const dynamic = 'force-dynamic';
 
 export async function GET() {
-    const baseUrl = process.env.NEXT_PUBLIC_BASE_URL || "https://dki.one";
+    const baseUrl = process.env.NEXT_PUBLIC_BASE_URL;
     const apiUrl = `${baseUrl}/api/sitemap`; // Verwende die vollständige URL zur API
 
     try {

next.config.ts

@@ -1,14 +1,16 @@
 import type { NextConfig } from "next";
 import dotenv from "dotenv";
+import path from "path";
 
-dotenv.config();
+// Lade die .env Datei aus dem Arbeitsverzeichnis
+dotenv.config({ path: path.resolve(__dirname, '.env') });
 
 const nextConfig: NextConfig = {
   env: {
-    GHOST_API_KEY: process.env.GHOST_API_KEY,
+    NEXT_PUBLIC_GHOST_API_KEY: process.env.NEXT_PUBLIC_GHOST_API_KEY,
-    GHOST_API_URL: process.env.GHOST_API_URL,
+    NEXT_PUBLIC_GHOST_API_URL: process.env.NEXT_PUBLIC_GHOST_API_URL,
-    MY_EMAIL: process.env.MY_EMAIL,
+    NEXT_PUBLIC_MY_EMAIL: process.env.NEXT_PUBLIC_MY_EMAIL,
-    MY_PASSWORD: process.env.MY_PASSWORD,
+    NEXT_PUBLIC_MY_PASSWORD: process.env.NEXT_PUBLIC_MY_PASSWORD,
     NEXT_PUBLIC_BASE_URL: process.env.NEXT_PUBLIC_BASE_URL,
   },
 };