オーストラリア旅行中に「フロントエンドの知識地図」を読んだ

ツノ
·

読んだ目的

フロントエンドに携わっていたが全体像を理解しているとは言い切れない状態だったため。オーストラリア旅行中に機内移動など虚無の時間が多そうだったので電子書籍でパラパラめくる系の本を読んでおきたかった。

感想

知識地図という通り浅くひろく。一部知らないところもあった。浅くひろくなので知識が定着しなそうなので再読した方がいいかも

アウトプット

印象に残っているとこを目次を見ながらつらつらと

tanstack

Udemyで初めて触っていたのでタイムリー。fetch処理をhookっぽく書けるのでシンプルな構成になるという理解。

2種類のフロントエンド

当たり前だけど作るものに対して利用する技術や人員は異なってくる。大きく大別すると以下

  • Webサイト:システムではないLPなど。アニメーションなども使う

  • Webアプリケーション:コンポーネントなどの部品化を行うことが多い、システムとして複雑になるので関係者が多くなる。

フロントエンドとしてのNode.jsとは

  • 開発環境構築のため利用する:npmでインストールする等(install コマンドに関わる処理)

  • サーバーとして利用する:テストサーバー、開発サーバー(run コマンドに関わる処理)

標準仕様

  • HTML、CSS、js全てに標準仕様がある。

  • ブラウザ間の互換性は、支えつやつは使いつつ、使えないものは使わないでも問題ないようにするべき

レンダリング

  • CSR:クライアント側でJSの実行を行い画面を作成する

  • SSR:サーバサイド側でJSの実行を行い、副産物をクライアントに渡す

  • SSG:サーバサイドに出来上がったものを置いておいて、それをクライアントに渡す

  • ISR:SSRとSSGをうまい感じに使い分ける。キャッシュを使う

デザインはコミュニケーションととりながらユーザー視点で

@2nofa11
ゆっぽくんが好きなエンジニア