ouorz mono

OUORZ-MONO

Quellcode und Docker-Image, die lipeng.ac und andere verwandte Projekte unterstützen

Haupt-App

Vergangene Iterationen

• Antony-Nuxt (Nuxt.js / Vue.js v2) https://github.com/ttttonyhe/antony-nuxt →

• Antony (Vue.js v2) https://github.com/ttttonyhe/antony →

• Tony (Vue.js v2 / PHP) https://github.com/ttttonyhe/tony →

Feature-Highlights

• SSR/SSG/On-Demand-ISR

• Befehlspalette

• Redux + Redux Saga-Zustandsverwaltung

• Nexment-Kommentarsystem

• Dynamische Seitenleiste mit Inhaltsverzeichnis

• Persönliches Dashboard

• Dunkler Modus

Zusammenfassung der Tech Stacks

Super eigensinnig, völlig übertrieben.

• Typoskript

• Rahmen

• Reagieren (Next.js)

• Die Implementierung von Foundation/Adaptor folgt in Kürze

• Märchenbuch

• Turborepo

• Datenabruf

• Unendliches Laden

• Verlängerung

• Spannung

• swr

• fetch (API-Routen)

• Staatsmanagement

• Redux-Toolkit

• Redux-Saga

• Styling:

• gestylte Komponenten

• Rückenwind-CSS

• Content-Management:

• WordPress (Qiniu – Statische Dateispeicherung)

• WP REST API (GraphQL-Implementierung folgt in Kürze)

• Tencent Cloud CVM (CentOS/Nginx/MySQL/PHP)

• Nexment (LeanCloud)

• Newsletter (Listmonk)

• Fehlerprotokollierung und Web-Vitals-Metrik

• Posten

• Linters

• ESLint

• Hübscher

• CommitLint

• CI/CD

• Github-Aktionen

• Vercel

Projekt-Setup

 Git-Klon [email protected]:ttttonyhe/ouorz-mono.git
pnpm installcd apps/main

Erstellen Sie eine .env Datei mit Ihrer Konfiguration. Unten finden Sie eine Liste der in diesem Projekt verwendeten Umgebungsvariablen:

• LeanCloud:

• NEXT_PUBLIC_LC_KEY

• NEXT_PUBLIC_LC_ID

• Posten:

• NEXT_PUBLIC_SENTRY_DSN

• SENTRY_AUTH_TOKEN

• SENTRY_PROJECT

• SENTRY_ORG

• On-Demand-ISR:

• REVALIDATION_REQUEST_TOKEN

pnpm run dev:main

---

WordPress-App

Warnung

Das Ausführen von WordPress in einem Docker-Container ist auf Computern mit niedrigeren Spezifikationen extrem langsam

>=1 GB RAM ohne MySQL 8 oder >=2 GB RAM mit MySQL 8 wird empfohlen

Dieses Projekt ist in einem Docker-Container verpackt, der auf dem offiziellen WordPress-Docker-Image basiert: wordpress:php8.0-apache.

Statisches Bild

Jeder Build gibt ein statisches Docker-Image aus (ähnlich einer typischen Containeranwendung), was bedeutet, dass die Aktualisierung von WordPress selbst oder das Hinzufügen neuer Themes/Plugins eine erneute Bereitstellung erfordert.

Permanenter Speicher

Alle Uploads werden in einem externen Speicher (Qiniu, ähnlich wie AWS S3) gespeichert, daher können wp-content/uploads als temporäre Daten behandelt werden.

Benutzerdefinierte Themen

main -App nutzt die WordPress-REST-API zum Abrufen von Daten, wordpress App fungiert als Headless-CMS. Der Theme peg wird verwendet, um das Verhalten der REST-API-Endpunkte anzupassen. Daher sollte peg/functions.php bei der Entwicklung einer wordpress -App im Mittelpunkt stehen.

Umgebungsvariablen

• MySQL-Datenbank:

• WORDPRESS_DB_HOST

• WORDPRESS_DB_NAME

• WORDPRESS_DB_PASSWORD

• WORDPRESS_DB_USER

• WORDPRESS_TABLE_PREFIX

• Einstellungen:

• WORDPRESS_DEBUG

Optional kann WORDPRESS_CONFIG_EXTRA so eingestellt werden, dass es andere Konfigurationen enthält:

• MySQL SSL-Verbindung:

• define("MYSQL_CLIENT_FLAGS", MYSQLI_CLIENT_SSL);

• Deaktivieren Sie PHP-Warnungen und -Hinweise:

• ini_set("error_reporting", E_ALL & ~E_NOTICE);

• ini_set("display_errors","Off")

• Redis-Objektcache:

• define("WP_REDIS_HOST", "redis_database_host");

• define("WP_REDIS_PASSWORD", "redis_database_pwd");"

• define("WP_REDIS_PORT", "redis_database_port")

Lokale Entwicklung

 docker build --tag ouorz-wordpress .docker run -p 8080:80
 -e WORDPRESS_DB_HOST=[dev_database_host]
 -e WORDPRESS_DB_USER=[dev_database_user]
 -e WORDPRESS_DB_PASSWORD=[dev_database_pwd]
 -e WORDPRESS_DB_NAME=[dev_database_name]
 -e WORDPRESS_DEBUG=true
 -e WORDPRESS_CONFIG_EXTRA="define('MYSQL_CLIENT_FLAGS', MYSQLI_CLIENT_SSL);" -e WORDPRESS_TABLE_PREFIX=[dev_database_prefix]
 ouorz-wordpress

