web-dev-qa-db-ja.com

「フロントエンド」という用語は「クライアント側」と同義語ですか?もしそうなら、これは常にそうですか?

比較的新しい(独学)Web開発者として、front-endclient-sideback-endという用語を聞いたことがある、そしてserver-sideが頻繁にあります。私にとって、フロントエンドとバックエンドは常にクライアント側とサーバー側の同義語でした。

ただし、CodeIgniterのようなMVCフレームワークの使用を開始したため、バックエンドが何かを参照している間に、基本的にエンドユーザーが見るすべてのもの(サーバー側コードを含む)を参照しているフロントエンドのいくつかのインスタンスに遭遇しましたエンドユーザーには表示されません(CMSを含む)。私にとって、クライアント側とサーバー側は、その意味がはるかに具体的です。それらを区別する非常に明確な線があります。一方、フロントエンドとバックエンドにはありません。

他のWeb開発者との会話で、彼は(全体として)CodeIgniterをフロントエンドと呼んでいたため、ループが発生しました。私は彼を修正して、CodeIgniterが私のバックエンドであると言うべきかどうか、または2つの用語の私の定義が完全に間違っているかどうかわかりませんでした。

フロントエンドとバックエンドの定義を検索すると、いくつかの点で少し混乱しましたが、いくつかは明確になりました。これら4つの用語の間に線が引かれている場所と、それらがWeb開発のコンテキスト(特にLAMPスタック)でどのようにつながっているのかを知りたいのです。

20
HellaMad

これらの用語に正式な定義があるとは思いません。あなたが指摘したように、場合によっては重複があります。

front-endclient-sideが重複しています。
server-sideback-endも重複しています。

髪を分割する場合は、次のような大まかな境界を提供します。

  • client-sideは、ユーザーのコンピューターで実行されるアプリケーションです。スタンドアロンのアプリケーション(多くの場合)またはWebブラウザーベースのインターフェイス(ほとんどありません)を指す場合があります。
  • front-endもエンドユーザーに対応しており、通常はWebブラウザーベースのインターフェイスで実行されます。シッククライアントがfront-endと呼ばれるのを聞いたことがありません。
  • back-endは、別のサーバー上またはユーザーのコンピューターのバックグラウンドで実行されているプロセスとサービスを指します。多くの場合、エンドユーザーのコンピューター上でnotであるプロセスを指します。しかし、重要なのは、あなたが述べたように、エンドユーザーが実行中のプロセスを必ずしも認識しているわけではないということです。
  • server-sideback-endの拡張ですが、プロセスがエンドユーザーのコンピューターではなく他の場所で実行されているという事実を明示的に補強します。

例として、用語間の混乱を強調するために、例としてMinecraftを使用します。

Minecraftには

  • client-sideアプリケーションを自分のJVMでローカルにjarファイルを実行する場合。
  • front-end Webブラウザーでクライアントアプリケーションを実行する場合
  • back-endスタンドアロンモードの場合、マシンでローカルに実行できるプロセス
  • server-side Minecraftサーバーアプリケーションをホストしているサーバーにログインすることを選択した場合。

Minecraftの統計のいくつかを掘り下げると、それらが単にclientおよびserverコンポーネントをゲームに指定していることがわかります。それらは必ずしもそれらのコンポーネントがどこで実行されるかを気にしません。


「フロントエンド」という用語は「クライアント側」と同義語ですか?

ちょっとですが、実際にはそうではありません。あなたがウェブベースの世界の外で物事を議論しているならば、用語間にニュアンスがあります。あなたが厳密にウェブベースの世界にいるなら、そうです、それらは機能的に同義です。

もしそうなら、これは常にそうですか?

ウェブの世界では、そうだと思います。他の領域では、私が提供した大まかな定義で説明されているように、私はノーと言うでしょう。

18
user53019

サーバー側はサーバー上で実行されます。クライアント側はクライアントで実行されます。バックエンドはデータの処理です。フロントエンドがそれを表示しています。

このウェブページを見てください。データベースからすべてのコメントを取得することは、サーバー側のバックエンド作業です。テンプレートにデータを配置することは、フロントエンドのサーバー側の作業です。 AJAX投票ウィジェットと派手なテキスト入力ボックスは、クライアント側のフロントエンドです。

20

