超ブレーキ

オレオレブログのbackendをSPAにするってんでReactやってんだけど、全然進まなくてなー。

書き方

Hooks登場してからはClassではなくFunctionで書けって話らしく。Classだと今までの言語と同じような"感じ"で書けたのだけどアロー地獄(JS専の人たちはこっちのほうを好むみたいだけど)になるのでなんか脳が働かない。これが俗に言うJava屋のオッサン脳だ!や、Javaはやったことほとんどないんだけど。

デザイン

スクラッチからデザインするのが嫌(センスもないですし)なのでMaterial UI使ってるんだけど、ちょっと修正したいなーってなってもどこを修正すればいいのかよくわからんので調べるのにめちゃくちゃ時間がかかる。これ雛形っぽいのだけ作ってCSSパクる -> 自分でFormなりなんなり書く、のほうが早いかもなー。

最適解

CRUDの最適解というかガイドというか。そういうものの存在を見つけられていない。海外含めてaxiosでGETだのするexampleは死ぬほど転がっているが、どれもこれもテストJSONをhogeってfugaって終わり、みたいなものばかり。React自体がFrameworkではなくViewLibraryってのもあるんだろうけど。なのでイチイチ試行錯誤するのでごらんの有様だよ。

途中経過

作り途中がこれ。一覧取得と投稿画面の画像アップロード(D&D含む)はダミーphp。前者は決まったjsonファイルを読んで返すだけ、後者はシンシアの画像URLがレスポンスされるだけ、になってます。

https://www.dobusarai.net/reactdemo/

というか、Goでのサーバサイド実装時間をすでに超えている。これが終わったら次はGodotやりたいんだよなー。もう細かいことはこだわらずにとっとと終わらせる。

画像の遅延ロード

を、適当に実装したのだけどpagespeed insightでは高評価。スクロールして描画位置に来たらロードってのもあるので考えたのだけど、javascriptの容量を極力減らすのがミッションだと思ってやってる。

あとの問題はデザインだよなー。わしはデザイナーでもフロントエンドでもないから、わりかし見様見真似なので。water.cssは軽量で最高なのだけれどgridないのでミリグラムを採用した。

https://www.dobusarai.net/lazyload/

[GAS] Google Drive File Rename

甥っ子の動画/写真をスマホで撮影すると、自動的にDropBoxに保存されるようにしている。しかし、容量の問題もあるので現在はLocal(HDD x2)とGoogle Drive(100GBの有料のやつ)にバックアップしている。余談だがDropBoxも年額2500円程度のプランを用意してくれれば、そちらで課金したと思う。無料枠の上が急に1TBとなり、月額1200円になるのは個人ユースをあまり想定していないからなのだろうか。

で、Google Driveなのだが家族と共有していて、私自身が撮影していないファイルもアップされる。ところが、ファイル名に一定の規則が無い。私のスマホの場合は、DropBoxがタイムスタンプをファイル名にしてUpされるのだが、そうでない環境の場合はIMGから始まる文字列が多いようだ。そこで一気にリネームするスクリプトを書いた。

ex)
IMG_20170824_143404.jpg

2017-08-24 14.34.04.jpg

https://gist.github.com/dobusarai2016/fe6b9612416dc6a295cc664cd5336540