npm run huequica:dev

なんか長めのはなしとか

Linux の 1Password において OTP が incorrect と言われる

前提

  • Manjaro Linux 環境。でも多分 Arch ならどれでも起きるかも
    • Kubuntu 環境の友達に聞いた所この現象は起きてないらしい
  • Webシステム側、及びインフラに問題はない
    • iOS, Windows の 1Password でログインが通るため

tl;dr

$ sudo timedatectl set-ntp true

こちらで NTP service を active にしたら解消した

問題

  1. 例えば Twitter にログインしようとする
  2. Twitter から ID と Password を聞かれる。1Password が自動入力する
  3. Twitter から OTP を聞かれる。 1Password が自動入力する
  4. 「あ~もう一回言ってくれ」と Twitter から言われる

解消まで

原因を漁ったりしていたときにこんな投稿を見つけた。

自分ももしやと思いこちらを参照、実践してみるも解決せず。

dlrecord.hatenablog.com

ここでなんとなく timedatectl status を見たところ NTP service が inactive になってるのが気になった。
ここを activeに変えたところ(コマンドは tl;dr 参照)無事に正しい OTP を生成するようになり、無事ログインできるようになった

@leakFromSawada の最優秀産業廃棄物などをまとめる[2023年]

前年

huequica.hatenadiary.jp

前提事項

Q, leakFromSawada ってなに? A, 身内の discord サーバーの特定チャンネルの発言をツイッターに流す Bot

Q, 最優秀産業廃棄物とは? A, その年で一番

  • これはクソ
  • 大変な核爆弾
  • 怒られろ という反応が強いもの。要はうんちツイート

最優秀産業廃棄物

名誉出禁

(後日談: 本当にBANになった。)

これなに?

株式会社トップゲートを退職しました

tl;dr

  • 株式会社トップゲートを退職しました
    • 実は他の会社から転籍してトップゲートに行ってます
  • 次回は corp.wise-vine.com で働きます

退職の話

この度、勤務していた株式会社トップゲートから退職する運びとなりました。 約1年半の期間お世話になっていたことになります。

もともとは友人の誘いで別の会社に入ったのですが、転籍の形でトップゲートに入ってそこで仕事をする形になって現在に至ります。 この会社内では初めてフロントエンドまわり(フロントエンドのCI, CDなども対応範囲)を専任でさせていただく形になりましたが、最初はアーキテクチャ的な話にも気が配れず雰囲気で済ませている人間だったのですが先人の知識を数多く見ることで成長し、ここ最近で逆に教える立場になるくらいには成長できたのかなと考えています。 この会社に居たことによって多くの先人の知恵を吸収できたこと、多くの向上意識のあるエンジニアに囲まれて仕事ができたこと、上げだしたらきりがないくらい自分はこの会社で仕事したことによって得たものがありました。 本当に自分はラッキーでした。

開発者、PM陣、その他の方々には大変お世話になりました。 この場でお礼申し上げます。 ありがとうございました。 今後も個人的にであれば引き続きお付き合い頂けると幸いです。

node-jeneralize について

在籍中に起こした node-jeneralize ですが、トップゲートから退職したあとも引き続き owner としてリポジトリのメンテナンスを引き続き行っていきます。 pkfire や、最近出した mti についても行っていきますのでご支援の程をおねがいします。

to be continued...

次回予告です。Round about を流して例のところで下に流してください。

https://corp.wise-vine.com/

to be continued

@leakFromSawada の最優秀産業廃棄物などをまとめる

前提事項

Q, leakFromSawada ってなに?
A, 身内の discord サーバーの特定チャンネルの発言をツイッターに流す Bot

Q, 最優秀産業廃棄物とは?
A, その年で一番

  • これはクソ
  • 大変な核爆弾
  • 怒られろ

という反応が強いもの。要はうんちツイート

最優秀産業廃棄物

名誉出禁

これなに?

TypeScript の `String#toString` を使うと返却型が `string` にできる裏技(伊東家の食卓)

なにを言ってるんだァおめー?と思っている人が居たらそれは正しくて、あたしもこのタイトルを書いておいて(コンテキスト0だとあたりまえ体操だな)となっているワケですわね。

例題

2つの等しい value を持つ object が存在するとして、共通の value のみ残した object を作りたいと思う

const values = {
    hoge: 'fuga',
    moge: 'piyo',
} as const;

const searchTarget = {
    hoge: 'fuga',
    moge: 'boeeeee',
};

// values と searchTarget で共通の value を持つキーのみ残したものを作りたい
// const newValue = { hoge: 'fuga' }; // のような

このとき Object#fromEntriesObject#entries を使って以下のような実装をすると思う

Object.fromEntries(
    Object.entries(searchTarget).filter(
        ([_, text]) => Object.values(values).includes(text)
    )
)

js のコンテキストとしては問題ない、がTS のコンテキストだとエラーになる

なにが問題?

エラー出力の内容の通りなのだが Object.values で引っ張ってきた配列の型が 'fuga' | 'piyo' になっていて Object.entries(searchTarget) で引っ張ってくる textstring のため適合しないと言われる

