2020 年 (およびその先) のフロントエンド開発者であることの意味

フロントエンド開発者のフロントエンド部分の本当の意味について考えたことはありますか? 私はかつて、Eric Meyer (Web サイトが存在するのとほぼ同じくらい長い間 Web サイトを構築してきた) に、この用語が非常に初期の頃に何を意味するか知っているかどうか尋ねたところ、彼は「はい」と答えました。 つまり、まったく新しい役職や役職ではありませんが、年月を経て範囲が変わったことは確かです。

「フロントエンド」とは、本質的には Web ブラウザーを意味します。 私は自分自身をフロントエンド開発者だと思っています。正直言って、私を Web ブラウザー開発者と呼んでも嫌いではありません。 しかし、それはおそらく受け入れられないでしょう (そして、Web ブラウザーを構築するように聞こえます)。 フロントエンド開発者として、Web ブラウザーと非常に密接に連携し、それらで実行されるコードを記述します。具体的には、HTML、CSS、JavaScript、および Web ブラウザーが話す他のいくつかの言語 (たとえば、SVG などのメディア形式) です。 または、おそらくもっと一般的に説明されているのは、ブラウザーが理解できる言語に最終的に処理されるコードです。 それはフロントエンド開発者としてのあなたの領域です!

ブラウザーは単独で存在するのではなく、さまざまなデバイスで実行されます。 私たちは、レスポンシブ デザインの時代を通じてそれを学びました。 そして最も重要なことは、ユーザーがそれらのデバイスでそれらのブラウザーを使用することです。 フロントエンド開発者ほどユーザーに近い人はいません。 そのため、フロントエンド開発者は、さまざまなデバイスで実行されるブラウザーを使用する人々のためにコードを作成します。

ユーザー、デバイス、ブラウザのこの巨大なランドスケープを扱うだけでも、それ自体が仕事です! あなたが自分の役職について哲学的に考えるのは毎日ではないと思いますが、それは問題ありません。 おじいちゃんのクリスと一緒にここで少し考えているところです。

コーディングブートキャンプを卒業したばかりで、ウェブサイト構築の経験がやや狭くて新しい場合は、フロントエンド開発を「React のもの」、バックエンド開発を「ノード」と考えても問題ありません。もの」または「Python のもの」など、最近最もホットなフレーバーです。 あなたも間違っていません。 React は通常、フロントエンド フレームワークとして使用されます (ブラウザーで実行される文字どおり JavaScript です)。 Node と Python は、実際には Web ブラウザーで実行されない言語の例です。 これらは、Web サーバー (コンピューター) で実行するように構築されています。

しばらくこの分野にとどまると、これらのライブラリ、言語、ビルドプロセス、さらにはウェブサイトを構築するための最善の方法に関する哲学全体が、ゆっくりとした流れのように行き来することがわかります。

過去の過ちから学ぶべきだと叫んで、時々拳を振っているベテランの人を目撃するかもしれません。 また、特に騒々しい若者が拳を高く振って、過去を無関係な文脈であり、もはや有用な話題ではないと宣言するのを目撃することもできます.

おそらく、どちらも正しいでしょう。 誰も意地悪をしない限り、それはすべて流れの一部です。

状況は変わります。 今日の多くの Web サイトは、過去の Web サイトよりも複雑であることは事実です。 特に大きいもの。 ソーシャル ネットワークとメディア プレーヤー。 旅行予約サイト。 eコマースの店頭。 エンジニアリングツール。 これらのサイトは大きなスタートを切り、ますます大きくなっています。 彼らは、彼らをサポートする大規模なチームによって経済的です。 この複雑さは、Web テクノロジーの変化の原因であり、新しい学校と古い学校の間の摩擦の原因です (簡単に説明できる場合)。

テクノロジー業界で働く多くの人々は、本質的に大きなウェブサイトで働いています。 そして、私たちはこれらの人々から最も頻繁に耳にします。 これらの人々はツールを構築します。 彼らはブログ記事を書き、ポッドキャストに参加し、講演を行います。 彼らは、ニーズに合わせてテクノロジー自体を変更するのに役立ちます。

その間、「フロントエンド」は依然として単なるブラウザです。 ブラウザー言語、HTML、CSS、および JavaScript は、依然として主要なテクノロジーです。 これらの言語は進化しており、ブラウザー自体も進化していますが、よりゆっくりとしています。 彼らは、シリコン バレーのお気に入りのスローガンである「 Move fast and break things.」とは正反対のことを行います。 彼らはゆっくりと動き、ほとんど何も壊しません。

フロントエンド開発者であることは、それらのデバイスでそれらのブラウザーを使用するユーザーを引き続き気にかけています。 彼らの経験が私たちの仕事です。 ツールは、うまくいけば、私たちがそれを行うのに役立ちます.

では、フロントエンド開発者として何をしているのですか?

• どの画面でも見栄えがするようにデザインを実行しています
• コンテンツにセマンティクスを適用しています
• 部品やスタイルを効率的に再利用できるように UI を抽象的に構築している
• ブラウザでレンダリングされるもののアクセシビリティを検討している
• サイトのパフォーマンスが気になる場合は、ブラウザーが使用しているリソースの大きさと量に対処していることを意味します。

これらは基本的にブラウザレベルの問題であり、それがフロントエンドであるため、これらのことは常に真実であり、常に真実であり続けるでしょう.

変化しているのは、ブラウザがより多くの作業を行えるようになったことです。 これには、ブラウザー API の機能の向上、ライブラリの機能の向上、コンピューターの性能の向上など、あらゆる種類の理由があります。 サーバーからブラウザーへの作業のオフロードは、長年にわたってますます理にかなっています (単一ページのアプリ!)。 振り子が元に戻るのを見て (事前にレンダリングされたサイト!)、妥協点を見つけるのは興味深いことですが (JAMstack!)。

最近のフロントエンド開発には、次のものも含まれる場合があります。

• 最も小さなコンポーネントからページ全体、さらには URL レベルまで、サイト全体を設計する
• API から独自のデータを取得し、必要に応じてデータを操作して表示する
• サイトの状態を自分で処理する
• ユーザーの操作と入力によるデータの変更/変更、およびそのデータの状態の維持と API を介したサーバーへの返送

これらはすべて、現在ブラウザーで実行できることであり、この古い開発者の目を大きく開いています。 すでにしなければならないすべてのことの上に責任があると考えると、それは干し草の山です。

干し草の山は何年にもわたって増加する傾向にありますが、フロントエンド開発者としての指針はそれほど変わっていません。 私たちの中心的な責任は、デバイスで Web ブラウザーを使用するユーザーの世話をすることです。 そのため、いくつかのデータを取得する必要があります。 ユーザーのニーズに応えるために、高速でセマンティックでアクセシブルなページを構築するために、これを行っています。 そのため、デザインシステムを構築する必要があります。 それはクールです。一貫性のない混乱を引き起こすことなく進化できる、ユーザーにとって理解しやすいインターフェイスを構築するためにこれを行っています。 そのため、なじみのない新しいテクノロジーを学ばなければなりません。 ええと、私たちの仕事は注意深く目を光らせ、ユーザーにとってより良いサイトにするために新しいものが最終的にそこにあることを確認することです.

頑張ってください！