2021買ったものまとめ
2021年買ったものをまとめつつ振り返る。やはりコロナ禍+引っ越しというのが影響が大きくてお家時間を快適するものを買っていた。
衣
今年あんまり服買わなかった。仕事はいつもシャツだし、パーカー来てるしですり減らなかったな。という感じ。来年はスニーカーとか買って外出とかしたい
食
デロンギ(DeLonghi) 全自動コーヒーメーカー マグニフィカS
今年一番使った家電はこれ。場所が必要だったり音が少し大きかったりするけど、平日ほぼ毎日飲んでいたような気がする。豆は妻がSTORESなどで買ってきてくれたので無限に出てくる。
まだ買って間もないけどコーヒーが冷めるのが微妙だったので、コーヒーカップウォーマーにも期待している
デロンギ(DeLonghi)電気ケトル アイコナ カフェ グレー 温度設定機能 / 保温機能付き 1.0L
同じデロンギから。ティファールの電気ケトルを使っていたがだいぶ使い込んでいたので買い替え。保温できるのがよい。あとなんと言っても60℃, 80℃,100℃と分けられるのがとてもよい。○○茶だと60℃でXX茶だと70℃みたいな使い分けをしてる
タイガー魔法瓶(TIGER) 炊飯器 3.5合 一人暮らし用 土鍋圧力IH ご泡火炊き 本土鍋
東日本大震災で炊飯器が壊れて以来買ってなかったけど、家に引きこもってるので温かいごはんを食べたいなと言うことで購入。下手に安いものを買って悪い体験するよりもいい体験を得たかったのでこれにした。ミネラルウォーターで炊くと水道水とぜんぜん違うことに気づく。いろんな種類のお米を試しながら楽しんでいる。
住
[幅160] パソコンデスク 引き出し付き 天然木使用 ヴィンテージ調 インダストリアル 書斎
去年100cmの机を買ったけど、引っ越しでだいぶスペースが取れたので思い切って160cmの机を購入。ホワイトボードなどを余裕持っておけるので思考するスペースが取れた。
その他
高校時代にやっていたテニスを2x年ぶりに再開したのでテニスラケットを購入。ラファエル・ナダルのプレイスタイルが好きだしスピンをかけるスタイルだったのでこちらを購入。
以上、買ったものでした。来年も経済回していくぞ!!
Railsでwicked_pdf/wkhtmltopdf-binaryを使ってPDFファイルを出力する2021
RailsアプリでPDFファイルを出力することがあってそのときにハマったことをメモする
対象バージョン
wicked_pdf (2.1.0) wkhtmltopdf-binary (0.12.6.5)
HTMLファイルでデバッグ的な何かをする
PDFでデザイン崩れを修正するのは一苦労なので、render時に show_as_html
を渡す。
そうするとHTMLでデザインが見れるのでブラウザのdev toolsでCSSをいじって微調整ができる。
ただし!あくまでもブラウザで見えるだけであり、実際のPDFとはまた見え方が違うので過信しすぎてはいけない
respond_to do |format| format.pdf do render pdf: name, template: template, show_as_html: params[:debug].present? && !Rails.env.production? end end
Flexboxを使うときにはベンダープレフィックスが必要
タイトルの通りFlexboxを使うときはベンダープレフィックスが必要となる。これはwkhtmltopdfが古いブラウザエンジンを使っているため。
例えばこういう書き方が必要となってくる
.flex-row-container{ display: flex; justify-content: space-between; align-items: center; display: -webkit-box; -webkit-box-pack: justify; -webkit-box-align: center; }
.flex-column-container { display: flex; flex-direction: column; display: -webkit-box; -webkit-box-orient: vertical; }
画像を埋め込む
Base64で埋め込むことになる。理由としては、画面から見えるときはいつもの癖で <img src="http://localhost:3000/some_image.jpg">
みたいにしてもできることはできるが、sidekiqなどの非同期処理で画像を埋め込むことを考慮すると(http://localhost:3000
しても画像はみえないため)Base64で埋め込んだほうが良い。wicked_pdfがヘルパーを作っているので、assetからは以下のようにして読み出せる。
<%= image_tag wicked_pdf_asset_base64("some_image") %>
wicked_pdfではwebpacker用のヘルパーもあるが、上記の理由で使ってはいない。SGVファイルを埋め込むヘルパーがチームで用意されていたのでそれを使っている。
<%= embedded_svg(asset_pack_path("some_image.svg")) %> def embedded_svg(filename, options = {}) File.open("public/#{filename}", 'rb') do |file| doc = Nokogiri::HTML::DocumentFragment.parse file.read svg = doc.at_css 'svg' svg['class'] = options[:class] if options[:class].present? doc.to_html.html_safe end end
マシンパワーで頑張ってもらう
ローカル環境で開発するときはやはり遅いのでマシンパワーで頑張ってもらう
未解決: AWS Amplify + Cognito + Google + Angularでログイン画面を作りたかった
やりたかったこと
AWS Cognito を用いてプロバイダをGoogleにしてログイン画面を作りたい。将来的にFacebookログインも作りたい。Amplifyを使うのはAWS CognitoのデフォルトUIはちょっと ダサい アレなので独自でクライアント側を持ちたかった
やったこと
AnuglarとAmplify のインストール
npx ng new boyaki npm install --save aws-amplify @aws-amplify/ui-angular
が入る
GoogleのOAuth クライアント ID の作成
GCPの「APIとサービス」→「認証情報」からOAuthクライアントIDでWebアプリケーション選択しクライアントIDとシークレットを作成する。あとで、「承認済みの JavaScript 生成元」と「リダイレクトURL」に http://localhost:4200
と Cognitoで作られたAmazon Cognito ドメインを指定する。
ユーザープールへのソーシャル ID プロバイダーの追加 - Amazon Cognito
amplify init
amplify initをするがCloud Formation, IAM Roleなどを作るので結構強い権限が必要になる。この時点でうーん... となってた。3分ぐらいするとAmplifyのアプリケーションができる
amplify add auth
先程作ったGoogle側のクライアントIDとシークレットIDをコピペする
amplify push
これでCognitoなどが作られる
Googleログインボタンを作る
最初は AmplifyDoc などを読んでいたけど、RubyMineのオートコンプリート機能を使ってAPIを探していると amplify-google-button
ボタンがあるということに気づく
app.component.htmlに
<amplify-google-button [clientId]="<Google側のクライアントID>"></amplify-google-button>
と書くと冒頭のボタンがでる
躓いたエラー
「Sign With Google」ボタンを押すとConsoleログに POST https://cognito-identity.us-east-1.amazonaws.com/ 400
と NotAuthorizedException: Token is not from a supported provider of this identity pool
が出る。
終わりに
amplify delete
をしてお片付け
感想
よくよく考えればAngular側にGoogleのクライアントIDを渡している時点でCognitoで吸収できてなくね?という疑問に早く気付けばよかったです まる
10年以上ぶりに引っ越しをした
4月末に10年以上ぶりぐらいに引っ越した(賃貸→賃貸)のでそのまとめ
引っ越しした理由
今まで1Kだったが、単純に物が増えてきて手狭になったことと、リモートワークになって生活と仕事がより身近になって仕事場の横にベッドがある状態であんまり休まらなかったことの2つがある。物が増えてきたのはもう何年も前から少し物件を探していたけど、リモートワークになったことが決め手になった
どうやって探したの?
SUUMO https://suumo.jp/をつかった。ISUCON 10 でSUUMOを題材にした問題が出たことがあって記憶に残っていた。
やったこと
インターネット!インターネット!インターネット!!
今まで共有回線で下りが30Mbpsぐらい出ていたので最低でもそれぐらいは欲しいと考えて、SUUMOで「高速ネット」を検索条件にして入れてたけど、だいたい出てくるのは無料インターネット(ただし遅い)みたいな物件ばかりだった。なので、不動産屋さんには「個別回線引けますか?」とずっと聞き続けていた。
個別回線引いていいよーという聞けたときは「勝った」というお気持ちになってた。引っ越し当日に業者さんが「うーん、これ難しいかも…」と言ってたときは本当にどうしようか焦って開通したときには拍手してしまった
気持ちを切り替えられるスペースをつくる
これは今の心身の状態によるのだけど、昔みたいにずっと働くことは無理で休みをとることが必要な状態になっている。なので、寝室と仕事をする場所を分けてスイッチを切り替えれるようにした。また、リビングが広いのでテニスの素振りをすることもできる。
いつも行く場所から近いところにする
2週に1回カイロプラティックと毎週テニスに行ってるのでそこからあまり遠くないところを選んだ。基本出不精なのでちゃんと行き続けるためにはこういうところから。
わかったこと
洗濯乾燥機のサイズを見くびってはいけない
洗濯乾燥機の横幅とかは測ってたので大丈夫だったけど、扉を開いた時の奥行きを測ってなかった。まぁ大丈夫やろーと思ってたら案の定厳しくてギリギリ入るサイズになってしまった。不満と言ったらそれぐらいであとは特に不満らしい不満はない
新しく導入したもの
デロンギ
仕事場でコーヒーを飲むことが多かったのでついに導入。音は大きく、大分場所はとるもののコンビニでコーヒー買うよりもコスパはきっといい。デロンギを置く台はニトリで購入。
Fire Stick
これはいただきものなのだけど非常によかった。Amazon Prime Videoの他にもWowowのオンライン配信がテレビで見えるのは非常に良い体験。これでテニスのWowowオンデマンド配信を見てる。
Committee + Open APIでYAMLファイルを分割する 2021年夏版の続き
続きがあった。
openapi: 3.0.3 info: title: Title description: Title version: 1.0.1 servers: - url: 'http://localhost' paths: /api/token/{id}: $ref: './token.yaml#/paths/~1api~1token~1{id}'
このように/api/token/{id}
という風に{}
を入れると URI::InvalidURIError: bad URI(is not URI?): "./token.yaml#/paths/~1api~1token~1{id}"
が発生する。
これは{
→ %7b
、}
→ %7d
という形でエスケープする必要がある
Committee + Open APIでYAMLファイルを分割する 2021年夏版
やりたいこと
OpenAPIでAPIを定義したいが、ファイルを分割して管理したい
バージョン
- Committee 4.0.0(committee-rail 0.5.1)
- Open API 3.0.3
最初にやったこと&課題
Open APIの仕様に則ってAPIを(ここではopenapi.yamlとした)を定義した
openapi: 3.0.3 info: title: Title description: Title version: 1.0.1 servers: - url: 'http://localhost' paths: /api/token: get: description: get access token responses: 200: description: success content: application/json: schema: type: object required: - token example: { token: 'access token' } properties: token: type: string
RailsのRequestSpecはこんな感じ
require 'rails_helper' RSpec.describe 'Api::Token', type: :request do include Committee::Rails::Test::Methods it 'GET /token' do get api_token_path expect(response).to have_http_status 200 assert_response_schema_confirm 200 end end
かんたんな文字列を返すAPIを定義した。ただこれだとみんなで触るときにコンフリクトとかが頻発するのでわけたい。
ファイルを分割する
$ref
というのがOpenAPIに定義されているので、それが使えそう。$ref の使い方のドキュメントを読むとpaths
直下には入れられないので、get
以降を切り出す。
openapi.yaml
openapi: 3.0.3 info: title: Title description: Title version: 1.0.1 servers: - url: 'http://localhost' paths: /api/token: $ref: 'token.yaml'
token.yaml
get: description: get access token responses: 200: description: success content: application/json: schema: type: object required: - token example: { token: 'access token' } properties: token: type: string
これでテストを実行すると以下のようなエラーが出て怒られる。redoc からHTMLを生成するときちんと生成されるのが余計にわからん...
NoMethodError: undefined method `set_path_item_to_operation' for # 0) Api::Token GET /token Failure/Error: assert_response_schema_confirm 200 NoMethodError: undefined method `set_path_item_to_operation' for #
エラーを読んでみる
set_path_item_to_operation for #
なので、path itemが足りない?となってドキュメント読んだりしてた。
結論
pathsとURLを分割先のファイルに記載して書けばよかった。ドキュメントや探してみてもCommitteeのIssuesを見ても特にチケット上がってなかったのでよくわからんが動いた
openapi.yaml
openapi: 3.0.3 info: title: Title description: Title version: 1.0.1 servers: - url: 'http://localhost' paths: /api/token: # ~1は`/` のエスケープ $ref: './token.yaml#/paths/~1api~1token'
token.yaml
paths: /api/token: get: description: get access token responses: 200: description: success content: application/json: schema: type: object required: - token example: { token: 'access token' } properties: token: type: string
Intellij IDEAで効率よくdirenvを使う
環境変数を .envrc
ファイルに書いて読み込ませるdirenvがあるがこれをサポートするIntellij IDEA系のプラグインがほとんどないのでうまいやり方を考える。Direnv Integration はあるが.envrc
ファイルを新規作成したときしかうまく動いてないぽいのでちょっと様子見。
Railsプロジェクトでやったが、Javaでも使えると思う。
手順
.envrc
ファイルを作成する。この時点で テスト用 の設定ファイルを書いておく。例えばexport foo=test
と書く。- ターミナルを開いて
idea
コマンドで起動する。この時点でIDE には環境変数foo=test
が読み込まれている。 - テストでは複数のRun Configurationを使いたいが都度書き換えるのがめんどくさいので、IDEからテストを起動するときはIDEに上述の設定をそのまま使う。
- IDEからrailsを起動するときはRun Configurationの Environment Valuesで
foo=test
を上書きして起動させる
新規に設定するときはIDEを起動し直さないといけない&Toolboxから起動できないのがネック。