Web アプリケーションの構(gòu)築には、データベース操作、サーバー側(cè)操作、クライアント側(cè)操作を処理するためにさまざまなテクノロジとツールを使用する必要があります。 サーバーからのデータを処理して表示します。始める前に 新しいプロジェクト、すべてのツール、およびプロジェクト構(gòu)造をセットアップする必要があります。これは、 時(shí)間のかかる作業(yè)。フレームワークまたは スタック を使用してこのタスクを?qū)g行すると、処理を高速化できます。 開(kāi)発を行い、開(kāi)発者の作業(yè)を容易にします。
平均とは
「MEAN は、最新の Web アプリケーション用のフルスタック JavaScript プラットフォームです?!?
これは、MEAN スタックの作成者が Web サイトで定義している方法です。 MEAN があらゆる種類(lèi) (サーバー側(cè)とクライアント側(cè)) の JavaScript 開(kāi)発者を?qū)澫螭趣筏皮い毪长趣厦鳏椁扦ⅳ?、スタックです?プラットフォームとは、複數(shù)のコンポーネントで構(gòu)成されていることを意味します。
コンポーネントは次のとおりです:
- モンゴDB ###速達(dá)便###
- AngularJS
- NodeJS
- ご覧のとおり、MEAN には、最も使用され評(píng)価されている 4 つの機(jī)能がまとめられています。 JavaScript 開(kāi)発テクノロジは開(kāi)発を容易にする基盤(pán)を構(gòu)築します 複雑な Web アプリケーションを構(gòu)築します。
MEAN スタックは 2 つの方法でインストールできます:
mean.io Web サイトを使用する
さまざまな Yeoman ジェネレーターを使用します。
- サイトを使用して MEAN をインストールします
- この方法は非常に簡(jiǎn)単です。あなたがしなければならないのは訪(fǎng)問(wèn)することだけです means.io Web サイトからフレームワークをダウンロードできます
ファイルを開(kāi)くには、大きな緑色のボタンをクリックします。
ここで利用できるもう 1 つのオプションは、Git リポジトリのクローンを作成することです。一つだけ開(kāi)けて
ターミナルに移動(dòng)し、次のコマンドを?qū)g行します:
リーリー
Yeoman を使用して MEAN をインストールする
さまざまな人々によって作成された、いくつかの Yeoman ジェネレーターがあります。 開(kāi)発者。ジェネレーターを使用した MEAN のインストールは 2 つのステップで行われます。 ジェネレーターをインストールします:
リーリー次に、yo を使用してアプリケーションを作成します:
リーリー上の例では、
meanstackジェネレーターがインストールされており、Yeoman もインストールされていることを前提としています。 MEAN ジェネレーターのリストについては、これを確認(rèn)してください。 リンクして「平均」でフィルターします。のために Yeoman のインストールについては、Yeoman の Web サイトを參照してください。
Addy Osmani が非常に興味深いブログ投稿を書(shū)きました
MEAN スタックと Yeoman ジェネレーターについて。ジェネレーターを使用してスタックをインストールする方法を?qū)Wぶには、その記事を読むことを強(qiáng)くお?jiǎng)幛幛筏蓼埂?
この記事では、Git クローン方法を使用します。
インストール後
インストール後、
cdを MEAN スタックがインストールされているフォルダーに置くだけです そして、
grunt コマンドを発行します (grunt-cli
がインストールされている必要があります)。これ
このコマンドはポート 3000 でリッスンするサーバーを起動(dòng)するので、アクセスします。
http://localhost:3000
次のコンテンツがブラウザに表示されます:
MEAN スタックは、実際には完全に機(jī)能するブログ エンジン アプリケーションです。それは持っています
Facebook、GitHub、Twitter、Google などのさまざまな方法を使用して認(rèn)証します。
簡(jiǎn)単なメールアドレスとパスワードでも可能です。
きっと今頃、コードが見(jiàn)たくてたまらないでしょう...それでは、見(jiàn)てみましょう。平均 スタック フォルダー構(gòu)造は次のようになります:
サーバー部分
サーバーは 2 つのフォルダーと 1 つのファイルに分かれています:
app
フォルダー -- app
- を構(gòu)成するコントローラー、モデル、ビューが含まれています
応用###
フォルダー - アプリケーションのさまざまな部分を制御するファイルが含まれています 行儀良くしてください
- server.js
- アプリケーションのエントリ ポイントです
- 一つずつ見(jiàn)ていきましょう:
これはアプリケーション全體を開(kāi)始するファイルです。使用したくない場(chǎng)合は、
grunt
node server,js
を使用してサーバーを起動(dòng)できます。
server.js
責(zé)任のあるファイル:
設(shè)定をロードしています。アプリケーション自體の構(gòu)成に使用されるファイル、
認(rèn)証とデータベース接続がロードされます。
ブートストラップ モデル。これは、モデル フォルダーを反復(fù)処理することによって行われます。
このフォルダー (またはそのサブディレクトリ) 內(nèi)のすべてのファイルをロードします。
- ガイドパスポート
- Express アプリケーションを初期化する
- Express アプリケーションの構(gòu)成
- クイック アプリケーション ルートの構(gòu)成
- 設(shè)定されたポートでのリッスンを開(kāi)始します。
- config
- フォルダー
env 開(kāi)発、実稼働、テスト用の構(gòu)成を含むフォルダー
アプリケーションが実行されるモード。
さらに、アプリケーション自體の構(gòu)成を含むファイルもあります。
ログイン用のエクスプレスセクションとパスポートの設(shè)定。
アプリ
app フォルダーには、サーバー側(cè)のコード全體が保存されます。このフォルダ
MVC を構(gòu)成するコントローラー、モデル、ビューを含むサブフォルダー
サーバー アプリケーションと提供されたルートのフォルダー。
デフォルトでは、記事、ユーザー用のコントローラー ファイルとインデックス ファイルがあります。 ルートパス。さらに、記事とユーザーのモデルとルートが作成されました アーティクル、ユーザー、ルートのパスはインストール中に作成されます。
デフォルトで作成されるビューの場(chǎng)合、次の構(gòu)造が作成されます:

