関ジャバ'19 8月に参加した感想
この記事は『関ジャバ'19 8月』でのセッション内容を説明するもの、及びセッションで扱った技術内容を解説するものではありません。 私がイベントに参加して興味を持ったこと、感じたことを纏めた備忘録・日記を公開しているだけです。なるだけ誤った情報を書かないつもりですが、誤った情報を書いていれば指摘してもらえたら嬉しいです。
今回はセッションが3つ。おもったより日記が長くなっちゃったのでまずは①②の感想書いて
今週末に③の感想書こう。
①Reactの公式ドキュメントが読めるようになった / ふじたさん(30min)
②Kubernetesでやらかしたりハマったりした話 / SusumuYamadaさん(30min)
③リフレクションで遊ぼう / うらがみさん(60min)
Reactの公式ドキュメントが読めるようになった / ふじたさん(30min)
React式ドキュメントの話
開発経験がないまま公式ドキュメントを見ててもピンと来なくてそっ閉じしてたけど
実際にコード書いてレビュー受けてを繰り返したら公式ドキュメントもよめるようになったって話。
自分が公式ドキュメント読みに行く、読めるようになるまでどういう経過だったかなぁと振り返ると
1.エラーに困って公式ドキュメント見に行ってピンとこない
2.関連してそうなブログ記事を探して見様見真似で対策
3.対策がうまくいったら後で裏とりの意味で公式ドキュメント見る
って流れで公式ドキュメントとお付き合いして読めるようになるケースが多い気がする
(裏取りきらずに完結しちゃってることもいっっぱい有るので自信もって言えないけど...)
JSXについての話
JSXとは〜って話。
JSXで書いておけばユーザーの入力値もエスケープされるからXSS避けるメリットがあるんだなぁ。
あえてエスケープせずに素のHTMLとして表示させるのもVueにもReactにもあったなぁっと思って調べると、当たり前だけどそこでユーザーの入力値受け付けるんだったらXSSは起こせるみたい。
同じような仕組みに対して名前がVueはv-htmlなのに対して
ReactがdangerouslySetInnerHTMLっていう名前で注意を促してるのがなんか面白い。
https://ja.reactjs.org/docs/dom-elements.html#dangerouslysetinnerhtml
https://jp.vuejs.org/v2/guide/syntax.html#生の-HTML
React要素の話
ReactDOMのrender()とReact.Componentのrender()があるよーって話が面白かった。 ReactDOM.renderで既存?のDOM 要素をReact 要素にするっての、どいうとこで使うんだろう?って少し気になったので調べよう。
質問タイム
AtomicDesignは開発のスピード感を損ねるのでやめたってのがどういう背景だったのか気になったなぁ。
Reactの公式ドキュメントちゃんと読まないと知らないこといっぱいだなぁ、読みたいなぁ
読むためにも実際に書いてみないとなーって気分になった。
Kubernetesでやらかしたりハマったりした話 / SusumuYamadaさん(30min)
社内システムの自動化、CI/CD環境作ったりしていてやたかした話3本立て。
DBのデータを吹き飛ばした話
kubectl deleteでpod消すけど、DBのデータは外部ボリュームマウントしてるから消えないだろうと思ってたけど、DBのデータが吹き飛んだ話。 設定をちゃんと読まないままだったのが原因だったそ ↓前に表示されたymlの内容まで読めなかったけど、これかなぁ? https://kubernetes.io/docs/concepts/storage/persistent-volumes/#recycle
k8sちゃんと使ってないので、同様の自称に気をつけようというよりは、何かと設定ファイルしっかり読んでからコマンド実行しなきゃ怖いことになると改めて思う恐ろしい話だった。
メモリの食い過ぎでアプリが落ちた話
DBコンテナが唯一乗ってるワーカーノードが落ちたことで、そこに依存してる他ノードのアプリもDB起因で落ちるようになった。原因を探るとメモリ食い過ぎで落ちた話。 アップデートの時に新しいpodが起動してから古いpodが消えるようになってるので、アップデート繰り返してるとメモリ取り切れずに落ちたとかリソースの上限を設定するってお話だったから ↓のへん気をつけるって話かなぁ https://kubernetes.io/docs/concepts/workloads/controllers/deployment/#updating-a-deployment https://kubernetes.io/docs/concepts/configuration/manage-compute-resources-container/
k8sで気をつける観点というかTIPSを実体験から聞けて楽しかった。
ingressのバージョンのズレでうまく動かなかった話
インフラチームがクラスタを準備する(Ingress Controllerのバージョン)けど
podの設定(Ingressの設定)を書くのは各アプリチーム
その結果、Ingress Controllerのアップデートに対応できずIngressの設定がうまく通らなかった話...
っていう認識でよかったのかな、ここが知識不足でめっちゃふわっとしてる...
インフラチームの設定をアプリチームは能動的に情報取りに行かなきゃわからない状況が辛かったってのがとてもなるほど。 インフラとアプリチームそれぞれで環境設定するならブリッジする人いるなーって思った。
質問タイム
k8s使っててメリットはあったか?(k8sを使ってることで採用に繋がることも含め) って質問が出てた。 答えはメリットは使ってる人が楽しいくらいしかないとバッサリで笑った。 社内技術力低下へのカンフル剤としてk8sが採用された背景らしく、k8s自体?のメリットはないそう(採用も含め)。
ただ、使ってる人が楽しいって僕的には大事だなぁって思ってるところで 苦しみつつもエンジニアが楽しんで開発やら運用やらできてる状態は 業務が楽になるのと同じくらい大事に扱われてほしいし、技術選定やチームマネージメントをする立場になったら大事にしたいポイントだと思ってる。
全般通してk8sの知識が足りないので、たぶんこういう話してるのかなー?って聞き方になったのが勿体なかった。k8sもうちょっと学習したいなぁ。
3つのセッションぜんぶ楽しかった。 この日記書くためにメモとりながらイベント参加してみたけど、まぁまぁ話は取りこぼさずに聞けたかなー。
おしまい、おしまい。
VisualStudio CodeでReactのデバッグする時の手順
3回ググるハメになったのでもう記事にしちゃいます
完全にこれに習ってるだけ
Live edit and debug your React apps directly from VS Code — without leaving the editor 🔥 🎉🎈
create-react-appは済んでる前提です。
VisualStudio Codeの拡張機能「Debbger for Chrome」をインストール
デバッガーのアイコンを押して
「デバッグ▶」って書いてるとこの近くのアイコン(歯車マーク)を押したらlaunch.jsonが開く
launch.jsonの中をまるっと下に置き換えて
{ "version": "0.2.0", "configurations": [ { "name": "Chrome", "type": "chrome", "request": "launch", "url": "http://localhost:3000", "webRoot": "${workspaceRoot}/src" } ] }
npm startでかってに画面が立ち上がる
あとはお好みでコードにブレークポイント置いて開発しましょ!