あのぞんブログ

anozon JavaScript とアニメ好き Web エンジニア。Twitter

unix timestamp の桁数が増えるのはいつか

2021-06-02

現在の桁数 現在 10 桁から 11 桁になるのは 2286 年 です。() その他 になったのは 2020 年 9 月からで、 になるのは 2023 年 11 月からです。 現上 2 桁が変わるのは 3.17 年周期です。 unix str 1000000000 200…

styled-components の keyframes で ts-styled-plugin のエラーが出る

2021-05-19

css animation の や などのキーワードに対して のエラーが出たので対処しました。 で animation を扱う場合以下のように書きます。 () この や に VS Code…

単色パネル表示するだけのツール作った

2021-02-19

たまにモニターの焼け付きが気になって、グレイ色の背景のウィンドウを用意して確認することがあります。 そんなときに単色のページ探すがだるいので Web ツール化しました。 真っ黒や真っ白なウィンドウも作ることができます。 ツール Mitelop…

【JavaScript】ズームしたときの座標を求める関数

2021-02-13

コード マンデルブロ集合をズームしてくサンプル 図の外側四角 () と選択点()と拡大率から 内側の四角()を求める関数です。 コード マンデルブロ集合をズームしてくサンプル コード tools/mandelbulb.tsx at master · elzup/tools…

React で特定の props を固定した特化コンポーネントを定義する

2021-01-19

React で特定の props を固定した特化コンポーネントを定義する方法をいくつかまとめました。 そのまま生の React で書く recompose/defaultProps を使う方法 styled-components を使う方法 DEMO です。 react-set…

jq コマンドで json の特定のフィールドを削る・抽出する

2021-01-15

コマンドを使って json 内部特定のフィールドを操作します。 抽出(pick)・削除(omit) ファイル入出力 配列の各要素を操作 で行えます。 抽出(pick)・削除(omit) ファイル入出力 配列の各要素を操作

ssh 接続先の vim でマウスの選択範囲をコピーする

2021-01-13

vim で mouse を off にする iTerm2 の設定

vim の q マクロを保存して使いまわす

2021-01-13

1 度作ったマクロを保存して、 vim を開き直したときも使いまわしたいときの方法。 マクロ に保存する例で説明します。 .vimrc に保存する q で macro を記録する → 操作 → で記録。 に追記する (外部クリップボードにコピーしたりしたいとき) b…

node.js で Streaming の メタデータを取得する

2021-01-12

この記事では node.js で Streaming の メタデータを取得する方法について紹介します。 を使用します。 TooTallNate/node-icy: Node.js module for parsing and/or injecting ICY metadata…

Raspberry Pi に Node.js セットアップ

2021-01-07

Raspberry Pi に Node.js 入れる方法のメモです。 tj/n: Node version management を使います。 .profile の設定 インストール作業

1px の画像データURLメモ

2021-01-06

1px 画像 の データ URL を並べておきます。 黒 白 透明 ついでジェネレーターアプリ化しておいたのでどうぞ。 1px data url generator

アロー関数とfunction それぞれの Type Guard 書き方

2021-01-04

この記事では アロー関数で Type Guard について紹介します。 TypeScript: TS Playground - An online editor for exploring TypeScript and JavaScript function パターン arrow…

React で URL props が変わったら fade アニメーションで 背景を変える

2020-12-29

props で指定された URL が変わったら フェードアウト し、 新しい URL 画像で フェードイン しながら表示するコンポーネントを作りました。 を使います。 デモ コード 呼び出す側のコード DiceBear Avatars…

間違えて一緒にコミットしちゃった新規ファイルだけコミットを取り消す

2020-12-28

例 を間違えてコミットに含めてしまいました。

js で先頭以外(n行目以降)をソートする

2020-12-17

js で配列の 2 行目以降のみをソートする方法のメモです。 repl: https://repl.it/@anozon/sortbody#index.ts ソート対象の配列 先頭以外をソートする n 行目以降のみソートする Lodash…

java で標準出力を文字列として取得する

2020-11-20

以前書いた、 java で標準出力を一旦オフにする | あのぞんブログ から発展して出力の受け取り方です。 Repl.it - StdOutToStr コード

Next.js export 実行時のタイムスタンプをコンポーネントで使う

2020-11-17

を実行した時のタイムスタンプをレンダリングしたいときの方法です。 jsx 上で などとするとクライアントサイドでレンダリングされた時間が表示されてしまいます。 SSR 時のデータを React で使いたい場合は NextPage…

java で標準出力を一旦オフにする

2020-11-04

