daily ojisan

やりたいこと全部やりたい

2020年2月22日

余裕できたので書くぞ〜〜〜無職は延々とドックフーディングできて最高という気持ちになった。

👨‍🔧バイト1: デプロイする人1

ちょっと前から手伝ってるモバイルWebアプリの開発。デプロイで詰まっていた。S3にホスティングするのだが、実はS3でWebアプリを公開するのが初めてで色々手間取った。NextJSから静的ビルドしたものをホスティングするのだが、ルーティングがうまくいかなかった。いわゆる /signin には繋がらなくて /sign.html にしたら繋がるが、リンクは *.htmlに貼られていないというやつである。これが、S3(もしくはCF)の問題なのか、NextJSのexportsの問題なのかが分からなかった。Netlifyだとrerloadの挙動を記述できるファイルがあってそれを書けばよいのだがS3でのデプロイは初めてだったので苦労した。

さらに厄介だったのがSafariだけ繋がらないという問題で、クッキーがつかないという問題で悩んでいた。それが原因で延々とsigninにリダイレクトされ、.htmlがなくてエラーページという流れになり辛い思いになった。これはSafariは同一ドメインからしか認証が通らない制限があってのことで、そのことを忘れていてバグを踏み続けていた（1週間は有効っていう話と混同していた。）。なのでAPIサーバーと同じサブドメインから入ることで解消できた。

普段はPCChromeで開発していて、今回のはスマホ専用のWebアプリでSafariでの疎通を早い段階でするとなったので踏み抜いてしまったバグだった。スマホWebの開発体験を上げるためにもちゃんと疎通テクニックをまとめようと思った。今日1日でだいぶん学んだ。

🖥趣味プログラミング: Nextjsコードリーディング

上の問題があって、その原因の切り分けも兼ねてNextjsのコードを読んだ。最初は next build と next export した結果を比較しようとしていたのだが、動的に差し込まれまくる webpackの断片が意味わからなさ過ぎて断念。CLIツールの中を読んで、どういう生成をしているのかを追っていった。結局、build/index.tsやexport/worker.ts というファイルが本丸なのだなと分かった。build/index.tsは結局は諸々の設定を受け取ってreact-domのSSRモジュールを呼び出して、JSXをHTMLに変換していて、その前にいろいろな設定をしていた。が、その設定はよく分からなくて、webpackの関数を呼び出したり、そのwebpackは独自のbabel-loaderが挟まっていたりでちゃんとは追いきれなかったがこの辺がファイルの分割やdyanim loadを担っているんだなってことはなんとなーくは雰囲気は感じ取れた。読んでみてフレームワークというよりコンパイラだなという認識を持った。時間さえかければ読み解いていけそうと楽観的に考えている。

##2020年2月15日

🖋技術書典の準備 実は1文字も書いてないw 紙で出さない & 草案は書いてる ので舐めプしていたが流石にやばいので本気出してる。落ち着いたら日報書きます；；

2019-02-13_日報

📚読書: プログラミングの基礎

9章の写経していた。レコード・リストとパターンマッチが入り乱れたソースコードに対して苦手意識がなくった。振る舞いを''宣言''しているんだと意識を改めると途端に苦手意識がなくなった。試しにReasonMLのコードを読んでみたんだけど、どういう処理をしているか説明できるようになっていたので嬉しかった。（型引数はまだよくわかっていないが、それも後の章で説明があるので安心している）

💻趣味プログラミング: Contentful 日頃のTILだけをまとめたページを作ろうと思い、ちょっと前から技術ブログを作ろうと思っていた。で、一度は挫折したContentfulでサクッと作っていた。Contentfulなのかgatsbyのプラグインなのか原因は分からないが、登録したデータモデルをGraphQLで引っ張ってこれないという問題にはまっており苦戦した。適当な空データを登録したら治ったので、どうやらツール側のバグみたい。

またGatsbyもdotenv系のツールいれなくても環境変数を引っ張ってこれると説明はされているものの現実はちがうようで苦戦した。 https://www.tomawari.com/2019/09/gatsby-env-undefined/

