あなたがフロントエンド開発者であれば、HTML、CSS、JavaScript はマスターしなければならない 3 つの重要な基本スキルです。もちろん、それを使いこなすには非常に熟練した技術も必要です。学ぶための最良の方法は、現在注目のオープンソース プロジェクトを理解することです。この記事では、より多くの開発者が学習を拡大できるよう、中国で最も高い評価と 100 を超えるコレクションを持つフロントエンド テクノロジのオープンソース プロジェクトを取り上げます。
1. ミニマリストのモジュラー フロントエンド UI フレームワーク Layui
評価: 9.3; コレクション数: 873
認可契約: MIT
開発言語: JavaScript、HTML/CSS
オペレーティング システム: クロスプラットフォーム
コードアドレス: https://gitee.com/sentsin/layui
Layui は、独自のモジュール仕様で書かれたセンチメンタルなフロントエンド UI フレームワークであり、ネイティブ HTML/CSS/JS の記述形式と構成形式に従います。非常に低く、すぐに使用できます。外観はシンプルですが、内部は充実しており、コア コードから API に至るまですべての詳細が注意深く作成されており、迅速なインターフェイス開発に非常に適しています。 Layui の最初のバージョンは、2016 年の黄金の秋にリリースされました。Layui は、MVVM の最下位層に基づいた UI フレームワークとは異なりますが、方向性に反することなく、自然に戻ることを信じています。正確に言うと、サーバー側プログラマ向けにカスタマイズされており、さまざまなフロントエンド ツールの複雑な設定に関与する必要はなく、ブラウザ自体とすべての要素および操作に取り組むだけで済みます。必要なものがすぐに見つかります。
2. JavaScript チャート ライブラリ ECharts
評価: 8.9; コレクション: 2448
ライセンス契約: BSD
開発言語: JavaScript
オペレーティング システム: クロスプラットフォーム
ソース コード アドレス: https:// gitee .com/echarts/echarts
ECharts は、Baidu のフロントエンド技術部門によって開発された Javascript ベースのデータ視覚化チャート ライブラリであり、直観的で鮮やか、インタラクティブでカスタマイズ可能なデータ視覚化チャートを提供します。下部レイヤーは ZRender (新しい軽量キャンバス クラス ライブラリ) に基づいており、座標系、凡例、プロンプト、ツールボックス、その他の基本コンポーネントを作成し、折れ線グラフ (面グラフ) を構築します。ヒストグラム (棒グラフ)、散布図 (バブル チャート)、円グラフ (ドーナツ チャート)、K ライン チャート、マップ、力指向のレイアウト チャート、およびコード チャートの組み合わせもサポートしています。複数のチャートの表示。
3. 国内のクロススクリーンレスポンシブフロントエンドフレームワークパズル Pintuer
評価: 8.7、コレクション: 220
認可契約: Apache
開発言語: JavaScript、HTML/CSS
オペレーティングシステム: クロスプラットフォーム
ソースコードアドレス: https://gitee.com/pintuer/pintuer
Puzzle Pintuer.com: 国内の優れた HTML、CSS、JS クロススクリーン応答型のオープンソース フロントエンド フレームワークで、最新のブラウザー技術を使用して、迅速なフロントエンド開発 テキスト、アイコン、メディア、テーブル、フォーム、ボタン、メニュー、グリッド システムなどのスタイル ツールキットのシステム。ジグソーを使用して、シンプルでエレガントなフロントエンドを迅速に構築します。このインターフェイスにより、携帯電話、タブレット、デスクトップ コンピューター、その他のデバイスに自動的に適応し、ゲームをプレイするのと同じくらい楽しく簡単にフロントエンド開発を行うことができます。
Jigsaw フロントエンド フレームワークは、従来の CSS フレームワークに基づいて、HTML5、CSS3、JS およびその他のテクノロジーを組み合わせたアプリケーションを追加し、最新のブラウザー テクノロジーに適用され、古いブラウザーと新しいブラウザーを組み合わせます。開発者はフレームワークファイルをプロジェクトに導入するだけで迅速な共同開発が可能となり、PCサイトとモバイルサイトを同時に構築するというこれまでの状況を一変させ、あらゆるデバイスへのワンストップ対応を実現し、大幅な改善を実現しました。開発効率。
4. 軽量マテリアルデザインフロントエンドフレームワーク MDUI
評価: 8.6、コレクション: 215
ライセンス契約: MIT
開発言語: JavaScript、HTML/CSS
オペレーティングシステム: クロスプラットフォーム
ソースコードのアドレス: https://github.com/zdhxiong/mdui
MDUI は、マテリアル デザインの軽量フロントエンド フレームワークであり、マテリアル デザインのドキュメントに従って開発され、マテリアルのコンポーネントの 1:1 実装を実現するよう努めています。デザイン。
複数のテーマのサポート: MDUI には 19 のメインカラー、16 のアクセントカラー、および夜のテーマがあります。 CSS クラスを追加するだけでテーマを切り替えることができます。
軽量: すべてのテーマを含む CSS ファイルはわずか 26.4 KB の縮小 + gzip、JavaScript ファイルはわずか 12 KB の縮小 + gzip で、依存関係はありません。
レスポンシブ: モバイルファーストで、すべての画面に適応します。
5. Win10 スタイルのフロントエンド応答性 UI フレームワーク Win10-UI
評価: 8.5、コレクション: 170
ライセンス契約: SATA
開発言語: JavaScript、HTML/CSS
オペレーティング システム: クロスプラットフォーム
ソースコードアドレス: https://github.com/yuri2peter/win10-ui
Win10-UI は、win10 スタイルのバックグラウンド UI フレームワークです。デスクトップ アイコン、ウィンドウ サブページ管理、スタート メニュー、動的タイル、その他のコンポーネントを含む、Win10 デスクトップ要素を豊富に使用しています。主流の最新ブラウザやモバイル画面サイズと互換性があり、フロントエンド インターフェイスの迅速な開発に適しています。バックエンド管理システム。
Win10-UI は、従来の UI フレームワークのレンダリング設計を採用しており、複雑な JS コードを順不同で記憶し、HTML 構造を適用するだけでデスクトップ要素を簡単にレンダリングできます。同時に、アクティブに呼び出される API も保持されるため、上級開発者は UI の詳細を定義できます。あまり多くの「ルール」を定義する必要はありません。css と js を使用して完全に機能を拡張し、独自のバックエンド UI にすることができます。
6.ノードターミナルインターフェースライブラリblessed-contrib
評価: 8.5; コレクション: 125
認可契約: MIT
開発言語: JavaScript
オペレーティングシステム: クロスプラットフォーム
ソースコードアドレス: https : //github.com/yaronn/blessed-contrib
blessed-contrib は、Node.js を使用してターミナル アプリケーション インターフェイスを構築するためのライブラリです。
7. ORY Editor、React と Redux に基づく最新のコンテンツエディタ
評価: 8.3; コレクション: 109
ライセンス契約: AGPL
開発言語: JavaScript
オペレーティング システム: クロスプラットフォーム
ソースコードアドレス: https://github.com/ory/editor
ORY は、開発者ツールを構築および保守する会社です。ORY Editor は、React を使用して書かれた、スマートでスケーラブルな最新の Web エディター (「WYSIWYG」) です。 。 contenteditable の制限にうんざりしている場合は、これが良い選択となるでしょう。
ORY Editor は、Squarespace と同様に Web サイトの作成に使用できますが、オフラインで動作し、ORY Editor で作成されたサイトはデバイスに保存され、独自のデザインやプラグインを作成できます。
9. Insdepテーマのテーマ最適化パッケージJQuery EasyUI 1.5.x
コレクション数: 101
ライセンス契約: GPL
開発言語: JavaScript
オペレーティングシステム: クロスプラットフォーム
ソースコードアドレス: https://gitee.com/weavors/JQuery-EasyUI-1.5.x-Of-Insdep-Theme
Insdep テーマは、Baidu エディターとクロッパーを備えた EasyUI 1.5.x に基づく無料の美化テーマ パッケージです、Highcharts、justgage、plupload、およびこのテーマに適合したその他のサードパーティのプラグイン美化パッチ。また、一般的に使用されるさまざまな Jquery プラグインが美化されています。将来的には、スタイルを美しくするために、より多くのテーマ、コンポーネント、サードパーティのプラグインが提供される予定です。
10. Neditor、Ueditor に基づく最新のリッチ テキスト エディタ
評価: 8.3; コレクション: 503
認可契約: MIT
開発言語: JavaScript
オペレーティング システム: クロスプラットフォーム
アドレス: https://gitee.com/notadd/neditor
Baidu フロントエンド チームは多大な努力を重ね、現在、Ueditor は最も便利な中国語リッチ テキスト エディターとして認められています。しかし、時間が経つにつれて、百度編集者はそれほど美しくないと誰もが感じます。そこで、Ueditor を修正して、現在の Neditor を入手しました。
11. Vue.js に基づく UI コンポーネント ライブラリ iView
評価: 8.3; コレクション: 475
認可契約: MIT
開発言語: HTML/CSS
オペレーティング システム: クロスプラットフォーム
コードアドレス: https://gitee.com/icarusion/iview
iView は、主に PC インターフェイスのミドルエンド製品とバックエンド製品を提供する、Vue.js に基づく UI コンポーネント ライブラリのセットです。
特徴
高品質、機能豊富
フレンドリーなAPI、自由で柔軟なスペースの使用
単一ファイルのVueコンポーネント開発モデルを使用
npm + webpack + babelに基づいて開発され、ES2015をサポート
12 .Vue 2.0 コンポーネント ライブラリに基づく Element
評価: 8.2; コレクション数: 609
認可契約: MIT
開発言語: JavaScript
オペレーティング システム: クロスプラットフォーム
ソース コード アドレス: https:/ /github.com/ElemeFE/element
Element は、開発者、デザイナー、プロダクト マネージャー向けに用意された Vue 2.0 ベースのコンポーネント ライブラリであり、Web サイトを迅速に形にするためのサポート設計リソースを提供します。 Ele.me のフロントエンド チームによってオープンソース化されています。
13.HTML5 クロススクリーン フロントエンド フレームワーク Amaze UI
評価: 8.1; コレクション: 1213
認可契約: MIT
開発言語: JavaScript、HTML/CSS
オペレーティング システム: クロスプラットフォーム
ソースコードアドレス: https://gitee.com/amazeui/amazeui
Amaze UI は、最先端の国際的な「コンポーネントベース開発」と「モバイルファースト」の設計コンセプトを採用しており、開発者はその豊富なコンポーネントに基づいて、発売からわずか半年で HTML5 Web アプリケーションを迅速に構築できます。 Amaze UI 中国で最も人気のあるフロントエンド フレームワークとなり、現在 Github に 10,000 近くのスターがあり、世界中の 500,000 人の開発者にサービスを提供しています。
14. WeUI、WeChat用に特別に設計されたUIライブラリ
評価: 7.7; コレクション: 2002
ライセンス契約: MIT
開発言語: JavaScript、HTML/CSS
オペレーティングシステム: クロスプラットフォーム
WeUI は、WeChat モバイル Web アプリケーション専用に WeChat の公式デザイン チームによって設計された UI ライブラリです。
WeUI は、WeChat のネイティブなビジュアル エクスペリエンスと一致する基本的なスタイル ライブラリであり、WeChat Web 開発向けにカスタマイズされており、ユーザーの使用認識をより統一できます。ボタン、セル、ダイアログ、トースト、記事、アイコンなどのさまざまな要素が含まれています。
オペレーティングシステム:クロスプラットフォームa カードベースの組織であるカンバンのオープンソース実装。 LibreBoard は、Trello のオープンソース バージョンと考えることができます。 LibreBoard は、Sandstorm プラットフォーム用のワンクリック インストールと検証済みの Docker イメージを提供します。
上記の内容は、フロントエンド開発に関する国内の人気オープンソースプロジェクト18件を簡単に紹介したものであり、皆様のお役に立てれば幸いです。
関連する推奨事項:
Microsoft オープンソース プロジェクト Web サイトの紹介 - CodePlex 優れた PHP オープン ソース プロジェクトのコレクション PHP オープン ソース プロジェクトの概要以上が国内の上位 18 の HTML、CSS、JavaScript オープンソース プロジェクトの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

