ホームページ  >  記事  >  ウェブフロントエンド  >  フロントエンドとは何ですか

フロントエンドとは何ですか

php中世界最好的语言
php中世界最好的语言オリジナル
2018-02-26 09:58:452492ブラウズ


今回はフロントエンドとは何か、フロントエンドの概念について詳しく説明していきます。

私は旧正月中にいとことおしゃべりしていました。彼は以前に html、js、css を使って Web ページを書いたことがあると言いました。私がフロントエンドを導入した当時と何が違うのですか?その時彼に終わりを告げる。

しかし、当時の私はフロントエンドについて完全に理解していなかったので、明確な自己紹介ができたとは感じていませんでした。

私自身の学習が深まるにつれ、フロントエンドと Web ページのライティングの違いについてブログ記事にまとめる必要があると感じています。同時に、自分の現在の意見や理解を記録しておきたいと思います。しばらくしてそれらを振り返ったときに、自分自身の改善に向けて多くの洞察が得られるはずです。

私の知識レベルが限られているため、間違いがある場合は、コメント欄でご指摘ください。ありがとうございます。

Web開発時代

当時、人々はHTMLでWebページを書き、jsやcssでスタイルを調整していました。

さまざまな古典的な書籍「Head First HTML and CSS」、「Mastering CSS: Advanced Web Standard Solutions」、および「JavaScriptAdvanced Programming」から学んだことは、基本的にこの分野のことです。 MOOC 上のビデオのほとんどはこの点に限定されています。

Web ページ テンプレートの時代

Web ページの複雑さが増すにつれて、プログラマーは開発の便宜のためにさまざまな Web ページ テンプレート言語を開発しています。

たとえば、less 言語は css の記述を簡素化し、coffeejs は js の記述を簡略化し、html と js を組み合わせたさまざまなテンプレートが多数あります。

ajax 時代

js の発展により、XHR の発明により、プログラマはフロントエンドでデータを処理し、一部のバックエンド作業を共有できるようになりました。

良い例はフォーム検証ですああ、画像などの読み込みを開始する前にブラウザのスライダーが下にスライドします。

SPA時代

SPA=シングルページアプリケーション。

ajaxの開発により、ブラウザ側でデータ処理ができるようになり、フロントエンドでアプリケーション全体、つまりSPAを書くことができるようになりました。

SPA 時代では、プログラマはフロントエンド部分全体を js を使用して処理します。ユーザーは Web サイトを開くときにすべての js をダウンロードし、ページを開くなどの後続の操作では、js を使用してブラウザー側で直接処理する必要はありません。 http リクエストをサーバーに送信します。

現時点で非常に重要な概念は ルーティング です。ページを開くときに http リクエストが送信されないため、ブラウザは URL をどうすればよいのかわかりません。このとき、ブラウザがどの URL のどのコンテンツを開くかを誘導する仕組みが必要です。

MVC 時代

SPA 時代の発展に伴い、開発の便宜のためにプロジェクトをさまざまなモジュールに分割することがよくあります。最も典型的なのは MVC (モデル、ビュー、コントロール) です。

この時代にはバックボーンフレームワークなど、様々なフレームワークが登場しています。

MVVM時代

MVCの制御モジュールは通常サーバーで処理されるため、フロントエンドコンテンツではありません。この問題を解決するために、コントロールの代わりにビュー モデルを使用するという解決策が提案されました。これが MVVM フレームワークの起源です。実装されたテクノロジーは双方向バインディングと呼ばれます。

この時代には、reactjs、angularjs などの最新のフロントエンド フレームワークが登場しました。現時点では、フロントエンド エンジニアは、ブラウザ上で動作するソフトウェアや、モバイル ブラウザ上で動作するアプリケーション ソフトウェアを含むアプリケーション ソフトウェアをすでに開発できます。

これらの事例を読んだ後は、その方法を習得したと思います。さらに興味深い情報については、php 中国語 Web サイトの他の関連記事に注目してください。

関連書籍:

ウォーターフォール フロー レイアウトを実装する 2 つの方法

ブラウザのレンダリング プロセスの詳細な説明

オーバーフロー スクロールの重要性とは何ですか

モバイル向けのレイアウト ソリューションとはHTML のターミナル

以上がフロントエンドとは何ですかの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。