GAミント至上主義

Web Monomaniacal Developer.

2020-01-01から1年間の記事一覧

BigQueryの標準SQLでGROUP_CONCATしたいときはSTRING_AGG

BigQueryでGROUP BYした項目を文字列結合したいとき、レガシーSQLでは`GROUP_CONCAT`を使ってました。標準SQLにはなく、検索しても見つけづらかったのでメモ。 結論 STRING_AGGが使えます。 STRING_AGG([DISTINCT] expression [, delimiter] [ORDER BY key […

令和二年度 源泉徴収の給与所得控除後の給与等の計算処理実装でつらかったこと

業務で年末調整処理の一部、源泉徴収の給与所得控除後の給与等の計算を実装したけど いろいろつらかったことをメモする。主に行政資料への不満。従業員として出すだけでも面倒な年末調整ですが、もちろんその背後で行われている処理はもっと面倒です。www.nt…

シニアジョブの開発メンバー、こんな人欲しいなぁ(ポエム)

これまでエンジニア職の採用面接を適当にやりすぎていて、確認し忘れが出てしまうのが良くない。 採用基準とまではいけないけど、最低限確認したいこととをまとめたい。会社のエンジニア採用ページ。私が保守してるので内容は大丈夫なはず。 corp.senior-job…

TypeScriptでオプション的なオブジェクトをデフォルト値つきでいい感じに扱う

関数の引数や、クラスのコンストラクタとかでオプション系の値をオブジェクトで受け取るときに、いい感じに省略可能にする方法をよく忘れるのでメモ。 interface HogeFunctionOptions { optionFoo: string optionBar: string optionBuzz: string } const def…

ブラウザだけでVtuber用動画をつくるツールをKonvaとVueでつくってる

動画サンプル https://youtu.be/3t2l1OH00lU youtu.be 声はまだない。 作ってるやつ(スマホ非対応) uyamazak.github.io 使い方 STARTしていろんな操作して録画、STOPすると出てくるDOWNLOADボタンで落とせます。UIまじで並べただけ。 経緯 架空のVtuberを…

このブログについて(先頭固定)

【お約束】 投稿内容は個人の見解であり、所属する(していた)組織の公式見解ではありません。名前:uyamazak(昔いた会社で上司が開発用Linuxサーバーのユーザー名に「yuyamazaki」が長いので勝手に作ってくれた。読み方わからないけどウヤマザク)高校あ…

既存のLaravelプロジェクトに入ってたVueまわりの環境を整備した

一行 ESlint入れてたつもりがJSは1/3、CSSは2/3を削除できた 一行 そもそも? ESlint, Prettierインストール eslintの設定 .prettierrc lintコマンド追加 実行 JavaScript, CSSの容量削減 使ってないパッケージ削除で容量削減 fontawesomeの読み込み最適化 l…

Googleスプレッドシートを一行ずつJSONのファイルにしてGoogleドライブに書き出す

前回↓につづきスプレッドシートの処理。 uyamazak.hatenablog.com前回は1つのJSONだからメッセージに出してコピペで良かった。でも今回は都道府県ごとに数百文字のテキストがあり、すべてを1ファイルにまとめてしまうと100KB近くいってしまい、Ajaxでの取得…

Googleスプレッドシートを使って政府統計のデータをChart.jsで使えるJSONに変換する

シニアジョブで、サイトのコンテンツとして年代別就業状況の統計データを使うためにいろいろやったので流れをメモ。データは政府の政府統計ポータルサイトe-Statのものを使いました。リンクは都道府県別のもの。 www.e-stat.go.jp利用の際は出典の明記が必要…

microCMSのリッチテキスト内のimgタグをamp-imgに変換する

7/1に公開したシニアタイムズでは、NuxtJSとamp-moduleを使ってAMP対応を行いました。でもmicroCMSのリッチテキストで保存している記事本文は自分で対応する必要があります。基本的に生成されるHTMLはきれいなのでほとんど問題ないのですが、imgタグだけはam…

NuxtJSのAMPモジュールでamp-analyticsを使う方法

NuxtJS + AMPモジュールでGoogle Analyticsのタグを貼る際、ちょっと手コヅったのでメモ。GitHub - nuxt-community/amp-module: AMP Module for Nuxt このページを参考に AMP のグローバル サイトタグ | グローバル サイトタグ(gtag.js) | Google Develope…

NuxtJSとTypeScriptとmicroCMSとNetlifyとAlgoliaで自社メディアサイトつくった

2020/7/1に公開しました↓。いわゆるオウンドメディア的なもの。ここでは忘れないうちに技術的なことだけ書いておきます。 senior-job.co.jp見た感じ普通のブログですが、裏側はタイトルどおり今どきな技術で攻められるだけ攻めきった感あります。そのおかげ…

NuxtJSでhead内のbaseタグをhooksを使って無理やり消してAMPエラー解消した

ちょっと無理やりなややこしいことをしたのでその経緯を含めてメモ。設定でできるようになるといいな。NuxtJSでAMP対応をしてますが、router.baseを設定しサブディレクトリに公開しているため、headにbaseタグが入ってしまい、これがAMPテストツールのエラー…

Vue.js (NuxtJS) + TypeScriptでSlickを使うならvue-slick-carouselがおすすめ

デザイナーさんが作ったHTML + CSSをNuxtJS + TypeScript化していましたが、カルーセルにslickというライブラリが使われていました。レスポンシブにも対応していて、非常に高機能です。kenwheeler.github.io しかし、jQueryに依存しており、メンテナンス性や…

Firebase Functions + TypeScriptで複数リージョン指定する方法

デフォルトでus-central1で動くFirebase Functionsですが、やっぱりネットワークでレスポンス遅くなるので日本でも動かしたいなと思ってやってみたら下記のエラーが起きたのでメモ。Cloud Functions のロケーション | Firebase functions.region() でカンマ…

TypeScriptでdate-fnsを使って先月の最初と最後の日付を取得する

集計系だとデフォルトで先月1ヶ月分のってのをよくやる。結局使わなくなったけどメモ。日付でだいたい必要なものはdate-fnsで足りてます。TypeScriptでも問題なく使えます。date-fns.org実行時の日にちになるように関数。 import { format, startOfMonth, en…

Mac OSでFirebaseローカルエミュレータを動かす。Javaが必要

Firebaseのローカル開発環境で、Pub/Subだけ動かしてなかったので、最近リリースさればばかりのUIとともに試してみることにしました。 Mac OSのバージョンは10.15.4。firebase.googleblog.comCLIのバージョンが8.4.0以上なのを確認 $ firebase --version 8.4…

ユーザーの閲覧履歴をRedisのSorted Setを使って保存&表示する

ユーザーの閲覧履歴をDB(MySQL)からBigQueryに移すにあたり、既存のDBを使っている「最近見たお仕事」を表示する機能も変更が必要になりました。「最近見たお仕事」は文言は異なるものの、よくECなどでも「最近チェックした商品」、不動産系では「最近見た…

IEで起こるJavaScriptエラーをpolyfill.ioを使ってなんとかする

シニアジョブでは、まだまだ古いPCを使っているシニアの方が多いのか、令和になったこの頃でも、残念ながらIEのアクセス数が無視できない程度に健在です。JavaScriptのエラーが起きてしまうとその後の処理が止まってしまったり影響が多いため、なんとかした…

Cloud BuildのSlack通知をFirebase Functions + TypeScriptで作る

Cloud Buildは同じGCP製品だけあって非常にシンプルにFirebase(WEBしかやったことない)のデプロイを行えますが、ビルド成功、失敗時の通知機能はついてません。cloud.google.comCircle CIのように標準ではついていないので、下記の公式ドキュメントのよう…

@google-cloud/pubsubをTypeScriptで使おうとしたらエラー

@google-cloud/pubsub": "^1.7.2"を使い、tscしたところ下記のエラーが出た。www.npmjs.com node_modules/@grpc/grpc-js/build/src/call.d.ts:68:5 - error TS2416: Property '_write' in type 'ClientWritableStreamImpl<RequestType>' is not assignable to the same pr</requesttype>…

シニアジョブのデータ基盤のETLとしてApache AirflowをGKEで構築した理由

これまで小ネタは書いたけど、なぜApache Airflow (以下Airflow)使ってるのか、Cloud Composerを使わずGoogle Kubernetes Engine(以下GKE)を使っているのか等そもそも論的なことは書いてなかったので、忘れないうちにまとめ。 データ基盤を作る理由 シニア…

AirflowでImportError: cannot import name 'HTMLString' from 'wtforms.widgets'

AirflowをCloud Buildでビルドして動かしたら突然、下記のようなエラーが起きた。 Traceback (most recent call last): File "/usr/local/bin/airflow", line 26, in <module> from airflow.bin.cli import CLIFactory File "/usr/local/lib/python3.7/site-packages</module>…

AirflowのSlack通知で実行にかかった時間を表示する

Airflowを使っていてタスク完了時、失敗時にSlack通知を自作する必要があるけど、そこで実行にかかった時間を表示したかった。結論としてコールバックに渡されるcontextのdag_runにstart_date, end_dateが入っているので引き算すれば出せる。Airflowのバージ…

AirflowのwebserverでLBを通すとhttpにリダイレクトされてしまう問題

Cloud Composerを使わず、GKEでAirflowを構築し、ロードバランサーにGCP HTTPS Load Balancer+Google管理の証明書を使用した。通常の管理画面表示には問題なかったものの、VariablesなどのPOST系のアクションをすると、http接続に戻ってしまう問題があった…

Cloud BuildでGKEにデプロイするときに「Error: secret "key-name" not found」で死ぬ

手動でkubectlコマンドでデプロイは問題ないのに下記を参考にCloud BuildでGKEのデプロイをしたら「CreateContainerConfigError」でなかなかビルドが終了しなかった。podの状態をみると下記のような感じ $ kubectl get po NAME READY STATUS RESTARTS AGE ai…

Kubernetesの「converting YAML to JSON」エラーメッセージは信じるな

結論 npm install -g yaml-lint yamllint filename.yaml使うKubernetesを使ってるとyamlからは逃れられない。本当はJSONでやりたいけどだいたいのサンプルはyamlなので使わざるを得ない。自分で書いていて長くなってくるとどうしても構文エラーを起こしてし…

AirflowでGoogleアカウント認証を使う。RBAC使うのは諦めた

Airflowでは通常のメールアドレス+パスワード認証以外にOAuthが使えます。 会社でG Suiteを使っているのでGoogleアカウント認証が良さげ。パッケージのインストールが必要なのと、airflow.cfgの変更が必要。 Security — Airflow Documentation 基本的に上記…

AirflowのGoogleCloudStorageToBigQueryOperatorでAlready Existsエラー

差分だけ追記しようとしたら下記のエラーがでた。 Exception: BigQuery job failed. Final error was: {'reason': 'duplicate', 'message': 'Already Exists: Table project_id:airflow_local.table'}AirflowというよりはBigQueryの設定でwrite_disposition…

AirflowのMySqlToGoogleCloudStorageOperatorで実行時刻などをSQLで使う

ローカルで立てたAirflowで開発中のアプリDB→BigQueryのDAGがざっくり動いたので、今度は前回の更新日以降を差分同期したいと思った。 DBの種類がMySQLなのでちょっと違うけどやりたいのはまさにこれ。tech.enigmo.co.jp 前回実行時間と今回の実行時間があれ…