Vuetifyの便利機能
デザインわからん
私はデザインが苦手で、
テーマカラーとか色の組み合わせなんていい感じにできた試しがありません
そんな時はVuetifyのTheme generator
テーマカラーを実際のコンポーネントに当てはめて確認しながら決められます
色を決定したらexport themeで色をコード化できます
2パターンで表示できる
でも、そもそも色の組み合わせがわからん
そんな時はCoolorsですね
このサイトはいい感じな色の組み合わせを提案してくれます
もちろん提案してくれたものを細かくカスタマイズすることも可能です
どっちも本当に重宝します
デザイン(コーディングも)しっかり勉強しないと。。。
Atomic Designって本買ったから時間見つけて読まなきゃ
『Clean Architecture』を読んだよ
名著
特に響いた1節をネタバレにならない程度にいくつか紹介します
第4章
「テストによってプログラムが正しくないことは証明できるが、プログラムが正しいことは証明できないのである。」
ポパーだね
すごくしっくりきた
第5章
Object Orientedとはソフトウェアアーキテクトの観点からすると、
「ポリモーフィズムを使用することで、システムにあるすべてのソースコードの依存関係を絶対的に制御する能力」
この章あたりから依存関係の方向だとかがキーワードになってきた
第7章
単一責任の原則(SRP)
「モジュールはたった一つのアクター(変更を望む人たちをまとめたグループ)に対して責任を負うべきである」
SRPを誤認識していたのがわかった
とても目から鱗
第11章
- 変化しやすい具象クラスを参照しない
- 変化しやすい具象クラスを継承しない
- 具象関数をオーバーライドしない
- 変化しやすい具象を名指しで参照しない
ここは本当に反省反省の内容だった
読みやすいし、とても勉強になるからおすすめです
JavaScript DOMをたくさん追加する際にはcreateDocumentFragmentを使う
JSのtips
JavaScriptでcreateElementしてそれをレンダリングすることって結構あると思います
1つのDOMを追加するならともかく、複数のDOMをそれぞれ追加するのは、
毎回DOMツリーにアクセスすることになったり、
DOMの位置計算など起こるので、
パフォーマンスを 考慮すると避けたい所です
そこでDOMをたくさん追加する際にはcreateDocumentFragmentを使うといい感じです
めっちゃざっくり言うと、
DOMの塊を作成して、それをまとめてDOMツリーに追加するって感じですね
簡単な使用例を用意しておきました
jsfiddle.net
何かの参考になれば幸いです
appendChildの注意点
今回は生のJavaScriptのtipsを
タイトルの通り、appendChildについて
デモをjsfiddleで作成しておきました
パッと見、
コードを見ると両方のdivタグにparaが表示されそうじゃないですか?
結果はでも通りで
2つ目のdivタグ内にしか表示されていないですよね
mozillaで挙動を確認すると、
Node.appendChild() メソッドは、特定の親ノードの子ノードリストの末尾にノードを追加します。追加しようとしたノードが既に存在していたら、それは現在の親ノードから除かれ、新しい親ノードに追加されます(他のノードに追加する前にそのノードを親ノードから削除する必要はありません)。
つまり今回の例でいうと、
forEach内では
1つ目のdivにちゃんとnodeを追加したが、
次のループで、すでに追加しようとしたnodeがdocumentがあるので
その既存のnode(1つ目のdivに追加されたもの)を2つ目のdivに移動した
その結果、1つ目のdivには表示されなく、2つ目のdivのみに表示されたということですね
個人的に落とし穴になりそうなポイントだと思っています
Cloud AceさんのGCP公式トレーニングに参加してきたよ
自費☆参加
独立してお給料高くなるのは、
そのうちの幾らかは自己投資に回すためだと思っている
背景として、
今参画しているプロジェクトで
GAE、cloud function、pub/subなどを使う必要が出てきた
けどGCP全く知らん
せっかくやししっかり勉強しよう!
って感じです
今回はここに参加してきたよ
https://www.cloud-ace.jp/gcp-training_course/detail01/
概要を知るためのコースかな
アジェンダは下記の通り
- モジュール 1: Google Cloud Platform の概要
- モジュール 2: Google Cloud Platform の初歩
- モジュール 3: Google App Engine と Google Cloud Datastore
- モジュール 4: Google Cloud Platform のストレージ オプション
- モジュール 5: Google Container Engine
- モジュール 6: Google Compute Engine とネットワーキング
- モジュール 7: ビッグデータと機械学習
各テーマについて説明があって、
簡単なミニテストがあって、
実際に手を動かしてみるという感じ
ところどころ、
テキストが古くて、実際のコンソール画面と乖離があって躊躇した
有料コースなんだから、そこらへんはしっかりしといて欲しかったな
app engineとかDatastoreは,
AWSでいうとこのあれかなみたいな感じでついていけたけど、
ネットワークとか機械学習あたりはきつかったよ
GCPをざっと俯瞰できて楽しかった
これとかも参加したいな〜
高い。。。
https://www.cloud-ace.jp/gcp-training_course/detail03/