includes
フォルダーにはページのフッターとヘッダー部分が含まれます
アプリケーションに屬するすべてのページに挿入されます。 レイアウト
フォルダー
ページ レイアウトの基本的な HTML が含まれています。このレイアウトは、views
フォルダーから index.html
ファイルまで拡張されます。
users
フォルダーには、ログイン、登録、およびログイン用のマークアップ コードが含まれています
検証中。
views
フォルダーのルート ディレクトリの index.html
ファイルの隣に、次のファイルがあります。
404 エラーと 500 エラーのフラグが含まれます。
クライアント部分
クライアント部分のコードは、public
フォルダーにあります。このフォルダーには、
css
アプリケーション スタイルのサブフォルダーと畫(huà)像を含む img
フォルダー
アプリケーションで使用されます。
js
フォルダーには特別な注意を払う必要があります。
クライアント アプリケーションの Angular コード、初期化コードなどが含まれます。
ディレクティブとフィルター コード (現(xiàn)在は空のファイル) とコントローラーと
アプリケーションの記事セクションとタイトルセクションを提供します。 ビュー
フォルダーには、記事の作成、編集、表示、および
チェック。
最後に、lib
フォルダーには Angular ライブラリ コードが含まれています。
アプリケーションテスト
test
フォルダーには、アプリケーションをテストするためのファイルが含まれています。がある
Mocha を使用してサーバー部分をテストし、テストに使用されるファイルです。
Karma のクライアント側(cè)を使用します。
提供されるツール
MEAN スタックを使用する場(chǎng)合、開(kāi)発者は npm、bower、grunt にもアクセスできます。 インストールする必要があります。
JSHint が提供され、すべての JavaScript コードが提供されていることは言及する価値があります。 脫毛。さらに、Grunt を使用すると、プロジェクトの変更を監(jiān)視し、 自動(dòng)的に再構(gòu)築します。
###結(jié)論は###この記事は、2 番目のチュートリアルのフォローアップを目的としています。 アプリケーションは MEAN スタックの上に構(gòu)築され、MEAN がどのように機(jī)能するかを示します。 他の種類(lèi)のアプリケーションで使用できるように構(gòu)成および調(diào)整します。
###乞うご期待 第二部!以上がMEAN スタックを探索する: はじめにの詳細(xì)內(nèi)容です。詳細(xì)については、PHP 中國(guó)語(yǔ) Web サイトの他の関連記事を參照してください。

