プログラマーにとって、フロントエンド、バックエンド、フルスタックとは何を意味しますか?

フロントエンド プログラマー、バックエンド プログラマー、フルスタック プログラマーとは何ですか?仕事を探すとき、フロントエンドとバックエンドどちらを選ぶべきですか?米国にはなぜこれほど多くのフルサイト プログラマーがいるのですか?この記事では、これらの質問に 1 つずつ答えて、これらの概念を明確に理解できるようにします。

元のアドレス: https://www.bilibili.com/video/BV1DV411B7v5/

まず、フロントエンド開発とは何ですか?

簡単に言えば、フロントエンド開発とは、Web ページ上の「コンテンツ表示」とユーザーとの対話を開発することです。

ここでの「コンテンツ表示」とは、Web ページ上に表示されるものを指します。写真、テキスト、ビデオ、数字、その他の情報。

つまり、ユーザーとの対話とは、ユーザーがボタンをクリックしたり、ページ上でテキストやその他のアクションを入力したりして、Web サイトにデータ入力を提供し、フロントエンドがユーザーの入力に応答することを指します。

たとえば、ページ上のコンテンツを更新する。より具体的な例を挙げると、私の記事の下にコメントすると、ページはバックグラウンド データベース内のコンテンツを更新します。コメントの数。

そして、以下に示すように、ページ上の記事に対するコメントの数を表示します。

フロントエンド開発で使用される基本テクノロジーは、html、css 、および javascript であり、コンテンツの制御に使用されます html、css 和 javascript，分别用来控制网页里面的内容、视觉效果和用户交互。

下面分别简单介绍一下。

html 并不是一门编程语言，他是一种用来定义结构化数据的标记语言，你在浏览器上看到的网页，其实就对应一个 html 文件，这个文件里装的就是 html 代码，而浏览器的职责之一，就是通过你输入的网址，从网站上下载对应的 html 代码，并且把代码渲染成你肉眼看到的样子。

那么，前端工程师的工作内容之一，就是编写 html代码，或者使用一些技术来为页面动态的生成 html 代码，任何一个网页，你都可以通过浏览器的开发者工具，看到他对应的 html 代码。

如果你仔细查看一段 html 代码，你会发现他其实就是由一堆各种类型的尖括号标签组合嵌套而成的，比如某视频在 youtube 页面上，视频的标题，对应于代码里面一个title类型的标签，那视频的播放器就对应于一个video类型的标签；其头像图片，对应于一个嵌套在超链接标签里的 image 标签；而评论里的文字又对应于一个 yt formatted-string 类型的标签，这里的 yt 应该只带的是youtube，那么这个标签，应该就是 youtube 自定义的标签，然后 css 的代码，则是用来指定每个 html 的标签，以什么样的外观和风格来展示，比如长宽、位置、颜色居中还是分散字体显示属性等等。

css的代码也是被浏览器读入，并且渲染成你肉眼所看到的效果，有时候pm会想把页面里面一个按钮的大小和颜色进行微调，而这个微调就是由前端工程师去改动；这个按钮对应的 css代码来实现的，前端开发中真正编程的部分是javascript，网页如何与用户交互，如何与后端交互，都是通过 javascript 的代码实现的，就像html代码和 css代码是被浏览器执行一样，页面里面的 javascript 代码也是交给浏览器来执行。

这里插一句，javascrip与java并没有什么关系，两者之间的特性差的很远，这就好比是印度跟印度尼西亚差的很远，熊猫跟小熊猫差的很远，雷峰和雷峰塔差的很远。

说回正题，大家在写程序的时候，不管用什么语言，通常都不会重复的造轮子，而是会调用该语言现成的 library来实现一些常见的功能，让开发过程更加高效。

对于前端javascript的开发，react是目前比较流行的library，也是我在工作中，做前端的时候会用到的。react这个library，不仅可以用来实现与用户的交互逻辑和事件响应，事实上页面上几乎全部的 html 代码，都可以通过 react来生成，这种在浏览器端生成 html代码进行渲染的方式，叫做 client-side rendering，与之相反的就是 service-side renderingそれぞれ Web ページの