私は一般的に、開発/開発者を説明するためにクライアント側とサーバー側を使用することはそれほど曖昧ではないと感じています。データをジャグリング/フォーマットするクライアント側の部分は、バックエンドコンポーネントと見なすことができます。裏側では、「フロントエンドの」ためにバックエンドで発生する傾向のあるすべてのテンプレートがあり、人々はフロントエンドJavaまたはC#の開発としてそれらについて話します。それはまれですが、私はそれを仕事の説明で見ました。

しかし、はい、一般的に言えば、フロントエンドは相互作用が発生する部分です。バックエンドは、そのすべての相互作用が有用なものに変わる部分です。

1
Erik Reppen

この質問は少し古いですが、私の2cを追加しましょう:

私自身のWeb開発では、「フロントエンド」という用語を使用しました。これは、ブラウザでしばらく処理されるコードまたはその他のリソースを意味します。現在、私は「クライアント」という用語を使用しています。これは、espを混乱させる可能性があるためです。 Webアプリケーションを実行するとき。 (単一ページアプリ)

単にバックエンド側にalso "フロントエンド"があるためです。これは、一般に(ブラウザへの)出力を担当するアプリケーションの部分を意味します。したがって、「フロントエンド」は実際には2つの異なることを意味します。ただし、「クライアント」という用語は、実際のクライアント(この場合はブラウザ)に関連するものをより明確に表現しています。

PS:まあ、多分私は今でもニックネームを "client_dev"に変更する必要があります;)

0
frontend_dev

Webアプリケーションのクライアント側はユーザー/顧客の管理下にあり、サーバー側は開発者の管理下にあります。これが、サーバーでデータ検証を行う必要がある理由の1つです。

フロントエンドおよびバックエンドという用語は、クライアント側の同義語としてよく使用されますおよびserver sideそして多くの場合それは大丈夫です。ただし、重要な反例もあります。 meにとって、フロントエンドはユーザーに何かを示すものです。

次の画像では、一般的なテクノロジー/コンセプトと、それらが(フロントエンド、バックエンド)/(クライアントサイド、サーバーサイド)の象限にどのように適合するかを示しています。

enter image description here

フロントエンドおよびバックエンド開発者

フロントエンドとバックエンドの開発者は、2つの非常に一般的な役割です。 Reactこれはサーバー側でレンダリングでき、Flaskこれは jinjaテンプレートを含む)のような場合、ラインは少しぼやけますエンジン

また、Web SQLデータベースや Indexed Database API などのテクノロジーを「クライアント側のバックエンド」象限に配置しますが、これについて通常知っている役割はフロントエンド開発者の役割です。

  • フロントエンド開発者は、HTML、CSS、DOM、および一般的なブラウザ機能( caniuse など)について知っている必要があります。通常、彼らはいくつかのjQueryまたはReactを知っています。私の定義によるとバックエンドですが、フロントエンドの開発者が クライアント側のストレージについて知っていることを期待します
  • バックエンド開発者は、nginx、gunicorn、Apache、またはnode.jsなどのWebサーバーについて知っておく必要があります。少なくとも1つのSQLデータベース(Postgres、MariaDB/MySQLなど)、キー値ストア(Redis)、API開発(RESTおよびGraphQL)を知っている必要があります。 [〜#〜] lamp [〜#〜] は、しばらく前の典型的なスタックでした。バックエンド開発者がブラウザについて何かを知っているとは思いません!

UIデザイナーvsフロントエンド開発者

他の2つの役割は、UIデザイナーとフロントエンド開発者です。したがって、1つの違いは、1つはデザイナーで1つは開発者であるということです。

目的:

  • UIデザイナーがユーザーエクスペリエンスを作成する
  • フロントエンド開発者は、それが期待どおりに見えることを確認します(ドラフトから本物を構築します)

ツール:

  • UIデザイナーは主にAdobe Photoshop/Illustrator/Sketch/Balsamiq/Invisionを使用しています。
  • フロントエンド開発者は、React、Vue、Angularを使用します

API:RESTおよびGraphQL

APIはバックエンドチームによって提供され、フロントエンドがアプリにデータを入力するために使用されます。バックエンドはデバイス間の永続的なストレージであり、フロントエンドはプレゼンテーション層です。 APIは両方の通信チャネルです。

0
Martin Thoma