解法

1. toString() を経由した string へのダウンキャスト

社で教えてもらった方法。 String#toString を 利用( 悪用 ) しつつ Array#some で検索するようにする

Object.fromEntries(
    Object.entries(searchTarget).filter(
        ([_, text]) => Object.values(values)
        .some((value) => value.toString() === text) // value の定義は 'fuga' | 'piyo'
    )
)

Array の存在確認系の実装は脳死includes() 使いがちだったのだが some() を使えば中でごにょごにょできる。 その上で value に対して toString を使う。すると型定義が string にダウンキャストされる

これによって型が適合する

2. Object.values に対してジェネリクスstring を渡す

身内の Discord のメンバーの人に教えてもらった方法。こちらはタイトルと関係ないがスマートなのでご紹介。

Object.fromEntries(
    Object.entries(searchTarget).filter(
        ([_, text]) => Object.values<string>(values).includes(text)
    )
)

Object.values が実はジェネリクスを受け取れるのでこれに string を渡してやる。 すると Object.values の返却型が string[] となるので includes() を使用しても問題なくなる。

playground

Playground のリンクを載せておくので興味がある人は触ってみると良いかも。

www.typescriptlang.org

`.eslintrc` や `.prettierrc`, `tsconfig.json` の Interface がどこに存在するのか

たぶんそんなに需要がある話ではないだろうけど。たまたま触る機会があったので。

.prettierrc

Options の名前で export されているのでこれを引っ張って来ればいい。

github.com

import { Options } from 'prettier';

const option: Options = {
  semi: true,
  singleQuote: true,
  tabWidth: 2,
  bracketSpacing: true,
  arrowParens: 'always',
  endOfLine: 'lf',
};

ちなみにこの型定義は prettier をインストールするだけで参照できるようになる。Prettier 側が自動で入れるように指定しているのか、はたまた何かがフックされているのかは分からん。

.eslintrc

こちらは module ではなく Linter という namespace 内部で定義されている。

github.com

import { Linter } from 'eslint';

type BaseConfig = Linter.Config;
type RuleRecord = Linter.RuleRecord;

const config: BaseConfig = {
  root: true,
  env: {
    es6: true,
    node: true,
  },
  // 以下省略
}

const addRule = (rule: RuleRecord): void => {
  config.rules = {
    ...config.rules,
    ...rule,
  };
);

多少雑なコードを書いたがこんなイメージだろうか こちらは @types/eslint が必ず必要なので別でインストールが必要

tsconfig.json

一番探すのに苦労した。最終的には pkg-types というモジュールが提供していたのでこちらを使うことになるのかなという気持ちだった。 ちなみに tsconfig.json の interface 以外にも package.json の型定義も提供しており、それのアクセスメソッドや生成メソッドも提供している中々に有益そうなパッケージとなっている。

github.com

www.npmjs.com

tsconfig の型定義は TSConfig という名前で export されているので、以下コードで引っ張ってきて使うことができる

import { TSConfig } from 'pkg-types';

const config: TSConfig = {
  compilerOptions: {
    module: 'commonjs',
    target: 'ES2018',
    // 以下省略
  },
};

2021年で買ってよかったものをいくつか紹介したい

まだ2021年なのでOK

1つ目: くるま

え~, これはもう言うまでもないでしょ
実際これで東京にも静岡にも旅行行ってるので
ローンで180万を4年かけて返済する 覚悟 をもって買いましたが, 未だに自分の車だという実感ないまま乗ってます.

2つ目: 42インチの4Kモニタ

こちらです

www.amazon.co.jp

かなりの大画面なので運搬も設置も地獄でしたがそれに見合ったパフォーマンスを発揮してます.
自分がリモートワーカーなので仕事でもこのモニターを使っているのですが, 画面が大きいと Slack と WebStorm を同デスクトップで展開できるので開発効率やコミュニケーションの反応レスポンスが多少上がった気がします.
今まで27インチのモニター2枚を横並びで使ってましたが, これ1枚で済むくらい良いものです
マジで買うべき

3つ目: Discord Nitro

厳密には 買ったもの ではないのですが, 会社で Discord をミーティングに頻繁に使うので契約して正解でした. あと絵文字が好き放題できるので使ってて楽しいのも大きいです.

4つ目: SwitchBot

www.amazon.co.jp

www.amazon.co.jp

こいつらを設置して認証付きのプロキシAPIを実装したことで家の家電を外で操作したりすることができるようになりました.
例えば外出先で帰るタイミングでAPIを叩くことで先にエアコンで部屋を暖かくしたりとかできるようになるわけですね. 実装したAPIについては CloudFunctions にて稼働させています.

github.com

5つ目: ミラーレス一眼(富士フイルム X-A7)

www.amazon.co.jp

「これ買って生活変わりました!!おすすめです!!!!」とか言うほど変な人間ではないですが, 趣味として買いました.
北海道行くときにも持っていきましたが買ってよかったと思います. 携帯で撮る写真とは格が違うのを感じます


ということで5つ紹介しました.
来年は何を買うんでしょうか. いや既に決まってるんですけどね