事始め フロントエンドを極めたい。 いや、極めたいわけではない。しかし、不自由なく自分のシステムをユーザが使いやすい形に落とし込めるようにはなりたい。それも、そこそこきれいな感じに、バックエンドがどん何すごいことをしていてもユーザが結局使うのはフロントエンドなわけで。。。見せ方がへたくそだから評価が下がるのだけはまっぴらごめんだ。 ってことで買ったのがこの「フロントエンドの知識地図」ってほんなわけですね。はい。まあ、html,css,javascriptの基本的なところはそこそこわかっているんだけれども、一度体系的に学びたいなとね。
とりあえず一回読んだ後の感想 前半はhtmlとcssのグリッドレイアウト以外はためにならない話ばかりだった。 しかし、後半から面白くなっていった。付箋を貼った個所をとりあえず殴り書きさせてくれ。
まずはグリッドレイアウトの話のところだよね。htmlとcssを使って、どの要素をどこに配置するかっていうのが決められるという話だ。これは大事だと思う。 あー、vscodeがwebブラウザ技術を多分に含んでいる、それすなわちwebブラウザが多分にvscodeに技術を含んでいるってことで、githubでvscodeそっくりなテキストエディタが使えるよって話。 はいはい、webのフロントエンドはフレームワークが多すぎてね、何が何かわからないじゃない。で、純粋なjsのことをvanila jsっていうみたいです。 MDNっていうのがhtml + css + jsを用いた開発の辞書みたいなもんやと vanilaで開発しても結局モジュールごとにファイルを分けないと可読性が下がる。だったら、もうReactを使っていいんじゃねーのか、とも思ってきたわけです。 といっても、Jsのフレームワークはあくまでも処理部分をやってくれるフレームワーク。装飾はやってくれない。だから、cssの知識は必要。だけど、タグ内にクラス名を指定するだけで統一感を持たせてくれるのがBootstrapってわけですね。BootStrapは使い方だけは知っておこうよ フロントエンドの知識地図だけど、やっぱりapiのことは説明してたよね。REST,Graphql,RPC全般。まあ、しばらくはRESTでいいよ。簡単だし、なれたし。イケてるIT系のバックエンドではRPCが使われているらしいけどね。 フロントエンドからRESTを使ってバックエンドと通信するときの関数として、fetch APIと、axiosが紹介されています。fetchはブラウザに標準でついている。が、通信機能しか備えていなくて使いづらいのでaxiosの方がいいんじゃね?って言ってます。 CORSについてもちゃんと説明していますね。原則としてwebサイトやwebアプリケーションから、ほかのサーバにあるAPIは読み出せないようになっています。なぜか?これができると、例えば悪意のあるjsスクリプトを入れてamazonの個人情報をゲットしちゃおー!とかができるからですね。でも、corsができないと不便なこともあるよね。その時は、WEBサイトではなく、APIサーバ側 (上の例でいうとamazon側) でcors okをする。 でも思ったんだけど、originがどこかってブラウザが知ってるわけじゃん?つまり、ブラウザをハックすればcorsもできるようになるって話や。 ...