18 Top-inländische HTML-, CSS- und JavaScript-Open-Source-Projekte

Wenn Sie ein Frontend-Entwickler sind, dann sind HTML, CSS und JavaScript drei wesentliche Grundkenntnisse, die Sie beherrschen müssen. Natürlich müssen wir auch sehr geschickt damit umgehen können. Der beste Weg, etwas zu lernen, besteht darin, die aktuellen, angesagten Open-Source-Projekte zu verstehen. Dieser Artikel zieht eine Bestandsaufnahme der Front-End-Technologie-Open-Source-Projekte mit den höchsten Bewertungen und mehr als 100 Sammlungen in China und hofft, mehr Entwicklern dabei zu helfen, ihr Wissen zu erweitern.

1. Minimalistisches modulares Front-End-UI-Framework Layui

Bewertung: 9,3; Anzahl der Sammlungen: 873

Lizenzvereinbarung: MIT

Entwicklungssprache: JavaScript, HTML/CSS

Betriebssystem: plattformübergreifend

Quellcode-Adresse: https://gitee.com/sentsin/layui

Layui wird mit einem eigenen Code geschrieben Modulspezifikationen Das emotionale Front-End-UI-Framework folgt der Schreib- und Organisationsform von nativem HTML/CSS/JS. Der Schwellenwert ist extrem niedrig und kann sofort verwendet werden. Von außen ist es minimalistisch, aber innen ist es leicht und reich an Komponenten. Jedes Detail, vom Kerncode bis zur API, ist sehr gut für die schnelle Schnittstellenentwicklung geeignet. Die erste Version von Layui wurde im goldenen Herbst 2016 veröffentlicht. Sie unterscheidet sich von den UI-Frameworks, die auf der untersten Schicht von MVVM basieren, geht aber nicht gegen den Strom, sondern glaubt an die Rückkehr zur Natur. Genauer gesagt ist es eher auf serverseitige Programmierer zugeschnitten. Sie müssen sich nicht mit der komplexen Konfiguration verschiedener Front-End-Tools befassen, sondern können sich nur mit dem Browser selbst befassen immer griffbereit gefunden werden.

2. JavaScript-Diagrammbibliothek ECharts

Bewertung: 8,9; Anzahl der Sammlungen: 2448

Lizenzvereinbarung: BSD

Entwicklungssprache: JavaScript

Betriebssystem: Plattformübergreifend

Quellcode-Adresse: https://gitee.com/echarts/echarts

ECharts ist ein Front- Von Baidu entwickelte Endtechnologie. Eine auf Javascript basierende Datenvisualisierungsdiagrammbibliothek, die vom Ministerium für Wissenschaft und Technologie entwickelt wurde und intuitive, lebendige, interaktive und anpassbare Datenvisualisierungsdiagramme bereitstellt. Bietet eine große Anzahl häufig verwendeter Datenvisualisierungsdiagramme. Die unterste Ebene basiert auf ZRender (einer neuen, leichten Canvas-Klassenbibliothek) und erstellt Koordinatensysteme, Legenden, Eingabeaufforderungen, Toolboxen und andere grundlegende Komponenten sowie die Erstellung von Liniendiagrammen (Flächendiagrammen). Oben: Histogramm (Balkendiagramm), Kreisdiagramm (Donut-Diagramm), K-Liniendiagramm, Karte, kraftgesteuertes Layoutdiagramm und Akkorddiagramm. Es unterstützt auch das Stapeln in jeder Dimension und gemischt Anzeige mehrerer Diagramme.

3. Inländisches bildschirmübergreifendes Front-End-Framework-Puzzle Pintuer

Bewertung: 8,7; Sammlung: 220

Lizenzvereinbarung: Apache

Entwicklungssprache: JavaScript, HTML/CSS

Betriebssystem: plattformübergreifend

Quellcode-Adresse: https://gitee.com/pintuer/pintuer

Puzzle Pintuer.com: Chinas hervorragendes, bildschirmübergreifendes, responsives Open-Source-Frontend-Framework für HTML, CSS und JS, das die neueste Browsertechnologie verwendet, um ein System aus Text, Symbolen, Medien, Tabellen, Formularen, Schaltflächen usw. bereitzustellen Menüs für die schnelle Front-End-Entwicklung, Grid-System und andere Stil-Toolkits, die wenig Ressourcen beanspruchen. Mit Jigsaw können Sie schnell eine einfache, elegante Front-End-Schnittstelle erstellen, die sich automatisch an Mobiltelefone, Tablets, Desktop-Computer und andere Geräte anpasst Dadurch macht die Frontend-Entwicklung genauso viel Spaß und ist so einfach wie das Spielen von Spielen.