ホットAIツール

Undress AI Tool
脫衣畫(huà)像を無(wú)料で

Undresser.AI Undress
リアルなヌード寫(xiě)真を作成する AI 搭載アプリ

AI Clothes Remover
寫(xiě)真から衣服を削除するオンライン AI ツール。

Clothoff.io
AI衣類(lèi)リムーバー

Video Face Swap
完全無(wú)料の AI 顔交換ツールを使用して、あらゆるビデオの顔を簡(jiǎn)単に交換できます。

人気の記事

ホットツール

メモ帳++7.3.1
使いやすく無(wú)料のコードエディター

SublimeText3 中國(guó)語(yǔ)版
中國(guó)語(yǔ)版、とても使いやすい

ゼンドスタジオ 13.0.1
強(qiáng)力な PHP 統(tǒng)合開(kāi)発環(huán)境

ドリームウィーバー CS6
ビジュアル Web 開(kāi)発ツール

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

ホットトピック

WordPressバージョンをロールバックするには、プラグインを使用するか、コアファイルを手動(dòng)で交換して自動(dòng)更新を無(wú)効にすることができます。 1. WPDownGradeおよびその他のプラグインを使用して、ターゲットバージョン番號(hào)を入力して、自動(dòng)的にダウンロードして交換します。 2. WordPressの古いバージョンを手動(dòng)でダウンロードし、FTPを介してWP-Includes、WP-Admin、およびその他のファイルを置き換えますが、WP-Config.phpおよびWPコンテンツを保持します。 3. wp-config.phpにコードを追加するか、フィルターを使用してコア自動(dòng)更新を無(wú)効にして、さらなるアップグレードを防ぎます。操作前にウェブサイトとデータベースをバックアップして、安全性と信頼性を確保してください。長(zhǎng)期的にセキュリティと機(jī)能サポートのために最新バージョンを維持することをお?jiǎng)幛幛筏蓼埂?/p>

WordPressでカスタムショートコードを作成する手順は次のとおりです。1。functions.phpファイルまたはカスタムプラグインを介してPHP関數(shù)を書(shū)き込みます。 2。ADD_SHORTCODE()を使用して、関數(shù)をショートコードタグにバインドします。 3。関數(shù)のプロセスパラメーターと出力コンテンツを返します。たとえば、ボタンショートコードを作成する場(chǎng)合、柔軟な構(gòu)成の色パラメーターとリンクパラメーターを定義できます。使用する場(chǎng)合、[ButtonColor = "Red" url = "https://example.com"]などのタグを挿入できます。Do_ShortCode()を使用してモデル化できます。

WordPressがサーバーCPU使用の急増を引き起こす主な理由には、プラグインの問(wèn)題、非効率的なデータベースクエリ、テーマコードの品質(zhì)の低さ、またはトラフィックの急増が含まれます。 1.最初に、トップ、HTOP、またはコントロールパネルツールを介したWordPressによって引き起こされる高い負(fù)荷であるかどうかを確認(rèn)します。 2.トラブルシューティングモードを入力して、プラグインを徐々に有効にしてパフォーマンスのボトルネックをトラブルシューティングし、QueryMonitorを使用してプラグインの実行を分析し、非効率的なプラグインを削除または交換します。 3.キャッシュプラグインをインストールし、冗長(zhǎng)データをクリーンアップし、スロークエリログを分析してデータベースを最適化します。 4.トピックには、コンテンツの過(guò)負(fù)荷、複雑なクエリ、キャッシングメカニズムの欠如などの問(wèn)題があるかどうかを確認(rèn)します。標(biāo)準(zhǔn)のトピックテストを使用して、コードロジックを比較および最適化することをお?jiǎng)幛幛筏蓼?。上記の手順に従って、?chǎng)所を確認(rèn)して解決し、問(wèn)題を1つずつ解決します。