💃飲み会 前職の先輩に壮行会ということで銀座の鮨に連れていってもらった。止まっている鮨を初めて食べた。しあわせ・・・

2019-02-12_日報

👨‍🔧バイト: videoタグ職人

動画の閲覧機能みたいなの作ってた。その中で動画一覧を全再生するみたいなのを作る必要があり、ちょっと苦戦した。

videoタグが持ってるplay()などはrefからしかアクセスできず、動画ごとにrefを作ってそれを再生位置などを調整しながら複数件同時再生させるみたいなのが大変だった。

あとemotionを使っているのだが、refをそのまま渡せなくて苦戦した。同様のことはs-cでもv3系ではあり、いわゆるrefではなくinnerRefを渡せってやつで、innerRefのことをすっかり忘れていてどハマりしていた。もともとrefは苦手意識があるので何が悪いのかの検討をつけるのに時間がかかった。

ちなみに何気にvideoタグをproductionで使うのは人生初

🖥趣味プログラミング: 環境構築

やっとVimの環境できた。Vim8 + CoCがうまくいかなかったので、結局NeoVimを入れた。設定そのまま引き継げたので楽チン。

次はDockerコンテナで動かすようVimの設定を書く。最近は本の写経ばかりしていて、環境差異をなくすためにコンテナで写経しているのだが、コンテナの中で作業するようにしているので、そのときの開発体験を向上させたい。

📚読書: Real World HTTP

Vimの環境できたので、vim-goとCoCでGoの環境を作って写経していた。この本は実装パートがあるのでそこを集中的に攻めた。この本はgolangでクライアントを書いていくのがメインなのが、HTTPの勉強はサーバーも書かないと良くわからなんなという気持ちになったので、Statusコード全部返せるまで帰れまてんみたいなことをやろうかなって考えていた。

とりあえず読みたいところは全部読んだので次何読むか悩んでる。せっかくGoの環境を作れたので、自作インタプリタの本やろうかなと思ってる。（ASTの勉強している時に途中までやった。そのときは実践でやることにして途中で読むのを切り上げている）

2019-02-10_日報

🖥趣味プログラミング: Contentful 父ちゃんな、JAM Stackで食っていこうと思うんだ。Gatsbyでコンパイル時にコンテンツ化できるバックエンドの技術選定をしていた。Contentfulはよく聞くので試してみたが、設定がめんどくさかったりmdで開発するのと手間があまり変わらなかったので、採用は見送った。GitHubのIssueをCMSにしようと考えている。

🖥趣味プログラミング: Vimの設定 シェル周りの設定はやりきったのでVimの設定している。本丸のエディタはVSCodeなのであまり時間をかける理由はないが、CUI環境に慣れたいので設定している。

CoCの導入で詰まっていた。Vim8じゃなくて大人しくNeoVim使った方が良いのかな的なこと考えてる。

💃飲み会 前職同期と飲んでた。来た人の半数が退職済みだった。退職の理由聞かれて答えるのはやっぱり慣れない（働きたくない以外の理由がないから）

🎮ゲーム: テイルズオブゼスティリア

多分終盤まで進んだ。訳があって攻略サイトなど見てないからどう着地するかが分かっていない。

📚読書: プログラミングの基礎 7, 8, 9章読んでた。OCamlのデータ構造の話が主で、組・レコード・リストを学んだ。写経しているのでパターンマッチには慣れてきたが、レコードの挙動はあまり慣れない。すでにtypeで型を宣言していれば、レコードを作った時に紐づいていくれるというのが慣れない。そしてそのあとに同じフィールドを持つ型を宣言したあとにレコードを作ると、後に作った型に紐づくというのも慣れない。同一のフィールドを持つ型はひとつしか存在できないということなのだろうか。仮にそうであるなら2回目のtype 宣言でエラーになってほしい。調べ方が悪いからだろうが解説も見当たらなくてうろうろしていた。とはいえこの本を読むにあたっては関係のないことなので先に読み進んでいく。

📚読書: Real World HTTP 7章読んでた。6章の実装をやろうと思ってたけど、まとまった気力が取れなかったので飛ばして先に7章を読んだ。