Basierend auf dem traditionellen CSS-Framework fügt das Puzzle-Frontend-Framework HTML5, CSS3, JS und andere technische Kombinationsanwendungen hinzu und wird auf die neueste Browsertechnologie angewendet. Es ist auch mit früheren Browsern kompatibel und kombiniert Alt und Neu sowie die Übernahme der Vergangenheit und der Zukunft. Entwickler müssen lediglich die Framework-Datei in das Projekt einführen, und schon kann mit der schnellen gemeinsamen Entwicklung begonnen werden Gleichzeitig wird eine einheitliche Reaktion auf alle Geräte erreicht, was die Entwicklungseffizienz erheblich verbessert.

4. Lightweight Material Design Front-End-Framework MDUI

Bewertung: 8,6; Sammlung: 215

Lizenzvereinbarung: MIT

Entwicklungssprache: JavaScript, HTML/CSS

Betriebssystem: plattformübergreifend

Quellcode-Adresse: https://github.com/zdhxiong/mdui

MDUI ist ein leichtes Material Design-Frontend-Framework. Es wurde gemäß Material Design-Dokumenten entwickelt und ist bestrebt, die Komponenten 1:1 in Material Design zu implementieren.

Unterstützung mehrerer Themen: MDUI verfügt über 19 Primärfarben, 16 Akzentfarben und ein Nachtthema. Fügen Sie einfach eine CSS-Klasse hinzu, um das Thema zu wechseln.

Leicht: Die CSS-Datei einschließlich aller Themes ist nur 26,4 KB minimiert + gzip, die JavaScript-Datei ist nur 12 KB minimiert + gzip und weist keine Abhängigkeiten auf

Responsiv: zuerst mobil, anpassbar an alle Bildschirme .

5. Frontend-responsives UI-Framework im Win10-Stil

Bewertung: 8,5; Sammlung: 170

Autorisierungsvereinbarung: SATA

Entwickelt Sprache: JavaScript, HTML/CSS

Betriebssystem: Plattformübergreifend

Quellcode-Adresse: https://github.com/yuri2peter/win10-ui

Win10- Die Benutzeroberfläche ist ein Hintergrund-UI-Framework im Win10-Stil. Es nutzt eine Fülle von Win10-Desktop-Elementen, einschließlich Desktop-Symbolen, Fenster-Unterseitenverwaltung, Startmenü, dynamischen Kacheln und anderen Komponenten. Es ist mit gängigen modernen Browsern und mobilen Bildschirmgrößen kompatibel und eignet sich für die schnelle Entwicklung von Front-End-Schnittstellen Backend-Managementsysteme.

Win10-UI übernimmt das Rendering-Design des herkömmlichen UI-Frameworks und merkt sich den komplizierten JS-Code in der falschen Reihenfolge. Sie müssen nur die HTML-Struktur anwenden, um Desktop-Elemente einfach zu rendern. Gleichzeitig bleibt auch die aktiv aufgerufene API erhalten, sodass fortgeschrittene Entwickler die Details der Benutzeroberfläche definieren können. Es definiert nicht zu viele „Regeln“. Sie können seine Funktionen vollständig mit CSS und JS erweitern und es zu einer einzigartigen Backend-Benutzeroberfläche für Sie machen.

6.Node-Terminalschnittstellenbibliothek blessed-contrib

Bewertung: 8,5; Sammlung: 125

Lizenzvereinbarung: MIT

Entwicklungssprache: JavaScript

Betriebssystem: plattformübergreifend

Quellcode-Adresse: https://github.com/yaronn/blessed-contrib

blessed- contrib Es handelt sich um eine Bibliothek, die Node.js zum Erstellen von Terminalanwendungsschnittstellen verwendet.

7. ORY Editor, ein moderner Content-Editor basierend auf React und Redux

Bewertung: 8,3; Anzahl der Sammlungen: 109

Lizenzvereinbarung: AGPL

Entwicklungssprache: JavaScript

Betriebssystem: Plattformübergreifend

Quellcode-Adresse: https://github.com/ory/editor

ORY ist ein Unternehmen, das Entwicklertools entwickelt und pflegt. ORY Editor ist ein intelligenter, skalierbarer und moderner Editor für das Web („WYSIWYG“), geschrieben in React. Dies wäre eine gute Wahl, wenn Sie die Einschränkungen inhaltsbearbeitbarer Inhalte satt haben.

Mit dem ORY Editor können Websites erstellt werden, ähnlich wie mit Squarespace, aber er funktioniert offline, die damit erstellten Websites werden auf dem Gerät gespeichert und Sie können Ihre eigenen Designs und Plugins erstellen.