PHPは、現代のWeb開発、特にコンテンツ管理とeコマースプラットフォームで依然として重要です。 1)PHPには、LaravelやSymfonyなどの豊富なエコシステムと強力なフレームワークサポートがあります。 2)パフォーマンスの最適化は、Opcacheとnginxを通じて達成できます。 3)PHP8.0は、パフォーマンスを改善するためにJITコンパイラを導入します。 4)クラウドネイティブアプリケーションは、DockerおよびKubernetesを介して展開され、柔軟性とスケーラビリティを向上させます。

PHPは、特に迅速な開発や動的なコンテンツの処理に適していますが、データサイエンスとエンタープライズレベルのアプリケーションには良くありません。 Pythonと比較して、PHPはWeb開発においてより多くの利点がありますが、データサイエンスの分野ではPythonほど良くありません。 Javaと比較して、PHPはエンタープライズレベルのアプリケーションでより悪化しますが、Web開発により柔軟性があります。 JavaScriptと比較して、PHPはバックエンド開発により簡潔ですが、フロントエンド開発のJavaScriptほど良くありません。

PHPとPythonにはそれぞれ独自の利点があり、さまざまなシナリオに適しています。 1.PHPはWeb開発に適しており、組み込みのWebサーバーとRich Functionライブラリを提供します。 2。Pythonは、簡潔な構文と強力な標準ライブラリを備えたデータサイエンスと機械学習に適しています。選択するときは、プロジェクトの要件に基づいて決定する必要があります。