7章はHTTP2の内容だった。「HTTP1は6本しかコネクション貼れないけど、2は無限に貼れる」くらいの薄い理解しかしていなかった自分にとって、たくさん学びと発見がある章だった。

仕組みの解説を読んでみて、「フレームという単位に分割できることが肝で、フレームサイズを読み取って一気に中身を取得でき、たくさん流し込まれても並列に受け取っていくことができる、他の通信のフレームが間に挟み込まれても受け取れるから並列に作業できる」くらいの理解にはなった。

🎮ゲーム: テイルズオブゼスティリア

PS4で買ったゲームがPS5でできることを知ったこともあり、なんかゲームしようと思って買った。（ウィッチャー3は積んだ）

発売当初、Amazonのレビューでボロカスに書かれすぎていてむしろ気になっていた。やってみた感じ、酷いゲームとは思わなかった、むしろ楽しい。主人公が覚醒するシーン、主人公の友達が助けに来るシーン、敵の仮面が外れるシーンが熱くてよかった。

最後までやってよかったらレビュー書く。

2019-02-08_日報

昨日はなんか熱っぽかったからサボっちゃった。葛根湯飲んだら元気になった。やはり葛根湯は最強。

今日はフリーター生活1週目の最終日。普通に仕事してた。目指していた週休5日生活は難しいことを理解した。月に1度は週休5日weekを作ることへ目標を切り替える。

👨‍🔧バイト1: React 疎通で地獄をみてた。Des/FE/BE全員フルリモートで仕事をしているにも関わらず、API仕様書を作らずお気持ち駆動でやっているツケが回った。

技術選定ではSwagger等の定義を簡単に実装から吐けるかどうかっていう観点があった方が良いのかも。

開発中のFE側ではjson-serverを使っていたんだが、これを定義書にしてしまった方がよかったかもしれない。ちなみに agreed っていうapiのmockサーバーからspec吐けるライブラリがあったりもして、これを使っとけば良かったと後悔した。(json-serverの30秒でAPI建てれる魅力に負けた)

あとAjaxでCookie使う際の知識がポツポツ欠けているところがあって、BEに迷惑をかけてしまった。疎通くらいは対面でやった方が良いのかもと思った。反省しながらReal World HTTP読んだ。

👨‍🔧バイト2: React react + repatchな仕事してた。Fluxぽいツールを最近は使っていなかったので、懐かしい気持ちになった。既存コードでrepatchのstoreをcontextAPIで流してるの見て、react-reduxじゃんって思えたのは成長だと思った。

あと、Material UI(mui)に消耗していた。便利だがカスタマイズしようとすると独自ルールをたくさん覚えないといけなくて（テーマやアイコン周り）辛くなった。muiの勉強をしたいわけではないので、モチベーションは上がらない。昔に比べるとstyled-componentsなどで無理やりスタイルを上書きできるようにはなっていそうだが、muiのそもそもの作りがhackyなので変なスタイルの当たり方をして調整が難しい。コンポーネントライブラリはあまり好きになれない。

📚読書: Real World HTTP 5章読んでた。Web2.0って感じの内容。 どんぶり勘定でしか暗記していない系のことをたくさん学んだ。例えばAjaxとXMLHttpRequestの違い、SAMLとOpenIDとOAuthの違いなど。なんとなくは知ってるけど正しい定義を知らない系のことがたくさんまとまっている章だった。何と何はどう違うという風に厳密に学んでいく姿勢で学んでいきたい。時間がたくさんある以上は丁寧に学んでいこうと思う。

Real World HTTPはHTTPにまつわるキーワードを時系列順に + それが何を解決していったか という風に書いてくれているから、読んでいて楽しいし辛くならない。明日は実装パートなのではやくGo開発環境を整えたい。

2019-02-06_日報

友達の家に遊びに行った。そこで作業した。夜はスカイツリーでぶらぶら。平日に行くと空いててのんびりできた。

応用情報処理試験、申し込んでお金を振り込み忘れる実績を解除した。朝寝坊して受けれないっていう実績も存在するらしい。