、🎜視覚効果🎜、🎜ユーザーインタラクション🎜。 🎜🎜以下はそれぞれについて簡単に紹介します。 🎜🎜html はプログラミング言語ではなく、構造化データを定義するために使用されるマークアップ言語です。ブラウザーで表示される Web ページは実際には HTML ファイルに対応しており、このファイルにはブラウザーの役割の 1 つが含まれています。入力した URL を通じて Web サイトから対応する HTML コードをダウンロードし、そのコードを肉眼で見えるものにレンダリングします。 🎜🎜つまり、フロントエンド エンジニアの仕事の 1 つは、HTML コードを記述すること、または何らかのテクノロジーを使用してページの HTML コードを動的に生成することです。どの Web ページでも、ブラウザの開発者ツールを通じて対応するコードを確認できます。 htmlコード。 🎜🎜 HTML コードを注意深く見てみると、実際にはさまざまな種類の山かっこタグがネストされて構成されていることがわかります。たとえば、YouTube ページでは、ビデオのタイトルが に対応します。 title タイプのタグ、ビデオプレーヤーは video タイプのタグに対応し、そのアバター画像は image タグに対応します。コメント内のテキストは yt formatted-string タイプのタグに対応します。ここでの yt は youtube のみを含む必要があるため、このタグは youtube 自体である必要があります。定義されたタグと CSS コードを使用して指定します。表示される各 HTML タグの外観とスタイル (長さと幅、位置、色の中央揃えまたは分散フォント表示属性など)。 🎜🎜 CSS コードもブラウザーによって読み取られ、肉眼で見える効果にレンダリングされます。PM はページ上のボタンのサイズと色を微調整したい場合があります。この微調整は、によって変更されます。フロントエンド エンジニア; このボタンは、それに対応する CSS コードによって実装されます。フロントエンド開発における実際のプログラミング部分は、Web ページがどのようにユーザーと対話するか、またどのようにバックエンドと対話するかはすべて JavaScript によって実装されます。 HTML コードや CSS コードと同様に、ブラウザも同じコードを実行し、ページ内の JavaScript コードもブラウザによって実行されます。 🎜🎜ここに文を挿入してください。JavaScript は Java とは何の関係もありません。この 2 つの特徴は大きく異なり、インドに似ています。インドネシアとは大きく異なり、パンダはレッサーパンダからも遠く、雷峰は雷峰塔からも遠く離れています。 🎜🎜本題に戻りますが、人がプログラムを書くときは、使用する言語に関係なく、通常は車輪を再発明することはなく、その言語の既製のライブラリを呼び出していくつかの共通関数を実装します。開発プロセスがより効率的になります。 🎜🎜 フロントエンド JavaScript 開発では、react が現在人気のライブラリであり、私がフロントエンド作業を行うときに使用するライブラリでもあります。 React ライブラリは、ユーザーとの対話ロジックやイベント応答の実装に使用できるだけでなく、実際、ページ上のほとんどすべての HTML コードを React によって生成でき、ブラウザ側でレンダリングするための HTML コードを生成します。この方法は クライアント側レンダリング、その反対はサービス側レンダリングで、ページの完全なHTMLコードはすべてWebサイトのフロントエンドサーバーによって生成されます。その後ブラウザに送信されます。 🎜

ここではフロントエンド サーバーについて説明します。ちなみに、フロントエンド サーバーのロジックは、サーバーの動作が準拠している限り、Java、JavaScript、php、さらには Scheme などの任意のプログラミング言語を通じて実装できます。 http プロトコルでは、 クライアント側レンダリング と シルバー側レンダリング の両方に独自の長所と短所があるため、Web ページを開発するときは、最も適切な方を選択する必要があります。 ;client-side rendering和 silver-side rendering两种方式各有优缺点，因此前段工程是在开发网页的时候，需要结合实际情况，选择最合适的页面渲染方式；

除了 react，另外一种比较流行的 javascript library就是vue，在国内用的比较多，如果你去查看 b 站的html代码，你会发现 b 站的前端也用到了vue。

以上介绍的这些，就是前端开发的一些常规技术，html、浏览器和前端服务器的工作原理，一般会在学校里面的《计算机网络》课里面介绍，css、javascript、react就主要靠自学了。

 javascript和react学习课程感兴趣的可以去看《javascript高级教程》哦！

