Xiaobaiが理解できるフロントエンドエンジニアリング
最近、フロントエンドエンジニアリングが多くの企業や企業で使用されており、非常に人気の高い用語になっているので、真ん中の原因と結果に興味があります。
01序文
近年フロントエンドエンジニアリングの内容も聞いたのですが、聞くととても背が高くなりましたが、フロントエンドがエンジニアリングレベルになったのはいつですか？しかし、現在はテクノロジーの更新に伴い、フロントエンドの開発を徐々に信じています。以前驚いたときも、フロントエンドが何をすべきかを考えて、写真を切り取り、テンプレートを設定しました。
この記事では、フロントエンドエンジニアリングの過去と現在についてお話ししますが、テクノロジーは含まれていません。誰もが好奇心を持って読むことができます。
02フロントエンド開発？写真を切り取りますか？
実際、フロントエンドの概念は基本的に以前はありませんでしたが、当時、多くのトリックがバックエンドの開発でしたので、Javaの開発は非常に人気があり、軽蔑の連鎖の頂点に立っていました。では、なぜバックエンドを学ばないのでしょうか？私の（後）フェーズ（終了）は、（あまりに）前（難しい）終了（オーバー）開発を信じているからです。
だから、方法はありません。芸術が良くないので、他に学ぶべきものを見つけて、フロントエンドを見つけます。すぐに効果があるものもあります。
フロントエンド履歴
フロントエンドが2回再生されたことを認めなければなりません。今日の急速な開発のみで、最初は静的なWebサイトから動的なWebサイトへ、2番目はNode.jsの導入です。これにより、スクリプト言語JavaScriptをサーバー側で実行できますが、これにより生産性が解放され、フロントエンドが作成されます。控えめな。
多くの人が、動的なWebサイトはまだ初期の段階では存在しないと考えていますか？結局のところ、私は同じように感じました。結局のところ、スクリプトを書くことでページを移動させることができますが、ここでの動的なことは、ユーザーと対話できることを意味しません。前にフロントエンドの履歴について考え、いくつかのページテンプレートをまとめ、jsといくつかのアニメーションを使用するだけで、あなたのWebサイトは素晴らしいと感じるでしょう。当時、ウェブサイトは基本的に非インタラクティブでした。つまり、他の人が見ることができるページだけでした。
デバッグに一生懸命取り組んだ完璧なページがクラスメートや友人に送信されると、ページが乱雑になる場合があります。そうです、それはすべてのフロントエンドを狂わせる非互換性の時代ですが、今は異なります。多くのフレームワークがそれを実現するのを助けており、互換性の問題はほとんどありません。
開発モデル
フロントエンドとバックエンドの混合開発モデルを経験したことがないので、フロントエンドを学び始めたとき、vueとelementuiはすでに出ていたので、数年後に幸せで生まれ、人々がグループとして助けてくれましたフロントロード。
フロントエンドのエンジニアリングをググると、以前のスタートモードはかなり混乱しており、強力なロジックはありませんでした。おおよその開発モードは、写真を切り取り、設計を行い、スクリプトを作成することです（誰もがWebデザインやフロントエンドコードの作成に使用できるソフトウェアdreamweaverを知っていると思います）。次に、ページテンプレートがバックエンドに渡され、フロントエンドとバックエンドが混合され、結合が非常に高くなります。これは実は全身が動いている状況です。有名なJSPは誰もが知っていると思いますが、大学時代にも学んだので、基本的には役に立たない（次回はコースをキャンセルする）。
その後、バックエンドはもう耐えられなくなりました。フロントエンドのものは非常に断片化され、非論理的です。
さて、フロントエンドは心を痛めるような考え方でこの骨を噛み、ページに関連するすべてのものをフロントエンドに与え、バックエンドは私にデータを送信する責任がありました。これは、Ajaxの誕生のおかげで、上記の動的なWebサイトの始まりです。それ以来、フロントエンドの作業で写真を切り取る必要がなくなり、作業はテンプレートの作成、ページのデザインおよび美化の方法になります。
03フロントエンドエンジニアリング
以前にページを開発した後、残りはバックエンドがデータを提供するのを待ちます。しかし、フロントエンドの開発は迅速ですが、バックエンドのインターフェースが追いついていないのですが、何ができますか？スマートフロントエンドは「偽のデータ」ということを思いつきました。つまり、私は最初に自分でデータをシミュレートし、バックエンドは私のフォーマット（バックエンドと通信するための適切なフォーマット）でデータを返さなければなりません。
いいえ、easymockなど、データシミュレーション用の多くのツールがあります。誰もがバックエンドの制御から離れて飛ぶことができます。このプロジェクトは同期的に開発できます。各プロセスは完全で成果物の状態です。バックエンドインターフェイスを待たずに、いつでもこのプロセスを顧客に示すことができます。一見すると、プロジェクトチームはフロントエンドで良い仕事をしました（昇進と給与の増加）。しかし、これはエンジニアリングの概念とはかけ離れており、プロジェクトは設計、開発、テスト、およびデプロイメントの4つの部分に分割できることがわかっています。
設計
ここでの設計は、主にプロダクトマネージャーとUI設計が一緒に設計して、製品のビジョンと実現する機能を設計するものであり、製品設計を通じてユーザーが必要とする機能を設計して開発に引き渡す方が簡単です。
フロントエンドは主に製品ページの評価に合格し、主に開発サイクルとプロジェクトの難易度を評価してから、技術スタックの選択を通過します。バックエンドは、システムインターフェース、権限制御、パフォーマンス、保守可能で再利用可能な設計を含むシステムアーキテクチャを設計します。基本的に、フロントエンドとバックエンドの設計は、すべてテクノロジータイプに関するものです。
開発中
その後、開発のニーズに応じて、開発の状況を実施します。この段階では、いくつかの小さな関数の開発と、それらがすべてのテストケースに合格できるかどうかに注意を払う必要があります。アジャイル開発のテクノロジーについて聞いたことがあるかどうかはわかりませんが、これは、機能のすべての部分を開発プロセスで使用できるようにするための効率的なモデルです。彼の当初の意図は、反復を効率的に開発し、ユーザーのニーズをすばやく変更できるようにすることでした。フロントエンドのコンポーネント化されたモジュール設計は、アジャイル開発を確実にするための前提です。
テスト中
テストの役割は、機能自体の小規模な検証を実行することです。一般的に、テストケースは多数存在します。すべてのテストケースに合格して初めて、次の操作に進むことができます。テストはユーザーに直接向けられています。現時点では、ユーザーの視点から製品を体験し、ユーザーの可能なすべての操作をテストして、サービスまたはデータが正常かどうかを確認します。主な担当者はフロントエンドエンジニアです。通常、製品のパフォーマンスをテストするために使用されるストレステストなども含まれます。今回はバックエンドの主な責任です。
配置する
展開プロセスは非常に重要な部分です。事前の作業が適切に行われていない場合、プロジェクトがオンラインになった後に多くの問題が発生し、問題を特定してプロジェクトを維持することが困難になる可能性があります。フロントエンドとバックエンドが別々の開発モデルは、障害の発生を効果的に削減し、問題をすばやく特定して解決できます。実際、ユニットテストとプロジェクトエンジニアリングの分割のプロセスからも恩恵を受けます。
ここでの展開では、一部の静的ファイルを静的サーバーまたはCDNに展開し、データ相互作用をWebサーバーに配置して、パフォーマンスを最大化できる同様の「読み取りと書き込みの分離」機能を実現できます。
開発の過程では、フロントエンドとバックエンドが別々の開発モデルを使用できます。これは技術に依存しないモデルであり、エンジニアリングの考え方を考慮しています。多くのインタビューでは、フロントエンドエンジニアリングの理解について話をするように求められますが、実際には、フロントエンドエンジニアリングが存在する理由、その方法、および利点は何にすぎません。基本的に、これは一種のエンジニアリングの考え方であり、テクノロジーとはほとんど関係ありません。一般に、次の3つの利点があります。
- 並行開発、開発サイクルの短縮
- 問題をすばやく見つけて問題をすばやく解決する
- 展開を動的および静的に分離できるため、プロセスが簡素化され、プログラムの堅牢性が向上します
04まとめ
実際、パッケージングツールやフロントエンドの継続的な統合など、フロントエンドエンジニアリングの概念について深く語っている本をいくつか見つけました。もちろん、これはフロントエンドエンジニアリングの一部でもあります。つまり、そのコアは「デカップリング」であり、以前の絡み合った静脈を保守可能で再利用可能な状態に再配置できます。
要約すると、フロントエンドエンジニアリングとは、互いに影響を与えずにプロジェクト全体を簡単にマージできるようにすることなく、開発プロセスを簡略化して並行して開発することです。中心的な目標は、開発環境を確立し、全体的な開発効率を向上させることです。
