From bc548aa8fb64d2e37e735ed628dc56760cc30392 Mon Sep 17 00:00:00 2001 From: Frank Woeckener Date: Tue, 18 Mar 2025 10:42:10 +0100 Subject: [PATCH] Add project files --- .../docker-compose.override.yml | 26 ++++++++ php-compose-project/docker-compose.yml | 50 ++++++++++++++++ php-compose-project/docker/nginx/default.conf | 17 ++++++ php-compose-project/docker/php/Dockerfile | 27 +++++++++ php-compose-project/docker/php/Dockerfile.dev | 30 ++++++++++ php-compose-project/docker/php/xdebug.ini | 7 +++ php-compose-project/src/db-test.php | 59 +++++++++++++++++++ php-compose-project/src/image-test.php | 29 +++++++++ php-compose-project/src/index.php | 36 +++++++++++ php-project/Dockerfile | 18 ++++++ php-project/docker-compose.yml | 34 +++++++++++ php-project/src/db-test.php | 59 +++++++++++++++++++ php-project/src/image-test.php | 29 +++++++++ php-project/src/index.php | 22 +++++++ react-project/.dockerignore | 7 +++ react-project/Dockerfile | 30 ++++++++++ react-project/package.json | 30 ++++++++++ react-project/public/index.html | 15 +++++ react-project/src/App.css | 42 +++++++++++++ react-project/src/App.js | 28 +++++++++ react-project/src/index.css | 13 ++++ react-project/src/index.js | 11 ++++ 22 files changed, 619 insertions(+) create mode 100644 php-compose-project/docker-compose.override.yml create mode 100644 php-compose-project/docker-compose.yml create mode 100644 php-compose-project/docker/nginx/default.conf create mode 100644 php-compose-project/docker/php/Dockerfile create mode 100644 php-compose-project/docker/php/Dockerfile.dev create mode 100644 php-compose-project/docker/php/xdebug.ini create mode 100644 php-compose-project/src/db-test.php create mode 100644 php-compose-project/src/image-test.php create mode 100644 php-compose-project/src/index.php create mode 100644 php-project/Dockerfile create mode 100644 php-project/docker-compose.yml create mode 100644 php-project/src/db-test.php create mode 100644 php-project/src/image-test.php create mode 100644 php-project/src/index.php create mode 100644 react-project/.dockerignore create mode 100644 react-project/Dockerfile create mode 100644 react-project/package.json create mode 100644 react-project/public/index.html create mode 100644 react-project/src/App.css create mode 100644 react-project/src/App.js create mode 100644 react-project/src/index.css create mode 100644 react-project/src/index.js diff --git a/php-compose-project/docker-compose.override.yml b/php-compose-project/docker-compose.override.yml new file mode 100644 index 0000000..ebd735c --- /dev/null +++ b/php-compose-project/docker-compose.override.yml @@ -0,0 +1,26 @@ +version: '3' + +services: + nginx: + ports: + - "8080:80" + volumes: + - ./src:/var/www/html:delegated + environment: + - NGINX_HOST=localhost + - NGINX_PORT=80 + + php: + build: + context: ./docker/php + dockerfile: Dockerfile.dev + volumes: + - ./src:/var/www/html:delegated + environment: + - PHP_IDE_CONFIG=serverName=docker + extra_hosts: + - "host.docker.internal:host-gateway" + + db: + ports: + - "3306:3306" diff --git a/php-compose-project/docker-compose.yml b/php-compose-project/docker-compose.yml new file mode 100644 index 0000000..15e3246 --- /dev/null +++ b/php-compose-project/docker-compose.yml @@ -0,0 +1,50 @@ +version: '3' + +services: + nginx: + image: nginx:alpine + ports: + - "8000:80" + volumes: + - ./src:/var/www/html + - ./docker/nginx/default.conf:/etc/nginx/conf.d/default.conf + depends_on: + - php + networks: + - frontend + - backend + + php: + build: + context: ./docker/php + dockerfile: Dockerfile + volumes: + - ./src:/var/www/html + environment: + - DB_HOST=db + - DB_USER=root + - DB_PASS=secret + - DB_NAME=testdb + networks: + - backend + depends_on: + - db + + db: + image: mysql:8.0 + command: --default-authentication-plugin=mysql_native_password + environment: + - MYSQL_ROOT_PASSWORD=secret + - MYSQL_DATABASE=testdb + volumes: + - db_data:/var/lib/mysql + networks: + - backend + +networks: + frontend: + backend: + internal: true + +volumes: + db_data: diff --git a/php-compose-project/docker/nginx/default.conf b/php-compose-project/docker/nginx/default.conf new file mode 100644 index 0000000..7955530 --- /dev/null +++ b/php-compose-project/docker/nginx/default.conf @@ -0,0 +1,17 @@ +server { + listen 80; + server_name localhost; + root /var/www/html; + index index.php index.html; + + location / { + try_files $uri $uri/ /index.php?$query_string; + } + + location ~ \.php$ { + fastcgi_pass php:9000; + fastcgi_index index.php; + fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name; + include fastcgi_params; + } +} diff --git a/php-compose-project/docker/php/Dockerfile b/php-compose-project/docker/php/Dockerfile new file mode 100644 index 0000000..82e17fb --- /dev/null +++ b/php-compose-project/docker/php/Dockerfile @@ -0,0 +1,27 @@ +FROM php:8.1-fpm + +# Abhängigkeiten installieren +RUN apt-get update && apt-get install -y \ + libfreetype6-dev \ + libjpeg62-turbo-dev \ + libpng-dev \ + libzip-dev \ + zip \ + unzip + +# PHP Extensions installieren +RUN docker-php-ext-configure gd --with-freetype --with-jpeg \ + && docker-php-ext-install -j$(nproc) \ + gd \ + pdo \ + pdo_mysql \ + zip + +# OPCache für Produktion aktivieren +RUN docker-php-ext-install opcache \ + && docker-php-ext-enable opcache + +WORKDIR /var/www/html + +# Produktionskonfiguration nutzen +RUN cp /usr/local/etc/php/php.ini-production /usr/local/etc/php/php.ini diff --git a/php-compose-project/docker/php/Dockerfile.dev b/php-compose-project/docker/php/Dockerfile.dev new file mode 100644 index 0000000..a283021 --- /dev/null +++ b/php-compose-project/docker/php/Dockerfile.dev @@ -0,0 +1,30 @@ +FROM php:8.1-fpm + +# Abhängigkeiten installieren +RUN apt-get update && apt-get install -y \ + libfreetype6-dev \ + libjpeg62-turbo-dev \ + libpng-dev \ + libzip-dev \ + zip \ + unzip + +# PHP Extensions installieren +RUN docker-php-ext-configure gd --with-freetype --with-jpeg \ + && docker-php-ext-install -j$(nproc) \ + gd \ + pdo \ + pdo_mysql \ + zip + +# Development-Konfiguration nutzen +RUN cp /usr/local/etc/php/php.ini-development /usr/local/etc/php/php.ini + +# Xdebug installieren +RUN pecl install xdebug \ + && docker-php-ext-enable xdebug + +# Xdebug-Konfiguration kopieren +COPY xdebug.ini /usr/local/etc/php/conf.d/xdebug.ini + +WORKDIR /var/www/html diff --git a/php-compose-project/docker/php/xdebug.ini b/php-compose-project/docker/php/xdebug.ini new file mode 100644 index 0000000..9dd712f --- /dev/null +++ b/php-compose-project/docker/php/xdebug.ini @@ -0,0 +1,7 @@ +zend_extension=xdebug + +xdebug.mode=develop,debug +xdebug.start_with_request=yes +xdebug.client_host=host.docker.internal +xdebug.client_port=9003 +xdebug.log=/var/log/xdebug.log diff --git a/php-compose-project/src/db-test.php b/php-compose-project/src/db-test.php new file mode 100644 index 0000000..e9e7ed3 --- /dev/null +++ b/php-compose-project/src/db-test.php @@ -0,0 +1,59 @@ +Datenbank-Verbindungstest"; +echo "