java で標準出力を一時的にオフにする方法です。 Repl.it - StdOutToNull コード で “デフォルトの出力” と “何もしない OutputStream” を切り替えています。 snippet Snippet 部分のみコード。

Buffer と float、整数、他エンコードとの相互変換【Javascript】

2020-11-01

JavaScript で Buffer と他の型への変換する方法をまとめました。 数値 → Buffer Buffer → 数値 文字列 ↔ Buffer 他のエンコーディング ↔ Buffer 他の数値型について 変換例 範囲を間違えると別の値になる repl…

vim の visual mode で選択した範囲に paste できないとき

2020-10-30

恐らく visual mode で選択した範囲がコピーされています。 clipboard に が設定されているときの挙動です。 設定

React と display grid でメモリ付き定規

2020-10-30

メモリ付きの定規、ルーラーコンポーネントのサンプルです。 react-memory-component コード ruler-with-memory - CodeSandbox ミソ ブロック部分とメモリ部分を 0.…

ngrok で http リクエストの中身を全部確認する【IoTデバッグ】

2020-10-13

「自前の API にリクエストは届いてるけどなにか不具合が起きている」「リクエストをダンプする環境をすぐに用意するのはダルい」とき用。 ngrok の本来の使い方とは違いますが、http パケットキャプチャができます。 ngrok とは どんな事ができるか ngrok…

js で文字列の先頭のn 行を削除する

2020-10-05

コード 1 を使う方法です。 コード 2 コード 1 でいいですが最初に思いついた正規表現で削る方法です。 動作が早いかわからないですが (渡される n が行数より大きいときに使えません。) 遅かったです。Repl.it - regex-vs-slice

絵文字を含めて文字数カウントするWebアプリ作った

2020-10-02

アプリ 絵文字対応 カウントする関数 エスケープ文字の可視化 アプリ 文字頻度カウント(絵文字対応) emoji-count 絵文字対応 では絵文字が 1 文字として分割できません。 を使います。 bestiejs/punycode.js: A robust Punycode…

Python で Array.find

2020-09-16

配列の中で条件に該当する1つ目を取り出す関数。 なければ None を返す。

Python で TypeScript の UnionType を使う

2020-08-24

TypeScript の UnionType は以下のように定義できます。 Python の type でも同じようなことができるのか調べました。 ちなみに というのがありますが別です。 typeing.Literal を使う ちなみに get_args…

JavaScript で Object の更新はどれが速いのか

2020-08-23

スプレッド構文で書くのが面倒だったので検証しました。 結果 結論としてはクローンが書きやすいし速いので良さそうでした。 コスト 書きやすさ スプレッド構文 221 ms △ スプレッド構文でクローンして代入 195 ms ○ Object.assign…

js の trim で前後の改行のみ取り除く(空白は保持する)

2020-08-17

複数行テキストの trim で行頭の空白を消されたくない時があったので、前後の改行のみ消す方法を紹介します。 方法 コード サンプル Repl.it - trim-only 動作

Python で Systemd や nohup を使っていてログがリアルタイムに出力されないとき

2020-08-16

Python スクリプトでリアルタイムにログが出力されないときの対処法。 -u オプションで起動する -u オプション | 1. コマンドラインと環境 — Python 3.8.5 ドキュメント 端末以外からの実行だとバッファして stdout…

Python で 2つの Iterable をマージしてループする

2020-08-11

巨大なソート済み csv ファイルをソートしながらマージする事があったので。 2 つの Iterable な list をロジカルにループする方法を残しておきます。 コード 1 Repl.it - yield-merge-loop…

Google検索で英語のページのみヒットさせる方法

2020-07-29

日本語設定で Google 検索を使ってると「日本語のページのみ表示する」というオプションがでてくることがあります。 でも逆に英語のページのみヒットさせたいときもあるので手順を紹介します。(意味合いが違う日本語記事ばかりヒットするときがある) 方法 Private Window…

GitHub Profile README に Shields.io Badge並べた

2020-07-28

elzup (elzup) shields.io を使って技術系アイコンを量産した - Qiita を参考に Badge を作りました。 Shields.io の logo 機能 Shields.io: Quality metadata badges for open…

Firebase Project の複製や ID 変更

2020-07-26

やること ソースコードの ID 変更 Firestore のデータ移行 やること プロジェクトの複製には、 移行先プロジェクト作成 ソースコードの ID 変更 移行元を Blaze Plan にする(なってない場合) Firestore…

Markdown でコードブロックの中にバックスラッシュ3つを書く

2020-07-06