PHPは、サーバー側で広く使用されているスクリプト言語で、特にWeb開発に適しています。 1.PHPは、HTMLを埋め込み、HTTP要求と応答を処理し、さまざまなデータベースをサポートできます。 2.PHPは、ダイナミックWebコンテンツ、プロセスフォームデータ、アクセスデータベースなどを生成するために使用され、強力なコミュニティサポートとオープンソースリソースを備えています。 3。PHPは解釈された言語であり、実行プロセスには語彙分析、文法分析、編集、実行が含まれます。 4.PHPは、ユーザー登録システムなどの高度なアプリケーションについてMySQLと組み合わせることができます。 5。PHPをデバッグするときは、error_reporting()やvar_dump()などの関数を使用できます。 6. PHPコードを最適化して、キャッシュメカニズムを使用し、データベースクエリを最適化し、組み込み関数を使用します。 7

PHPが多くのWebサイトよりも優先テクノロジースタックである理由には、その使いやすさ、強力なコミュニティサポート、広範な使用が含まれます。 1)初心者に適した学習と使用が簡単です。 2)巨大な開発者コミュニティと豊富なリソースを持っています。 3)WordPress、Drupal、その他のプラットフォームで広く使用されています。 4)Webサーバーとしっかりと統合して、開発の展開を簡素化します。