Verbindungsversuch zu: $host

"; + +try { + // Verbindung erstellen + $conn = new PDO("mysql:host=$host;dbname=$dbname", $user, $pass); + + // PDO-Fehlerbehandlung aktivieren + $conn->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION); + + echo "
Verbindung erfolgreich!
"; + + // Prüfen, ob Testtabelle existiert, sonst erstellen + $stmt = $conn->query("SHOW TABLES LIKE 'test_table'"); + if ($stmt->rowCount() == 0) { + $conn->exec("CREATE TABLE test_table ( + id INT AUTO_INCREMENT PRIMARY KEY, + message VARCHAR(255), + created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP + )"); + $conn->exec("INSERT INTO test_table (message) VALUES ('Testdaten 1')"); + $conn->exec("INSERT INTO test_table (message) VALUES ('Testdaten 2')"); + echo "

Testtabelle erstellt und mit Daten gefüllt.

"; + } + + // Daten auslesen + $stmt = $conn->query("SELECT * FROM test_table"); + $rows = $stmt->fetchAll(PDO::FETCH_ASSOC); + + echo "

Daten aus der Datenbank:

"; + echo ""; + echo ""; + + foreach ($rows as $row) { + echo ""; + echo ""; + echo ""; + echo ""; + echo ""; + } + + echo "
IDNachrichtErstellt am
" . $row['id'] . "" . $row['message'] . "" . $row['created_at'] . "
"; + +} catch(PDOException $e) { + echo "
Verbindungsfehler: " . $e->getMessage() . "
"; +} + +// Verbindung schließen +$conn = null; +?> + +