💻趣味プログラミング: 技術書典準備 「ビルドに使うライブラリや設定、これいれないとこんなエラーでるよ」集みたいなの作ってる。これまで書いたビルドファイルを元に作っているのだけど、執筆段階でもエラー踏みまくっているので、やっぱりビルド周りって大変だなぁという気持ちになっている。いくらFWを使おうが、カスタマイズするときにこの辺の話題は避けられないので、自分のためにもしっかりまとめておきたい。

eslint-config-react-app と eslint-plugin-reactの違いは？ eslint-config-prettierとeslint-plugin-prettierの違いは？url-loader と file-loader の違いは？style-loader と css-loader の違いは？styled-components使う時ってcss系のloaderは必要？jest configのtransformが必要になるときは？moduleNameMapperはいつ使うの？@testing-library/jest-domと@testing-library/reactの違いは？ みたいことを書いている。だいたいこれらはいつも自分が踏んでる地雷です。

📚読書: Effective Java ストリームの章全部読んだ。読んだだけなので理解できていない。Effective JavaってJavaの言語仕様や機能の名称を知っていることが前提で書かれているので、Java歴が浅い僕にとっては自分で読んだだけだと全然理解が深まらない。何がわからないのかも分からない。明日輪読なので、色々聞こう。

2019-02-05_日報

仕事した日。あまり趣味なことができなかった。あと社会的な制約にスケジュールが管理されないからか、時間を変に浪費してそうってことを認識したので、ちゃんと週と月単位では目標を立てよう思った。フリーターだからといって無限に時間あるわけではない。

👨‍🔧バイト1 MTGで出社。repatch触る仕事もらった。複雑じゃないusecaseを書くときに、ちょうどいい具合の守備力で書けるから好き。

👨‍🔧バイト2 MTGで出社。PWA対応どこまでやっていいかみたいな話した。工数に余裕がある以上はとことんやっていきたい。それが許されている仕事なので楽しい。

📚読書: Real World HTTP 4章のHTTP1.1の話を読んでた。急にプロトコルや暗号の話でレイヤーが下がった。あまりすっと入ってこなかったので写経はまだしてない。関連する記事を適当にネットで読んで頭を慣らしてから、もう一度読み直そうと思う。

📚読書: Effective Java 今週末に輪読あるの忘れてたので読んでいる。enumとanotationの章を読んでた。その前の章であるジェネリクス全然理解できてないので、もう一度読み直したい。たぶん今後の人生でJavaを書くことはもうないと思うのでモチベーションが下がっている一方、この本で書かれていることはどの言語やるにしても知っておいた方が良いことぽいのでモチベーション高くやっていきたい。

2019-02-04_日報

📚読書: プログラミングの基礎 5章まで写経。まだまだ簡単。

OCamlの環境構築がまだ終わらない。今はコンテナ立てて中でインタプリタ動かしている。Homebrewで入れるopamの挙動が不安定そうなので、完全に理解するまではMacに環境作りたくない。Dockerの知識がほとんどないので、明日くらいキャッチアップするかっていう気になった。ホスト側とのファイル共有の仕組みをちゃんと理解したい。

明日からパターンマッチがでてくる章なのでOCamlぽさが出てくる。多分簡単には行かなくなるので気合い入れる。

📚読書: Real World HTTP 4章まで写経。3章、名前だけ知っている系の言葉（HTTP Headerの種類、ちゃんと覚えてないので）がたくさん解説されてて、ちゃんと理解できたような気になった。4章はその知識を実装していくのだが、一番興味があるキャッシュ周りの部分はここでは触れられなかったので、ちょっともやもや。

💻趣味プログラミング: 環境構築 Real World HTTPでGoを書くので、go-vimなどでVimの設定をしていた。golandを有償版で持っているが、CUI修行中なので封印してる。補完プラグインが他のプラグインと衝突したりしたので、設定を0から見直そうと。NeoVimベースで作ると良いという情報ももらったので明日試す。

ついでにターミナル環境も作り直す。なんかしっくりこない。tmuxよりiTermを使おうと思う。tmuxとの相性の問題で追い出したpreztoももう一度使ってみよう。