Markdown の複数行コードブロックは普通以下のように書きます。 その中にを書くときは を使います。 ※この記事はマークダウンで書いているので更に で囲っています。(コード elzup/anozonbiyori@a7d62e…

Firebase Functions の console.log をまとめる

2020-07-02

Firebase Functions が Node 8 サポートを終了しログの仕様が少し変わりました。 で Object を渡すと 1 行ずつにログが分割されてしまうようになりました。 Console.log calls result in multiple log…

テストで TimeZone を固定する

2020-07-01

日時の文字列をテストに使っているとき GitHub Actions でつまずいたのでメモ。 javascript の Date は自動でローカルのタイムゾーンで文字列化されます。 環境変数 TZ を指定して実行する 他の解決策 その他 環境変数 TZ…

surround.vim 入門【vim中級者向け】

2020-06-16

why demos cs “change surround” ds “delete surround” ys “you surround” virtual select → S 公式リポジトリ https://github.com/tpope/vim-surround why…

Docker 止めずに立ち上げるだけする【tty】

2020-06-09

docker-compose.yml java 実行環境を立ち上げる例。 立ち上げた環境にシェルでアクセスする例。 Docker コマンドの場合 tty: オプション

1つ上のディレクトリ名をとるShellコマンド

2020-05-27

1 つ上のディレクトリ path をとる 現在のディレクトリ path をとる 2 ディレクトリをとる 補足 おまけ: alias 化 1 つ上のディレクトリ path をとる 現在のディレクトリ path をとる…

localhost.{appname}:3000 で開発してブラウザキャッシュを活用する案

2020-05-26

複数のアプリを同じ で開発すると切り替えるたびにキャッシュが競合するので で変える案です。 /etc/hosts フロントエンド開発起動スクリプト例 /etc/hosts フロントエンド開発起動スクリプト例 CRA (Create React App) や Next.js…

React で canvas から画像生成する最小コード

2020-05-25

この記事では React (と TypeScript で) canvas から画像生成する方法を紹介します。 文字描画や色変更をサンプルに説明していきます。 React で Canvas を使うベースのコード 文字色や背景色を変えるサンプル React で Canvas…

Desktopのファイルを一掃する

2020-05-12

や ディレクトリはよく散らかるので、「散らかってきたな〜」と思ったとにバックアップに移動するコマンドをまとめます。 コマンド のファイルを 日付つきディレクトリ(例 )に移動します。

.git/config からリモートリポジトリを変える

2020-05-03

リモートリポジトリ先を変更(やリネーム)した際に .git/config から変える癖がついてしまったので整理もかねて。 git コマンドで URL を変える メリット 無効な設定をしてしまうリスクが少ない 1 コマンドで済む .git/config から メリット remote…

docker-compose.yml に環境変数を渡す

2020-05-01

.env ファイルを使う docker-compose.yml .env ファイルを使う サンプルコード: elzup-sandbox/docker-scratch docker-compose.yml services.shell.environment…

GitHub Pages から別のサイトに移行するときのリダイレクト設定

2020-04-30

概要 gh-pages ブランチをクリーンにする jekyll でリダイレクトする 概要 GitHub Pages から別のホスティングへ移行したとき、 ドメインが変わる場合にすべき設定について。 運用していたページ へのアクセスを 新しい URL…

rel=noopenerをつけないサイトへの攻撃デモ

2020-04-29

この記事では rel=noopener”をつけないとどんなことができるのかをデモで示します。 noopener の攻撃デモ 攻撃サイト側のコード noopener の攻撃デモ リンク: https://tools.anozon.me/noopener noopener…

Excelやスプレッドシートで方眼紙を作る方法

2020-04-29

この記事では Excel やスプレッドシートでの方眼紙の作り方 について紹介します。 Google SpreadSheet で作る Excel の場合 Google SpreadSheet で作る cmd + A: 全選択。 A 列をダブルクリック(A 列解除+A…

Firebase Hosting の URL で .html を省略する設定

2020-04-26

cleanUrls を使う ホスティング動作を構成する  |  Firebase の hostings.cleanUrls を true にすることで実現できます。 拡張子なしの URL で にアクセスできます。 →

useSecounds という時計用 hooks を作った

2020-03-08

という react-hooks ライブラリ を作りました。 elzup/use-seconds: Seconds interval time for React hooks DEMO - CodeSandbox useSecounds の特徴 setInterval…

gitリポジトリごとにデフォルトのコミットメッセージを設定する

2020-03-07

git は でデフォルトのコミットメッセージの設定できます。 例えばこのブログのリポジトリは、記事を書いたとき 📝 をコミットメッセージの先頭に入れています。 毎回入力するのは面倒なので を使って省略してみます。 手順…

© 2021 あのぞんびより All Rights Reserved