Seite geladen um:

+

Zurück zur Startseite

diff --git a/php-compose-project/src/image-test.php b/php-compose-project/src/image-test.php new file mode 100644 index 0000000..b0a42ee --- /dev/null +++ b/php-compose-project/src/image-test.php @@ -0,0 +1,29 @@ + + + + + + PHP Docker Demo + + + +

PHP-FPM mit Nginx Docker Demo

+ +
+

PHP Version:

+

Server Software:

+

Ausgeführt von:

+

Zeitstempel:

+
+ +

Extension Tests

+ + +

Installierte PHP Extensions:

+ + + diff --git a/php-project/Dockerfile b/php-project/Dockerfile new file mode 100644 index 0000000..3de95a7 --- /dev/null +++ b/php-project/Dockerfile @@ -0,0 +1,18 @@ +FROM php:8.1-cli + +# GD Extension installieren +RUN apt-get update && apt-get install -y \ + libfreetype6-dev \ + libjpeg62-turbo-dev \ + libpng-dev \ + && docker-php-ext-configure gd --with-freetype --with-jpeg \ + && docker-php-ext-install -j$(nproc) gd + +# PDO MySQL Extension installieren +RUN docker-php-ext-install pdo pdo_mysql + +WORKDIR /app +COPY ./src . + +# Entwicklungsserver starten +CMD ["php", "-S", "0.0.0.0:8000"] diff --git a/php-project/docker-compose.yml b/php-project/docker-compose.yml new file mode 100644 index 0000000..de89e9f --- /dev/null +++ b/php-project/docker-compose.yml @@ -0,0 +1,34 @@ +version: '3' + +services: + php-app: + build: . + ports: + - "8000:8000" + volumes: + - ./src:/app + environment: + DB_HOST: mysql-db + DB_USER: root + DB_PASSWORD: secret + DB_NAME: testdb + depends_on: + - mysql-db + networks: + - app-network + + mysql-db: + image: mysql:8.0 + environment: + MYSQL_ROOT_PASSWORD: secret + MYSQL_DATABASE: testdb + volumes: + - db-data:/var/lib/mysql + networks: + - app-network + +networks: + app-network: + +volumes: + db-data: diff --git a/php-project/src/db-test.php b/php-project/src/db-test.php new file mode 100644 index 0000000..9ea0bf8 --- /dev/null +++ b/php-project/src/db-test.php @@ -0,0 +1,59 @@ +Datenbank-Verbindungstest"; +echo "

Verbindungsversuch zu: $host

"; + +try { + // Verbindung erstellen + $conn = new PDO("mysql:host=$host;dbname=$dbname", $user, $pass); + + // PDO-Fehlerbehandlung aktivieren + $conn->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION); + + echo "
Verbindung erfolgreich!
"; + + // Prüfen, ob Testtabelle existiert, sonst erstellen + $stmt = $conn->query("SHOW TABLES LIKE 'test_table'"); + if ($stmt->rowCount() == 0) { + $conn->exec("CREATE TABLE test_table ( + id INT AUTO_INCREMENT PRIMARY KEY, + message VARCHAR(255), + created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP + )"); + $conn->exec("INSERT INTO test_table (message) VALUES ('Testdaten 1')"); + $conn->exec("INSERT INTO test_table (message) VALUES ('Testdaten 2')"); + echo "

Testtabelle erstellt und mit Daten gefüllt.

"; + } + + // Daten auslesen + $stmt = $conn->query("SELECT * FROM test_table"); + $rows = $stmt->fetchAll(PDO::FETCH_ASSOC); + + echo "

Daten aus der Datenbank:

"; + echo ""; + echo ""; + + foreach ($rows as $row) { + echo ""; + echo ""; + echo ""; + echo ""; + echo ""; + } + + echo "
IDNachrichtErstellt am
" . $row['id'] . "" . $row['message'] . "" . $row['created_at'] . "
"; + +} catch(PDOException $e) { + echo "
Verbindungsfehler: " . $e->getMessage() . "
"; +} + +// Verbindung schließen +$conn = null; +?> + +

Seite geladen um:

+

Zurück zur Startseite

diff --git a/php-project/src/image-test.php b/php-project/src/image-test.php new file mode 100644 index 0000000..b0a42ee --- /dev/null +++ b/php-project/src/image-test.php @@ -0,0 +1,29 @@ + + + + + + PHP Docker Demo + + +

PHP Docker Demo