PHPは、特にWeb開発の分野で、最新のプログラミングで強力で広く使用されているツールのままです。 1)PHPは使いやすく、データベースとシームレスに統合されており、多くの開発者にとって最初の選択肢です。 2)動的コンテンツ生成とオブジェクト指向プログラミングをサポートし、Webサイトを迅速に作成および保守するのに適しています。 3)PHPのパフォーマンスは、データベースクエリをキャッシュおよび最適化することで改善でき、その広範なコミュニティと豊富なエコシステムにより、今日のテクノロジースタックでは依然として重要になります。

PHPでは、弱い参照クラスを通じて弱い参照が実装され、ガベージコレクターがオブジェクトの回収を妨げません。弱い参照は、キャッシュシステムやイベントリスナーなどのシナリオに適しています。オブジェクトの生存を保証することはできず、ごみ収集が遅れる可能性があることに注意する必要があります。

\ _ \ _ Invokeメソッドを使用すると、オブジェクトを関数のように呼び出すことができます。 1。オブジェクトを呼び出すことができるように\ _ \ _呼び出しメソッドを定義します。 2。$ obj(...)構文を使用すると、PHPは\ _ \ _ Invokeメソッドを実行します。 3。ロギングや計算機、コードの柔軟性の向上、読みやすさなどのシナリオに適しています。


ホットAIツール

Undresser.AI Undress
リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover
写真から衣服を削除するオンライン AI ツール。

Undress AI Tool
脱衣画像を無料で

Clothoff.io
AI衣類リムーバー

AI Hentai Generator
AIヘンタイを無料で生成します。

人気の記事

ホットツール

MinGW - Minimalist GNU for Windows
このプロジェクトは osdn.net/projects/mingw に移行中です。引き続きそこでフォローしていただけます。 MinGW: GNU Compiler Collection (GCC) のネイティブ Windows ポートであり、ネイティブ Windows アプリケーションを構築するための自由に配布可能なインポート ライブラリとヘッダー ファイルであり、C99 機能をサポートする MSVC ランタイムの拡張機能が含まれています。すべての MinGW ソフトウェアは 64 ビット Windows プラットフォームで実行できます。

MantisBT
Mantis は、製品の欠陥追跡を支援するために設計された、導入が簡単な Web ベースの欠陥追跡ツールです。 PHP、MySQL、Web サーバーが必要です。デモおよびホスティング サービスをチェックしてください。

Safe Exam Browser
Safe Exam Browser は、オンライン試験を安全に受験するための安全なブラウザ環境です。このソフトウェアは、あらゆるコンピュータを安全なワークステーションに変えます。あらゆるユーティリティへのアクセスを制御し、学生が無許可のリソースを使用するのを防ぎます。

SublimeText3 Mac版
神レベルのコード編集ソフト(SublimeText3)

Dreamweaver Mac版
ビジュアル Web 開発ツール