プラグインに依存しないWordPressサイトを最適化する方法は次のとおりです。1。積み重なったテーマを避けるために、AstraやGeneratePressなどの軽量テーマを使用します。 2. CSSおよびJSファイルを手動(dòng)で圧縮およびマージして、HTTP要求を削減します。 3.アップロードする前に畫(huà)像を最適化し、WebP形式を使用し、ファイルサイズを制御します。 4. configure.htaccessブラウザキャッシュを有効にし、CDNに接続して靜的リソースの負(fù)荷速度を向上させます。 5.記事の改訂を制限し、定期的にデータベース冗長(zhǎng)データをクリーンにします。

JavaScriptファイルをマイニングすると、ブランク、コメント、役に立たないコードを削除することにより、WordPress Webサイトの読み込み速度を向上させることができます。 1。W3TOTALCACHEなどの圧縮をサポートするキャッシュプラグインを使用し、「MINIFY」オプションで圧縮モードを有効にし、選択します。 2。FastVelocityMinifyなどの専用圧縮プラグインを使用して、より細(xì)かい制御を提供します。 3. JSファイルを手動(dòng)で圧縮し、FTPを介してアップロードします。これは、開(kāi)発ツールに精通しているユーザーに適しています。一部のテーマまたはプラグインスクリプトは圧縮関數(shù)と競(jìng)合する可能性があり、アクティベーション後にWebサイト機(jī)能を徹底的にテストする必要があることに注意してください。

Transientapiは、自動(dòng)有効期限データを一時(shí)的に保存するためのWordPressの組み込みツールです。そのコア関數(shù)は、set_transient、get_transient、delete_transientです。 OptionsAPIと比較して、Transimentsは、Cache API要求の結(jié)果や複雑なコンピューティングデータなどのシナリオに適した、生存時(shí)間(TTL)の設(shè)定をサポートしています。それを使用する場(chǎng)合、キーネーミングと名前空間の獨(dú)自性、キャッシュ「怠zyな削除」メカニズム、およびオブジェクトキャッシュ環(huán)境では続かない問(wèn)題に注意を払う必要があります。一般的なアプリケーションシナリオには、外部要求頻度の削減、コード実行リズムの制御、ページの読み込みパフォーマンスの改善が含まれます。

オブジェクトキャッシュは、高いアクセスと低更新に適した永続的なストレージを支援し、短期の失われたデータを許容します。 1.キャッシュの「永続性」に適したデータには、ユーザー構(gòu)成、一般的な製品情報(bào)などが含まれます。これらはデータベースから復(fù)元できますが、キャッシュを使用して加速できます。 2. Redis、RDBやAOFモードの有効化などの永続性をサポートするキャッシュバックエンドを選択し、合理的な有効期限ポリシーを構(gòu)成しますが、メインデータベースを置き換えることはできません。 3.長(zhǎng)いTTLを設(shè)定するか、キーの期限が切れないように、ユーザー:1001などの明確なキー名構(gòu)造を採(cǎi)用:データを変更するときにキャッシュを同期して更新します。 4.ローカルと分散したキャッシュを組み合わせて、小さなデータをローカルおよびビッグデータRedisを保存してビッグデータを保存し、一貫性とリソースの使用の問(wèn)題に注意を払いながら、再起動(dòng)後に回復(fù)に使用できます。

PluginCheckは、WordPressユーザーがプラグインの互換性とパフォーマンスをすばやくチェックするのに役立つツールです。主に、現(xiàn)在インストールされているプラ??グインに、WordPressの最新バージョン、セキュリティの脆弱性などと互換性がないなどの問(wèn)題があるかどうかを特定するために使用されます。インストールとアクティベーションの後、バックグラウンドの「runaScan」ボタンをクリックして、すべてのプラグインを自動(dòng)的にスキャンします。 2。レポートには、プラグイン名、検出タイプ、問(wèn)題の説明、およびソリューションの提案が含まれています。これにより、深刻な問(wèn)題の優(yōu)先処理が容易になります。 3. WordPressを更新する前に検査を?qū)g行することをお?jiǎng)幛幛筏蓼?。ウェブサイトの異常が異常である?chǎng)合、または定期的に実行されて隠された危険を事前に発見(jiàn)し、將來(lái)の大きな問(wèn)題を回避することをお?jiǎng)幛幛筏蓼埂?/p>