+ +

PHP Info

+

PHP Version:

+ +

Tests

+ + +

Diese Datei wurde geladen um:

+ + diff --git a/react-project/.dockerignore b/react-project/.dockerignore new file mode 100644 index 0000000..fa5cc20 --- /dev/null +++ b/react-project/.dockerignore @@ -0,0 +1,7 @@ +node_modules +npm-debug.log +build +.git +.github +.gitignore +README.md diff --git a/react-project/Dockerfile b/react-project/Dockerfile new file mode 100644 index 0000000..792ec94 --- /dev/null +++ b/react-project/Dockerfile @@ -0,0 +1,30 @@ +# Build-Stage +FROM node:16 AS build + +WORKDIR /app + +# Abhängigkeiten zuerst kopieren und installieren (für besseres Caching) +COPY package*.json ./ +RUN npm install + +# Den Rest der Anwendung kopieren +COPY . . + +# Build-Zeit-Variable setzen +ENV REACT_APP_BUILD_TIME="$(date)" + +# Anwendung bauen +RUN npm run build + +# Production-Stage +FROM nginx:alpine + +# Build-Output vom build-Stage kopieren +COPY --from=build /app/build /usr/share/nginx/html + +# Nginx-Konfiguration (optional) +# COPY nginx.conf /etc/nginx/conf.d/default.conf + +EXPOSE 80 + +CMD ["nginx", "-g", "daemon off;"] diff --git a/react-project/package.json b/react-project/package.json new file mode 100644 index 0000000..6a4b574 --- /dev/null +++ b/react-project/package.json @@ -0,0 +1,30 @@ +{ + "name": "react-docker-demo", + "version": "0.1.0", + "private": true, + "dependencies": { + "react": "^18.2.0", + "react-dom": "^18.2.0" + }, + "devDependencies": { + "react-scripts": "5.0.1" + }, + "scripts": { + "start": "react-scripts start", + "build": "react-scripts build", + "test": "react-scripts test", + "eject": "react-scripts eject" + }, + "browserslist": { + "production": [ + ">0.2%", + "not dead", + "not op_mini all" + ], + "development": [ + "last 1 chrome version", + "last 1 firefox version", + "last 1 safari version" + ] + } +} diff --git a/react-project/public/index.html b/react-project/public/index.html new file mode 100644 index 0000000..4ea0a6e --- /dev/null +++ b/react-project/public/index.html @@ -0,0 +1,15 @@ + + + + + + + + + React Docker Demo + + + +
+ + diff --git a/react-project/src/App.css b/react-project/src/App.css new file mode 100644 index 0000000..874b819 --- /dev/null +++ b/react-project/src/App.css @@ -0,0 +1,42 @@ +.App { + text-align: center; +} + +.App-header { + background-color: #282c34; + min-height: 100vh; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + font-size: calc(10px + 2vmin); + color: white; +} + +.counter { + margin: 2rem 0; + padding: 1rem; + background-color: rgba(255, 255, 255, 0.1); + border-radius: 8px; +} + +button { + background-color: #61dafb; + border: none; + color: #282c34; + padding: 10px 20px; + font-size: 16px; + border-radius: 4px; + cursor: pointer; + font-weight: bold; +} + +button:hover { + background-color: #4fa8c3; +} + +.info { + margin-top: 2rem; + font-size: 0.8rem; + opacity: 0.7; +} diff --git a/react-project/src/App.js b/react-project/src/App.js new file mode 100644 index 0000000..795f7b6 --- /dev/null +++ b/react-project/src/App.js @@ -0,0 +1,28 @@ +import React, { useState } from 'react'; +import './App.css'; + +function App() { + const [count, setCount] = useState(0); + + return ( +
+
+

React Docker Demo

+

Diese App läuft in einem Docker-Container

+ +
+

Du hast den Button {count} mal geklickt

+ +
+ +

+ Build-Zeit: {process.env.REACT_APP_BUILD_TIME || 'Unbekannt'} +

+
+
+ ); +} + +export default App; diff --git a/react-project/src/index.css b/react-project/src/index.css new file mode 100644 index 0000000..ec2585e --- /dev/null +++ b/react-project/src/index.css @@ -0,0 +1,13 @@ +body { + margin: 0; + font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', + 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', + sans-serif; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} + +code { + font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', + monospace; +} diff --git a/react-project/src/index.js b/react-project/src/index.js new file mode 100644 index 0000000..2cb1087 --- /dev/null +++ b/react-project/src/index.js @@ -0,0 +1,11 @@ +import React from 'react'; +import ReactDOM from 'react-dom/client'; +import './index.css'; +import App from './App'; + +const root = ReactDOM.createRoot(document.getElementById('root')); +root.render( + + + +);