Analytics-App

Dieses Projekt basiert auf Umami

Zugriff auf Geolocation-Daten

Befolgen Sie die Anweisungen hier →, um sich für Maxmind GeoLite2 anzumelden und einen Lizenzschlüssel abzurufen

Projekt-Setup

 Git-Klon [email protected]:ttttonyhe/ouorz-mono.git
pnpm installcd apps/analytics

Erstellen Sie eine .env Datei mit Ihrer Konfiguration. Unten finden Sie eine Liste der in diesem Projekt verwendeten Umgebungsvariablen:

• DATABASE_URL

• HASH_SALT

• MAXMIND_LICENSE_KEY

pnpm --filter @ouorz/analytics run build-postgresql-client
pnpm run dev:analytics

---

Twilight-Toolkit

Eine äußerst eigenwillige Front-End-Toolkit-Bibliothek

Benutzeroberfläche

Bilderbuch: https://ui.twilight-toolkit.ouorz.com →

Derzeit nur in React verfügbar, die Foundation/Adaptor-Implementierung folgt in Kürze.

Dienstprogramme

In Arbeit

---

Monorepo

Werkzeuge

Build-System: Turborepo mit Remote Caching

Monorepo-Manager: PNpm

Praktiken

Ausführen von Skripten

• Verwenden Sie Projektaliase, um Befehle in verschiedenen Paketen einfacher auszuführen:

   pnpm --filter @ouorz/main führt das Upgrade aus

• Verwenden Sie vordefinierte Turborepo-Skripte, wenn Inhaltserkennung (z. B. Caching) erforderlich ist:

   pnpm führt build:main aus

Abhängigkeiten verwalten

• Root package.json sollte nur Entwicklungsabhängigkeiten enthalten

In Bearbeitung

Statistiken

---

Entwicklung

Gitflow

Ich verfolge das allerdings nicht wirklich...

E2E-Tests

Testläufer: Cypress

Server starten:

 pnpm führt build:main aus
pnpm run start:main# orcd apps/main
pnpm führt dev:test aus

Führen Sie Tests durch:

 pnpm führt test:main aus

apps/main verwendet Cypress Dashboard. Deaktivieren Sie es, indem Sie die Konfigurationsdatei entsprechend ändern.

---

Einsatz

Apps/WordPress

Erstellen Sie das Docker-Image und stellen Sie es dann über apps/wordpress/Dockerfile bereit.

Hinweis: Standardmäßig überwacht das Image Port 80 und nicht den üblicheren 8080

Apps/Haupt

Dieses Projekt nutzt eine Kombination aus serverseitigem Rendering (SSR) und (On-Demand) inkrementeller statischer Erzeugung (ISG):

 pnpm führt build:main aus
pnpm run start:main

Apps/Analysen

 pnpm führt build:analytics aus
pnpm run start:analytics

Pakete/twilight-ui

Um das Storybook bereitzustellen, exportieren Sie es als statische Web-App:

 pnpm führt build:twilight:ui:storybook aus

Bereitstellung mit Fly.io

Die Konfigurationsdatei fly.toml finden Sie unter apps/wordpress . Persistenter Speicher sollte unter /var/www/html/wp-content bereitgestellt werden.

 Fliegenstart

Fly Secrets set WORDPRESS_DB_HOST=[dev_database_host]
 WORDPRESS_DB_USER=[dev_database_user]
 WORDPRESS_DB_PASSWORD=[dev_database_pwd]
 WORDPRESS_DB_NAME=[dev_database_name]
 WORDPRESS_DEBUG=false
 WORDPRESS_TABLE_PREFIX=[dev_database_prefix]

 fliegen bereitstellen

Optional können Volumes mit demselben Namen in mehreren Fly.io-Regionen erstellt werden, wodurch Fly eine oder mehrere Instanzen der App in mehreren Regionen ausführen kann:

 Fly-Volumes erstellen ouorz_wordpress_wp_content --region yyz --size 1 --no-encryption
Fly-Volumes erstellen ouorz_wordpress_wp_content --region fra --size 1 --no-encryption
Fly-Volumes erstellen ouorz_wordpress_wp_content --region hkg --size 1 --no-encryption

 Fliegenschuppenzahl 3

Optional bietet Fly.io vollständig verwaltete Redis-Datenbanken an, die mit den folgenden Befehlen erstellt werden können:

 Fly Redis erstellen

Der Datenverkehr wird automatisch über eine private IPv6-Adresse weitergeleitet, die auf Ihre Fly-Organisation beschränkt ist.

Bereitstellung mit Vercel / Netlify

Stellen Sie sicher, dass Sie den Stammverzeichnispfad auf apps/<project-name> festlegen, und aktualisieren Sie dann den Build-Befehl wie folgt:

 cd ../.. && pnpm run build:<Projektname>

Es wird dringend empfohlen, die diff-basierte Bereitstellung zu aktivieren:

 git diff --quiet HEAD^ HEAD ./

Lizenz

GPL-3.0