讲完了前端,现在来讲讲后端。

什么是后端开发呢？

相当一部分的后端开发工作，就是开发数据访问服务，使得前端可以通过调用后端的服务，来对数据进行增删查改，也就是大家经常听到的 curd，从而实现前端对用户的请求响应。

比如你在一个大型网站注册的时候，这个网站的前端就会调用他的后端，把你的用户信息写入数据库。一个后端服务其实不局限于只被前端调用，他还可以被 mobile app 调用，还可以被其他的后端服务调用。

类比一下，前端往往需要通过调用后端服务，来完成对用户的请求响应，而后端服务往往需要通过查询数据库。

来完成对前端请求的响应，从这个类比你可以看出，前端和后端的共性，都是通过调用一个比自己靠后的服务，来对前方客户的请求进行响应，后端工程师的工作范畴很广，几个比较常见的就是，设计后端服务的api，设计后端服务的架构图，设计后端服务的数据库且代码实现后端服务的业务逻辑，同时你还需要保证你设计的后端服务，highly available，也就是访问量很大的时候仍然不宕机，并且对客户请求的响应时间很短，或者说吞吐量高，单位时间内能处理的请求数量多。

如果要从头搭建一个新的后端服务，那么整个过程需要进行大量的系统设计，也就是后端工程师面试的时候，会考到了System Design,做System Design非常考察平时知识的积累。

那么后端工程师平时一般需要与哪些技术和工具打交道呢？

首先就是后端服务器了,和前端服务器一样,后端服务器也可以由几乎任何一种编程语言实现,只要能把正确的数据,返回给调用者就可以了。

主流的编程语言,也有各自流行的 Web Framework,也就是现成的轮子,来帮助大家站在框架的肩膀上,快速的实现一个后端服务,比如基于 PHP的 Web Framework有thinkphp和laravel（插一句“PHP是世界上最好的语言”），基于 javascript 有 express，基于 java 的 Web Framework有Spring Boot 和 Drop wizard，以及基于python有flask这几个Web Framework，每一个都有大厂在使用，不同的公司具体选择哪种框架，一定程度上，是看创始的程序员们最喜欢哪种语言，哪种框架用的最6，还有一些后端服务的框架，可以支持你用多种编程语言来开发，而不是绑在一门特定的语言上。

说了这么多的语言和框架,如果你想去某个公司做后端开发,一定需要对他们使用的语言和框架很熟练吗？

一般来讲不会,我找工作的时候看到岗位描述,里面有我不会的语言和框架,也无所谓,照样投，对公司来说你会其中一部分就够了，很多东西都是在工作里面学的，而且事实上，两周内上手一门新的编程语言，是一名职业程序员的基本素养，除了开发和维护后端服务器，后端工程师还会花大量的时间，在数据库上，不管是为你的后端服务创建数据库，还是为数据库的性能调优或者是分析里面的数据。

目前最常用到的数据库是关系型数据库，比如在工业界被广泛使用的MySQL和PostgreSQL

