Celeris Web ist ein kostenloses Open-Source-Frontend-Entwicklungsframework, das die neuesten Technologien nutzt, darunter Vue 3, Vite und TypeScript. Sein Monorepo-Ansatz erleichtert die Verwaltung von Abhängigkeiten und die Zusammenarbeit an mehreren Projekten und bietet Entwicklern eine umfassende Lösung für die Erstellung moderner Webanwendungen.
Unabhängig davon, ob Sie ein erfahrener Entwickler sind oder gerade erst anfangen, bietet Celeris Web einen optimierten Front-End-Entwicklungsprozess, der die neuesten Tools und Techniken nutzt.
Starten Sie noch heute mit celeris-web und erleben Sie einen äußerst optimierten Front-End-Entwicklungsprozess, der die Leistungsfähigkeit der neuesten Technologien nutzt, einschließlich modernster Funktionen zur Verarbeitung natürlicher Sprache.
Diagramm TD
admin{admin}
admin -> admin-api
Admin -> Vermögenswerte
admin -> ca-components
admin -> Komponenten
admin -> Konstanten
admin -> Anweisungen
admin -> Hooks
Admin -> Gebietsschema
Admin -> Anfrage
Admin -> Stile
admin -> Typen
admin -> Dienstprogramme
Vermögenswerte
Komponenten
Komponenten -> Vermögenswerte
Komponenten -> Ca-Komponenten
Komponenten -> Konstanten
Komponenten -> Stile
Komponenten -> Typen
Komponenten -> Dienstprogramme
ca-Komponenten
ca-Komponenten -> Konstanten
ca-components -> Dienstprogramme
Richtlinien
Direktiven -> Dienstprogramme
Haken
Haken -> Typen
Gebietsschema
Gebietsschema -> Konstanten
Gebietsschema -> Typen
Gebietsschema -> Dienstprogramme
Anfrage
Anfrage -> Konstanten
Anfrage -> Gebietsschema
Anfrage -> Typen
Anfrage -> Dienstprogramme
Typen
Typen -> Konstanten
Dienstprogramme
Utils -> Typen
Admin-API
admin-api -> Konstanten
admin-api -> Typen
Um das obige Diagramm zu aktualisieren, bearbeiten Sie die README-Datei und öffnen Sie eine neue PR mit den Änderungen.
Beim Design von Celeris Web legen wir Wert auf die Lesbarkeit und Erlernbarkeit des Codes. Um dies zu erreichen, ist jede Funktion mit zweisprachigen Kommentaren in Chinesisch und Englisch ausgestattet, um sicherzustellen, dass Entwickler, unabhängig von ihrer Muttersprache, den Code leicht verstehen und daraus lernen können.
Warum zweisprachige Kommentare wählen?
Globale Zusammenarbeit: In multikulturellen Teams fördern zweisprachige Kommentare eine bessere Kommunikation und Zusammenarbeit und stellen sicher, dass die Teammitglieder die Funktionalität und Implementierung des Codes genau verstehen können.
Bequemes Lernen: Für Anfänger bieten zweisprachige Kommentare eine benutzerfreundlichere Lernumgebung und helfen ihnen, die Logik und Struktur des Codes schnell zu verstehen.
Entwicklerfreundlich: Wir sind bestrebt, eine entwicklerfreundliche Umgebung zu schaffen, und zweisprachige Kommentare sind eine entscheidende Maßnahme, die wir ergriffen haben, um dieses Ziel zu erreichen.
Beispiel:
/**
* 打开一个新的浏览器窗口
* Open a new browser window
*
* @param {string} url - 要在新窗口中打开的 URL
* The URL to open in the new window
*
* @param {object} options - 打开窗口的选项
* Options for opening the window
* @param {string} options.target - 新窗口的名称或特殊选项,默认为 "_blank"
* @param {string} options.features - 新窗口的特性(大小,位置等),默认为 "noopener=yes,noreferrer=yes"
*/
export function openWindow ( url : string , { target = "_blank" , features = "noopener=yes,noreferrer=yes" } : {
target ?: "_blank" | "_self" | "_parent" | "_top" ; // 新窗口的名称或特殊选项,默认为 "_blank"
features ?: string ; // 新窗口的特性(大小,位置等),默认为 "noopener=yes,noreferrer=yes"
} = { } ) {
window . open ( url , target , features ) ;
}
Mit diesen zweisprachigen Kommentaren möchten wir Entwicklern ein angenehmeres und effizienteres Codierungserlebnis bieten und Celeris Web zu einer Frontend-Vorlage machen, die wirklich leicht zu erlernen und in die sie eintauchen können.
1. Einfacheres Abhängigkeitsmanagement: Monorepo zentralisiert die Verwaltung von Abhängigkeiten für alle Projekte, vermeidet Versionskonflikte zwischen verschiedenen Projekten und macht das gesamte Abhängigkeitsmanagement klarer und einfacher.
2. Code-Freigabe und Wiederverwendbarkeit: Verschiedene Projekte können Code problemlos gemeinsam nutzen und wiederverwenden, wodurch die Arbeitsbelastung durch redundante Entwicklung reduziert wird. Dies ist äußerst vorteilhaft für die Aufrechterhaltung der Codekonsistenz und die Verbesserung der Entwicklungseffizienz.
3. Einheitlicher Build und Deployment: Monorepo vereinfacht den gesamten Entwicklungsprozess durch einen einheitlichen Build- und Deployment-Workflow, reduziert die Komplexität der Konfiguration und Verwaltung und verbessert die Effizienz der Zusammenarbeit innerhalb des Entwicklungsteams.
4. Einheitliche Versionskontrolle: Da sich alle Projekte im selben Versionskontroll-Repository befinden, wird die Versionsverwaltung konsistenter und kontrollierbarer. Dies hilft dem Team, versionierte Probleme besser zu verfolgen und zu bearbeiten. Das Monorepo-Design positioniert Celeris Web nicht nur als Admin-Systemvorlage, sondern auch als Frontend-Webvorlage für sich schnell entwickelnde C-End-Produkte. Mit Celeris Web wird die Reise der Frontend-Entwicklung noch entspannter und angenehmer!
Die meisten Frontend-Vorlagen auf dem Markt richten sich in erster Linie an die Bedürfnisse von B-End-Benutzern und bieten leistungsstarke Funktionen und flexible Schnittstellen für Unternehmensverwaltungssysteme (Admin). Allerdings berücksichtigen nur wenige Vorlagen die Eigenschaften von C-End-Produkten in ihrem Design, und hier setzt Celeris Web innovativ.
Die Grenzen des Admin-Managements durchbrechen:
Bei herkömmlichen Admin-Managementsystemen stehen die Datenanzeige und die Geschäftsverwaltung im Vordergrund, während bei C-End-Produkten das Benutzererlebnis und die visuelle Attraktivität im Vordergrund stehen. Celeris Web erkennt die Anforderungen von C-End-Benutzern an ästhetisch ansprechende Schnittstellen und reibungslose Interaktionen und bietet nicht nur robuste Backend-Verwaltungsfunktionen, sondern konzentriert sich auch darauf, die Frontend-Schnittstelle auf ein höheres Maß an Benutzerzufriedenheit zu bringen.
Fokussierung auf C-End-Benutzererfahrung:
Celeris Web ist nicht nur eine Vorlage für Verwaltungssysteme; Es handelt sich um eine Frontend-Webvorlage, die der Benutzererfahrung für C-End-Produkte Priorität einräumt. Unser Ziel ist es, durch die Einführung innovativer Designprinzipien die Zwänge traditioneller Admin-Systeme zu überwinden und sicherzustellen, dass die im Frontend präsentierten C-End-Produkte ein herausragendes Benutzererlebnis bieten.
Hervorgehobene Funktionen:
Mit dieser einzigartigen Designphilosophie ist Celeris Web bestrebt, neue Möglichkeiten in der Frontend-Entwicklung zu erkunden und den C-End-Produkten mehr Vitalität und Kreativität zu verleihen. Wir glauben, dass eine solche Innovation bei den Nutzern breite Anerkennung finden und zu einem höheren Produktwert beitragen wird. In der Welt von Celeris Web geht die Frontend-Entwicklung über die Grenzen von Admin-Systemen hinaus und integriert spannendere Elemente im Zusammenhang mit der Benutzererfahrung.
Erstellen Sie ein Repo aus dieser Vorlage auf GitHub.
npx degit kirklin/celeris-web my-vite-app
cd my-vite-app
pnpm i
Führen Sie einfach Folgendes aus und besuchen Sie http://localhost:8888
pnpm run dev
Um die App zu erstellen, führen Sie sie aus
pnpm run build
Und Sie sehen die generierte Datei in dist
, die zur Bereitstellung bereit ist.
Gehen Sie zu Netlify und wählen Sie Ihren Klon aus. OK
, dann ist Ihre App in einer Minute live.
Erstellen Sie zunächst das celeris-web-Image, indem Sie das Terminal im Stammverzeichnis des Projekts öffnen.
docker buildx build . -t celeris-web:latest
Führen Sie das Image aus und geben Sie die Portzuordnung mit dem Flag -p
an.
docker run --rm -it -p 8080:80 celeris-web:latest