8. Animationseffekt-Framework für mobile Anwendungen Lottie

Bewertung: 8,3; Sammlung: 317

Lizenzvereinbarung: Apache

Entwicklungssprache: Java, Objective-C, JavaScript

Betriebssystem: Android

Quellcode-Adresse:

Android: https://github.com/airbnb/ lottie-android

iOS: https://github.com/airbnb/lottie-ios

React Native: https://github.com/airbnb/lottie-react-native

Lottie ist ein von Airbnb entwickeltes Open-Source-Tool, das Animationseffekte zu nativen Anwendungen hinzufügen kann. Lottie bietet derzeit iOS-, Android- und React Native-Versionen an, mit denen animierte Spezialeffekte von After Effects in Echtzeit gerendert werden können.

Derzeit unterstützt Lottie das Trimmen, Maskieren, Abdecken und andere Vorgänge von Pfaden. Es gibt auch einen optionalen Caching-Mechanismus zum schnelleren Laden häufig verwendeter Elemente. Ziel dieser App ist es, Entwicklern und Animatoren dabei zu helfen, Animationen für ihre Apps einfacher zu erstellen und so den Gesamtinteraktivitätsfaktor zu verbessern.

9. Theme-Optimierungspaket JQuery EasyUI 1.5.x von Insdep Theme

Bewertung: 8,3; Anzahl der Sammlungen: 101

Lizenz Vereinbarung: GPL

Entwicklungssprache: JavaScript

Betriebssystem: Plattformübergreifend

Quellcode-Adresse: https://gitee.com/weavors/JQuery-EasyUI-1.5 .x- Of-Insdep-Theme

Das Insdep-Theme ist ein kostenloses Verschönerungsthemenpaket, das auf EasyUI 1.5.x basiert. Es verfügt über angepasste Baidu-Editor, Cropper, Highcharts, Justgage, Plupload und andere Drittanbieter-Plug-Ins zu diesem Thema. Und verschiedene häufig verwendete JQuery-Plug-Ins werden verschönert. Weitere Themes, Komponenten und Plug-Ins von Drittanbietern werden bereitgestellt, um den Stil in Zukunft zu verschönern.

10, ein moderner Rich-Text-Editor basierend auf Ueditor

Bewertung: 8,3; Sammlungen: 503

Lizenzvereinbarung: MIT

Entwicklungssprache: JavaScript

Betriebssystem: plattformübergreifend

Quellcode-Adresse: https://gitee.com/notadd/neditor

Baidu Front-End-Team Nach vielen Bemühungen gilt Ueditor nun als der nützlichste chinesische Rich-Text-Editor. Aber mit der Zeit hat jeder das Gefühl, dass Baidu Editor nicht so schön ist. Also haben wir Ueditor modifiziert und den aktuellen Neditor erhalten.

11. UI-Komponentenbibliothek basierend auf Vue.js

Bewertung: 8,3; Sammlungen: 475

Lizenzvereinbarung: MIT

Entwicklungssprache: HTML/CSS

Betriebssystem: plattformübergreifend

Quellcode-Adresse: https://gitee.com/icarusion/iview

iView Es handelt sich um eine Reihe von UI-Komponentenbibliotheken basierend auf Vue.js, die hauptsächlich die Middle- und Backend-Produkte der PC-Schnittstelle bedienen.

Funktionen

Hohe Qualität, funktionsreich

Freundliche API, kostenlose und flexible Raumnutzung

Nutzung Single Das Vue-Komponentenentwicklungsmodell der Datei

basiert auf npm + webpack + babel und unterstützt ES2015

12. Basierend auf der Vue 2.0-Komponentenbibliothek Element

Bewertung : 8,2; Anzahl der Sammlungen: 609

Lizenzvereinbarung: MIT

Entwicklungssprache: JavaScript

Betriebssystem: Plattformübergreifend

Quellcode-Adresse: https://github.com/ ElemeFE/element

Element ist eine Vue 2.0-basierte Komponentenbibliothek für Entwickler, Designer und Produktmanager. Sie bietet unterstützende Designressourcen, damit Ihre Website schnell Gestalt annimmt. Es ist Open Source vom Front-End-Team von Ele.me.

13.HTML5 Cross-Screen-Frontend-Framework Amaze UI

Bewertung: 8,1; Sammlungen: 1213

Lizenzvereinbarung: MIT

Entwicklungssprache: JavaScript, HTML/CSS

Betriebssystem: plattformübergreifend

Quellcode-Adresse: https://gitee.com/amazeui/amazeui

