Tudou.com フロントエンドの概要

Tudou.com フロントエンドの概要

1. 分業とプロセス<br />Tudou.comでは、プロジェクト開発が中核であり、誰でもプロジェクトをリードし、プロジェクトマネージャーとして機能することができます。
典型的な Tudou プロジェクトでは、正式な開発フェーズに入ると、通常、1 人のデザイナー、1 ~ 2 人のフロントエンド エンジニア、1 ~ 数人のバックエンド エンジニア、および 1 ~ 2 人のシステム運用および保守管理者が参加者になります。
このうち、最初の 3 つの作業は並行して実行でき、最終的な統合は通常、フロントエンド エンジニアによって行われます。複雑度の低いページ処理の場合は、一般的なエンジニアが直接参加することもできます。
デザイナー、フロントエンドエンジニア、バックエンドエンジニアのいずれであっても、分離について十分な理解を持つことは非常に重要であり、理解のレベルが異なる人々は協力において異なる協力効果をもたらします。
その中でも、デザイナーとフロントエンドエンジニアの連携は間違いなく最も重要です。デザイナーのスタイルは、フロントエンドページ構造の単純さや複雑さ、プログラムロジックの単純さや複雑さに直接つながります。
デザインが得意で、かつ W3C の Web 標準を理解しているデザイナーは稀で貴重です。
2. 基本アーキテクチャ
アーキテクチャの目標: スケーラビリティ、保守性、再利用性
1. 情報/コンテンツ
Tudou.com のコンテンツ構造は、モジュールの観点から見ると、中央のオレンジ色の円で示されるように、9 つの主要なブロックに分かれています。

機能的には、次の 3 つのレベルに分けられます。

これらの機能は、その後のすべてのフロントエンド アーキテクチャの基調を設定します。
前のページ1 2 3 4 5 次のページ 続きを読む

<<:  Docker ベースの ELK ログ システムを構築する方法

>>:  ソフトウェア 404 と 404 エラーとは何か、またそれらの違いは何ですか

推薦する

Nginx+SpringBoot による負荷分散の実装例

負荷分散の概要Nginx の負荷分散実装を紹介する前に、負荷分散の分類について簡単に説明します。負荷...

Alibaba Cloud MySQL スペースをクリーンアップする方法

今日、Alibaba Cloudからディスク警告通知を受け取りました。確認したところ、100Gのスペ...

Web デザイン ヘルプ: Web フォント サイズ データ リファレンス

<br />内容はインターネットから転載したものです。どこから見つけたのか忘れてしまいま...

インターネットウェブデザインにおけるバイオニックデザインの簡単な紹介

バイオニックデザインといえば、飛行機の発明、ドバイのブルジュ・アル・アラブ、平泳ぎなどを思い浮かべる...

Vue3の一般的なAPIの使用方法の紹介

目次ライフサイクルの変化反応的な参照vue2.x では ref を使用して要素タグを取得します。vu...

Vue echarts は棒グラフの動的な表示を実現します

この記事では、棒グラフの動的な表示を実現するためのvue echartsの具体的なコードを参考までに...

非常に詳細な MySQL8.0.22 のインストールと設定のチュートリアル

みなさんこんにちは。今日は、MySQL 8.0.22 のインストールと構成について学習します。注意深...

Linuxでmore、less、catコマンドを使用してファイルの内容を表示します

Linux では、cat、more、less の各コマンドを使用してファイルの内容を表示できます。c...

Node はあいまい検索用の検索ボックスを実装します

この記事の例では、検索ボックスでファジークエリを実装するためのNodeの具体的なコードを参考までに共...

WindowsでのNginxの起動や停止などの基本操作コマンドの詳しい説明

Windows で Nginx を使用するには、Nginx サービスの起動、停止、Nginx のリロ...

複数の Tomcat を展開して起動し、プロジェクトを移行する方法を 1 つの記事で学習します。

目次tomcatをデプロイする1.ダウンロードして解凍する2. 設定ファイルを変更する移植プロジェク...

WeChatミニプログラムはuni-appを通じて世界中に共有されます

実際の使用では、ミニプログラムを友人や友人サークルと共有する必要があることが多く、通常は一度に 1 ...

Dockerを使用してGitlabを素早くデプロイする方法

1. GitLabイメージをダウンロードする docker pull gitlab/gitlab-c...

Linux のインスタンスにパブリック IP アドレスを割り当てる方法

説明するこのインターフェースを呼び出すときは、次の点に注意する必要があります。パブリック IP アド...

カラーブロックレポート効果の動的な表示を実現する HTML (サンプルコード)

HTMLカラーブロックを使用してデータを動的に表示する <スタイル タイプ="te...