React に加えて、もう 1 つの人気のある JavaScript ライブラリは、中国でより一般的に使用されている、ステーション b の HTML コードを確認すると、次のようになります。ステーション b のフロントエンドもそれを使用していることがわかります。 vue に到着しました。 🎜🎜上記は、フロントエンド開発のための一般的なテクノロジーの一部です。HTML、ブラウザー、フロントエンドサーバーの動作原理は、通常、学校の「コンピューターネットワーク」の授業で紹介されます。 。 🎜🎜 JavaScript と React の学習コースに興味がある場合は、「JavaScript 上級チュートリアル」にアクセスしてください。 「ああ！ 🎜🎜フロントエンドについて話した後、バックエンドについて話しましょう。 🎜🎜バックエンド開発とは何ですか? 🎜🎜 バックエンド開発作業のかなりの部分は、データ アクセス サービスの開発です。これにより、フロントエンドは、カードであるバックエンド サービスを呼び出してデータを追加、削除、確認、変更できるようになります。フロントエンドユーザーのリクエストレスポンスを実現するために、誰もがよく耳にする「リクエスト」。 🎜🎜たとえば、大規模な Web サイトに登録すると、Web サイトのフロントエンドがバックエンドを呼び出して、ユーザー情報をデータベースに書き込みます。バックエンド サービスは、フロントエンドからのみ呼び出すことができるわけではなく、モバイル アプリや他のバックエンド サービスからも呼び出すことができます。 🎜🎜同様に、フロントエンドはユーザーのリクエストへの応答を完了するためにバックエンド サービスを呼び出す必要があり、バックエンド サービスはデータベースにクエリを実行する必要があることがよくあります。 🎜🎜フロントエンドのリクエストへの応答を完了するには、フロントエンドとバックエンドの共通点は、背後にあるサービスを呼び出すことでフロントエンドの顧客のリクエストに応答することであることがわかります。バックエンド エンジニアの仕事の範囲は非常に広く、バックエンド サービスの API の設計、バックエンド サービスのアーキテクチャ図の設計、データベースの設計などがあります。バックエンド サービスとバックエンド サービスのビジネス ロジックを実装するコードを同時に作成する必要があります。同時に、バックエンド サービスが 高可用性 にならないように設計する必要もあります。トラフィックが非常に多く、顧客のリクエストに対する応答時間が非常に短い場合でも、スループットが高く、単位時間あたりのリクエストを大量に処理できます。 🎜🎜新しいバックエンドサービスをゼロから構築したい場合、プロセス全体で多くのシステム設計が必要になります。つまり、バックエンドエンジニアの面接では、システム設計テストを受けることになります。日々の知識の蓄積を試すことが重要です。 🎜🎜では、バックエンドエンジニアは通常どのようなテクノロジーやツールを扱う必要があるのでしょうか? 🎜🎜 1 つ目はバックエンド サーバーです。フロントエンド サーバーと同様に、バックエンド サーバーも、呼び出し元に正しいデータを返すことができる限り、ほぼすべてのプログラミング言語で実装できます。 🎜🎜 主流のプログラミング言語には、独自の人気のある Web フレームワークもあります。これは、誰もがフレームワークの肩に立ってバックエンド サービスを迅速に実装できるようにするための既製の車輪です。たとえば、PHP ベースの Web フレームワークには、 thinkphp と laravel (「PHP は世界で最も人気のある Good 言語")、JavaScript に基づいて express があり、Java に基づいて Web フレームワークに Spring Boot と が含まれています。 Drop ウィザード と Java ベースの Python には、flask などのいくつかの Web フレームワークがあり、それぞれが大手メーカーによって使用されており、さまざまな企業がどのフレームワークを選択するかは、ある程度依存します。創業プログラマーが最も好む言語、最も使用されているフレームワークはどれですか? 特定の言語に縛られるのではなく、複数のプログラミング言語での開発をサポートできるバックエンド サービス フレームワークもいくつかあります。 🎜🎜 言語やフレームワークについてはたくさん話しましたが、特定の会社でバックエンド開発を行うために働きたい場合、その会社で使用されている言語やフレームワークに習熟する必要がありますか? 🎜🎜 一般的に言えば、そうではありません。仕事を探していたときに、その求人内容に私の知らない言語やフレームワークが含まれていました。それは問題ではありませんでした。とにかくその会社に応募しました。多くのことが同じであることを知っていれば十分です。実際、開発と保守に加えて、新しいプログラミング言語を 2 週間以内に使い始めることが重要です。バックエンド サーバー、バックエンド エンジニアも、バックエンド サービス用のデータベースの作成、データベースのパフォーマンスの調整、データベース内のデータの分析など、データベースに多くの時間を費やします。 🎜🎜現在最も一般的に使用されているデータベースは、業界で広く使用されている MySQL や PostgreSQL などのリレーショナル データベースです。 🎜

リレーショナル データベースを設計する方法、SQL クエリを使用してデータにアクセスする方法、インデックスに依存してデータ クエリを高速化する方法など、これらの知識ポイントは学校のデータベース コースでも紹介されますが、学校のデータベース コースでは紹介されることはほとんどありません。しかし、近年では、非リレーショナル データベースが使用されることが増えています。これは、誰もがよく No-SQL データベースと呼ぶものです。

たとえば、JSON ドキュメントに基づく MongoDB、LSM ツリー に基づく LevelDB など、これらのデータベースはリレーショナル データベースよりも優れている可能性があります。 MongoDB，比如基于LSM tree 的LevelDB,这些数据库在某些特定的情况下,可能会比关系型数据库更适合你的业务需求,

大家一般也是在工作中去学习他的原理和特性,数据库往往是一个后端系统里面的性能瓶颈,也就是最慢的一环,因此后端工程师在进行系统设计的时候,会用很多办法来使得后端的性能,比如响应的时间,尽量的少被数据库拖后腿,比如使用MemCached这种缓存系统,来加速读取数据的速度,比如用Kafaka把数据写入异步化，提升后端写数据的性能，后端开发就大致介绍到这里。

后端开发里的其他重要环节，比如性能监视，比如 DevOps

通常、データベースは最も遅いリンクであるバックエンド システムのパフォーマンスのボトルネックになることが多いため、バックエンド エンジニアはシステムを設計するときに多くの方法を使用します。たとえば、Kafaka を使用してデータを保存するなど、MemCached などのキャッシュ システムを使用してデータの読み取りを高速化し、応答時間などのバックエンドのパフォーマンスを向上させるために使用されます。 . バックエンド データ書き込みのパフォーマンスを向上させるための非同期書き込み これは、バックエンド開発の大まかな概要です。

DevOps などのパフォーマンス監視など、バックエンド開発におけるその他の重要な側面はここでは省略します。 フル スタックについて話しましょう、

フル スタックとは、完全に動作する Web アプリを自分で構築してデプロイでき、フロントエンドとバックエンドを個別に作成できる必要があります。終了コードはサーバーを構成し、データベースを設計できます。

働き始めてから、フロントエンドとバックエンドの両方を行ってきましたが、時間の約80％はバックエンドに費やされています プログラマーとしての仕事を探している人たちへ、多くの友人が尋ねました。フロントエンドとバックエンドではどちらの専攻が発展しやすいのでしょうか？それともどちらの専攻が女の子に適していますか？ここで皆さんにこの記事「プログラミングをゼロから学ぶにはどこから始めるべきですか？」を読むことをお勧めします。 2021年の学習に適したおすすめプログラミング言語

》

フロントエンドとバックエンドの選択の違いは、使用するテクノロジーと考慮される側面のみです。フロントエンドは主にユーザーエクスペリエンスを考慮し、バックエンドは主に考慮されます。最後に主に考慮するのは、基礎となるビジネス ロジック、プラットフォームの安定性、パフォーマンスです。最も重要なことは、ユーザーが目に見える部分を実行したいか、それともユーザーが認識できない部分を考慮するかによって異なります。見てください

多くの人は、女の子のほうが美的センスがあり、フロントエンドの仕事に適していると考えていますが、社内ではインターフェイスの仕様が統一されており、ボタンのフォントや枠線などはすべて直接呼び出されます。コンテンツの並べ替えは私ではなく、PM デザイナーと UI デザイナーが決定します。私の美学はデザイナーほどプロフェッショナルではありません。

最後に、特定の方向を選択したとしても、実際に他の人が仕事で何をしているのか、自分の好きなこと、やりたいことを学ぶことができます。フロントエンドまたはバックエンドに転職したい場合は、その企業を検討してください。グループ内で機会があれば、自分で勉強したり、他の機会を探したりすることもできます。これまでの職歴は無駄にはなりません。会社は常に、よりスキルのある従業員を好みます。

フルスタック プログラマーの求人が多いのは、スキルが比較的包括的であるためと考えられます。求職者にとって、数年の実務経験を持つフルスタック プログラマーは 1 つの給与に相当します。採用される可能性が高いため、基本的には全員が個人的な興味や専門分野に基づいてフルスタックのプログラマーを目指し、徐々にメインのフロントエンド、メインのバックエンドのフルサイト、または管理職に成長します。 。 🎜

以上がプログラマーにとって、フロントエンド、バックエンド、フルスタックとは何を意味しますか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。