oftadeh react admin

オフタデ React 管理者

Oftadeh - React Admin Responsive Template は、完全に Javascript (reactjs およびmaterial-ui) で書かれた React アプリであり、jQuery への依存関係はありません。

ライブデモを表示するには、ここをクリックしてください。

反応する

React はテンプレートの中核です。 React が何なのかわからない場合、またはその使用方法がわからない場合は、Oftadeh で何かを始める前に React を確認することを強くお勧めします。

React アプリの作成 (CLI)

Create React App は、React アプリケーションの構築を支援するために Facebook の開発者によって構築されたツールです。時間のかかるセットアップや構成を省略できます。

目次

• オフタデ React 管理者
  • 反応する
  • React アプリの作成 (CLI)
  • 目次
  • 前提条件
    • Node.js
  • インストール
    • 発達
    • 生産
    • 導入
  • プロジェクトの構造
  • 出典とクレジット
  • 利用可能なスクリプト
    • npm start
    • npm test
    • npm run build
    • npm run eject
  • もっと詳しく知る
    • コード分​​割
    • バンドルサイズの分析
    • プログレッシブ Web アプリの作成
    • 高度な構成
    • 導入
    • npm run build縮小に失敗する
  • ライセンス
  • 寄付する

前提条件

このセクションでは、必要なツールについて説明します。

Node.js

Oftadeh React をインストールして使用するには、Node.js がコンピューターにインストールされている必要があります。 Node.js については、このドキュメントの範囲外であるため、あまり詳しく説明しません。また、Node.js を実際に使用する必要はありません。開発プロセスでのみ必要です。

インストール

A.前提条件のインストール
Web サイトから少なくとも LTS または最新バージョンの Node.js をダウンロードしてインストールします。

B.Oftadeh React のインストール
お気に入りのコンソール アプリケーション (ターミナル、コマンド プロンプトなど) を開き、作業フォルダーに移動し、次のコマンドを実行して完了するまで待ちます。

npm install

このコマンドは、必要なすべての Node.js モジュールを作業フォルダー内の node_modules ディレクトリにインストールします。
これで、Oftadeh React を初めて実行する準備が整いました。

発達

作業フォルダー内で、コンソール アプリケーションで次のコマンドを実行します。

npm start

それで終わりです。 create-react-app がすべてを処理し、Oftadeh React を開始します。
コンソール アプリケーションをチェックアウトして、サーバーに関する詳細情報を取得できます。デフォルトでは、[http://localhost:3000](http://localhost:3000) で実行されますが、設定によっては変更される可能性があります。

生産

次のコマンドは、アプリケーションを出力ディレクトリにビルドします。

npm run build

アプリケーションを /build ディレクトリにコンパイルします

導入

Facebook の create-react-app ドキュメント:Deployment でチェックアウトしてください

プロジェクトの構造

Oftadeh React のプロジェクト構造は次のとおりです。

出典とクレジット

• マテリアルUI
• clsx
• 反応-ドラフト-wysiwyg
• ジョディット反応
• マテリアルデザインアイコン
• fslightbox
• 反応ルーターダム
• 材料テーブル
• mui-datatables
• 一瞬
• 反応-ビッグ-カレンダー
• 再チャート
• 反応チャートjs-2

このプロジェクトは、Create React App を使用してブートストラップされました。

利用可能なスクリプト

プロジェクト ディレクトリでは、次を実行できます。

npm start

アプリを開発モードで実行します。
http://localhost:3000 を開いてブラウザで表示します。

編集を行うとページがリロードされます。
コンソールには lint エラーも表示されます。

npm test

インタラクティブウォッチモードでテストランナーを起動します。
詳細については、テストの実行に関するセクションを参照してください。

npm run build

実稼働用のアプリをbuildフォルダーにビルドします。
React を実稼働モードに正しくバンドルし、最高のパフォーマンスが得られるようにビルドを最適化します。

ビルドは縮小され、ファイル名にはハッシュが含まれます。
アプリをデプロイする準備ができました。

詳細については、展開に関するセクションを参照してください。

npm run eject

注: これは一方向の操作です。一度ejectと、元に戻すことはできません。

ビルド ツールと構成の選択に満足できない場合は、いつでもejectことができます。このコマンドは、プロジェクトから単一のビルド依存関係を削除します。

代わりに、すべての構成ファイルと推移的な依存関係 (webpack、Babel、ESLint など) がプロジェクトに直接コピーされるため、それらを完全に制御できます。 ejectを除くすべてのコマンドは引き続き機能しますが、コピーされたスクリプトを指すため、調整することができます。この時点では、あなたは一人です。

eject使用する必要はありません。厳選された機能セットは小規模および中規模の展開に適しており、この機能を使用する義務を感じる必要はありません。ただし、準備ができたときにカスタマイズできなければ、このツールは役に立たないことは理解しています。

もっと詳しく知る

詳細については、Create React App のドキュメントをご覧ください。

React について学習するには、React のドキュメントを参照してください。

コード分​​割

このセクションはここに移動しました: https://facebook.github.io/create-react-app/docs/code-splitting

バンドルサイズの分析

このセクションはここに移動しました: https://facebook.github.io/create-react-app/docs/analyzing-the-bundle-size

プログレッシブ Web アプリの作成

このセクションはここに移動しました: https://facebook.github.io/create-react-app/docs/making-a-progressive-web-app

高度な構成

このセクションはここに移動しました: https://facebook.github.io/create-react-app/docs/advanced-configuration

導入

このセクションはここに移動しました: https://facebook.github.io/create-react-app/docs/deployment

npm run build縮小に失敗する

このセクションはここに移動しました: https://facebook.github.io/create-react-app/docs/troubleshooting#npm-run-build-fails-to-minify

ライセンス

完全無料（MIT）！詳細については、LICENSE.md を参照してください。

寄付する

私たちに寄付することができます。寄付のためのリンク