Amaze UI übernimmt die modernsten internationalen „Komponenten-basierten Entwicklungs“- und „Mobile-First“-Designkonzepte. Basierend auf seinen umfangreichen Komponenten können Entwickler durch einfache Montage schnell HTML5-Webanwendungen erstellen Innerhalb eines halben Jahres hat sich Amaze UI zum beliebtesten Frontend-Framework in China entwickelt. Es hat derzeit fast 10.000 Sterne auf Github und bedient 500.000 Entwickler auf der ganzen Welt.

14, eine UI-Bibliothek speziell für WeChat

Bewertung: 7,7; Sammlung: 2002

Lizenzvereinbarung: MIT

Entwicklungssprache: JavaScript, HTML/CSS

Betriebssystem: Plattformübergreifend

WeUI ist eine UI-Bibliothek, die vom offiziellen WeChat-Designteam speziell für mobile WeChat-Webanwendungen entwickelt wurde.

WeUI ist eine grundlegende Stilbibliothek, die mit der nativen visuellen Erfahrung von WeChat übereinstimmt. Sie ist maßgeschneidert für die WeChat-Webentwicklung und kann die Benutzerwahrnehmung einheitlicher gestalten. Enthält verschiedene Elemente wie Schaltfläche, Zelle, Dialog, Toast, Artikel, Symbol usw.

15. Dashboard WebApp Template AdminLTE

Bewertung: 7,6; Anzahl der Sammlungen: 136

Lizenzvereinbarung: MIT

Entwicklungssprache: JavaScript, HTML/CSS

Betriebssystem: plattformübergreifend

Quellcode-Adresse: https://github.com/almasaeed2010/AdminLTE/

AdminLTE Ja Beliebte Open-Source-Webanwendungsvorlage für Admin-Dashboards und Control Panels. Es handelt sich um ein CSS-Framework, das auf Bootstrap 3 basiert, einer responsiven HTML-Vorlage. Nutzen Sie alle Bootstrap-Komponenten, um die meisten verwendeten Plugins zu entwerfen und zu gestalten und so ein konsistentes Benutzeroberflächendesign zu erstellen, das als Backend-Anwendung verwendet werden kann. AdminLTE basiert auf einem modularen Aufbau und kann darauf aufbauend einfach angepasst und neu erstellt werden.

16. Web-Online-Bereitstellungssystem-Tool Walle

Bewertung: 7,4; Anzahl der Sammlungen: 359

Lizenzvereinbarung: MIT

Entwicklungssprache: PHP, HTML/CSS

Betriebssystem: plattformübergreifend

Walle ist ein Web-Deployment-System-Tool mit einfacher Konfiguration, vollständigen Funktionen, reibungsloser Benutzeroberfläche und sofort einsatzbereit -Out of the box verwenden! Unterstützt die Git- und SVN-Versionsverwaltung sowie verschiedene Webcode-Releases. Die Veröffentlichung und das Rollback von PHP-, Python-, JAVA- und anderen Codes können mit einem Klick über das Web abgeschlossen werden.

17. Website-Management-Hintergrundvorlage Charisma

Bewertung: 7,4; Anzahl der Sammlungen: 1055

Lizenzvereinbarung: Apache

Entwicklungssprache: HTML/CSS

Betriebssystem: plattformübergreifend

Charisma ist eine responsive Website-Management-Hintergrundvorlage basierend auf Twitter Bootstrap, einschließlich 9 Sätzen wunderschöner Themen.

18. Open-Source-Kanban-Managementsystem LibreBoard

Bewertung: 7,4; Sammlung: 380

Lizenzvereinbarung: MIT

Entwicklungssprache: JavaScript, HTML/CSS

Betriebssystem: plattformübergreifend

LibreBoard ist eine Open-Source-Implementierung von Kanban, einer kartenbasierten Organisation. Es kann zur kollaborativen Kommunikation innerhalb eines Teams verwendet werden. Sie können sich LibreBoard als eine Open-Source-Version von Trello vorstellen. LibreBoard bietet eine Ein-Klick-Installation und ein verifiziertes Docker-Image für die Sandstorm-Plattform.

Der obige Inhalt ist eine kurze Einführung in 18 beliebte inländische Open-Source-Projekte zum Thema Front-End-Entwicklung. Ich hoffe, dass er allen helfen kann.

Verwandte Empfehlungen:

Einführung einer Microsoft-Open-Source-Projekt-Website – CodePlex

Eine Sammlung hervorragender PHP-Open-Source-Projekte

Zusammenfassung der PHP-Open-Source-Projekte

Das obige ist der detaillierte Inhalt von18 Top-inländische HTML-, CSS- und JavaScript-Open-Source-Projekte. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!