simple-web-system technology

Webに関する技術をシンプルに扱うブログ

reactのstorybookでcomponentに複雑なobjectを渡す必要がある時に楽する方法

例えばこんなinterfaceのデータがある interface Data { property1: string property2: string // ... // 連番で続く // ... property30: string // また別の型とか nest: NestedData; } この内、上から10個だけ欲しいが、全てのプロパティが必要なわけでは…

debtapを使ってArch LinuxでdebianパッケージをインストールしてArch Linuxを最強にする

Arch LinuxはArchの公式リポジトリに加えて、AURまであるのでほとんどの場合ツールのインストールに困りません。 さらにUbuntu等でよく使われるSnapをインストールすると、たいていのGUIアプリもインストールできます。(snapだと日本語入力できないとかあり…

Xephyrを使ってChromebookでもi3 wmを使う

実用性は微妙だけどやってみたらできたので Xephyrとは xserverをネストして起動できるもの window managerのテストとかで使われるらしい ゼファーって読むらしい? 手順 まずxephyrをインストールする sudo apt install xserver-xephyr 次に.xinitrcで環境…

TmuxをVSCodeのTerminalでデフォルトで起動するようにする

TmuxをVSCodeのTerminalでデフォルトで起動するようにする ctrl-p でコマンドパレットを出して、Terminal: Select Default Profile を選択する シェルを選べるのでtmuxを選択 ネットの記事だとterminal.integrated.shell.osxとかで設定する例がよく出てくる…

Flutter(Dart)はprivateを使うと、使わなくなった時にわかる

普段Flutterを書く場合、Widgetのインスタンス変数は、初期化の記述が楽なのでpublicで宣言することが多いと思います。 そのノリで関数とかもpublicに書いてしまうことも多いと思います。 ただ、待ってください。privateにできるものはちゃんとprivateにしま…

gnu sed と bsd sedの違いに苦しむ未来の私へ

大人しくgnu sedをmacに入れるのです 同じsedという名前で使う場合は、置換では置換用の対応、追記には追記用に対応とやることがめっちゃ多いのです。 諦めてさっさとgnu sedをインストールするのです。 もう2回くらいこんなことやってるから、3回目はさす…

nvidiaのグラボ付きノートパソコンにUbuntuをインストールしてnvidiaのドライバーを動かした忘備録

とりあえずgnomeを使う。事故りづらい。 公式ドライバとprime-selectを使う 最初はprime-select intelを使う。prime-select nvidiaを最初から使うと大体事故る。 prime-select nvidiaを使う前にxserverなしで起動できるようにしておく。事故ってからだと遅い…

ArchLinuxでトラックパッドのタップ操作を無効にした

タッチ操作ではなくタップ操作の話 タッチ -> 押し込む タップ -> 触れる カーソルが良く分からないタイミングで急に移動したりしていたけど、うっかりトラックパッドに触れてタップしていたせいだった 修正方法 以下のURLを参考に、xwindowの設定でOption "…

ChromebookのTerminalでwl-copyが動かない

aptからインストールすると古いみたいなので、nixからインストールするといい nix-env -i wl-clipboard nixのインストール方法は以下を参照 https://zenn.dev/suba/articles/7234dd57ec1d29bce18b aptだけだとパッケージが少ないので、nixも入れておくといい…

ChromebookのTerminalからAndroidアプリを起動する話

簡単に言えば、chromebookでのadbデバッグを有効にして、adbを使ってアプリを起動する 1. adbデバッグを有効化する デフォルトだと有効化されていないので以下のURLを参考に有効化する。 また、一度有効化したあとに、無効化すると、Powerwash(PC初期化)が…

VSCodeでbreakpointの全有効化・解除

ある特定の画面まで進めてからbreakpointを有効化したい、みたいな時によく使う デバッガから 右の3つのアイコンのうち、真ん中のアイコンをクリックで全有効化・解除ができる ただし、右の3つのアイコンのうち、左のアイコンをクリックすると、全てのbrea…

VSCodeの選択の便利機能紹介

公式ドキュメントにあるのを紹介するだけですが、意外と知らない方も多いので 選択系に関して紹介します。 なんかいい感じに選択できる方法ないかなと思ったら、ここから公式ページをたどっていただけると幸いです。 注意 筆者はメインがWindows/Linuxのため…

LinuxでCapsLockをCtrlに変更しているのにも関わらず、CapsLockがなぜか有効になったときの直し方

以下のコマンドでなんとかする xdotool key Caps_Lock 結構切実

DartのYamlをMap<String, String>やList<String>に変換する方法

環境 以下のライブラリを使う。(普通これだよね) https://pub.dev/packages/yaml Mapの場合 ライブラリでMapをパースするとMap型ではなくdynamic型が返ってくる。 実態はYamlMap型。 YamlMap型から値を取り出しても値の方が推論されず、使いにくい。 Yaml…

DartのEnumのvalues関数で取得したListは破壊的変更できない

DartのEnumのvalues関数で取得したListはUnmodifiableListなので、remove等の破壊的変更が行えない。 toListで新しくListを作ると破壊的変更ができる。 以下のコード参照 enum ItemType { item1, item2, item3, } final items = ItemType.values; /// -> [it…

複数スマホをもっててsimカードを入れ替える機会が多いときの裏ワザ

スマホケースとスマホの間にゼムクリップ挟んでおくといいよ どうせsimカード入れ替えるときにケース外すし 海外旅行とかで結構役立つ

i3wmでセカンドディスプレイ使うならarandrを使うといいよって話

xrandrは辛い。arandrを使おう gnomeやxfce4等のフルスタックなウィンドウマネージャーでセカンドディスプレイを使う場合、ウィンドウマネージャーに付属するツールを使えば設定できます。ただ、i3wm単体で使う場合は、cliツールのxrandrが使われることが多…

RiverpodでStateNotifierProviderを使うときは、0.14系からの記事を参照しましょう

FlutterのState管理の定番になりつつあるRiverpodですが、0.14系からStateNotifierProviderの呼び出し方が変わったのはご存知でしょうか。 0.14がリリースされたのは2021/04/04なのですが、検索してみると0.13系までの情報がかなり多かったので、整理してみ…

FlutterのDialogを不用意に閉じないようにする

うっかり自分の予想外のタイミングでDialogが閉じることがあるので、 それを防ぐ方法をまとめました。 考慮してない導線だったりして、バグの原因になったりしますからね。 FlutterでDialogを閉じる方法 主に以下の3種類です。 Navigator.of(context).pop()…

会社用のリポジトリだけ、会社用のGithubアカウントを使うようにする

TL;DR githubアカウントを個人用と仕事用で分けたいけど、 id_rsaファイルを切り替えるのとかは面倒くさい 結論: github cliを使う gitのcredential設定で、特定ドメインに対して、認証方法を設定できる。 この認証方法は色々な方法を使えるが、github cliが…

vimでflutterを実行するのが辛かったから、VSCodeから実行した話

表題そのままです。 何が辛かったのか VimでFlutterの開発を行うにあたって以下の2点が辛かったです。 Breakpointを使ってデバッグできない vimのプラグインでflutter runした時に出るバッファが扱いづらい VSCodeで実行しよう 軽さの点とデバッガから考え…

Dartで即時関数を使ってみる(final変数にif文で値を入れたりする)

こんな感じで書ける。 JavaScriptよりも括弧が少ない。 変数宣言時に型をつけた方が間違いが少ないのでおすすめ。 final num = 42; final String message = () { if (num == 42) { return 'this is answer.'; } else { return 'wrong.'; } }(); 即時関数内に…

i3wmでxdotoolを使って、起動時に自動で必要なツールを起動するようにした

i3wmのコマンド自体で自動化できると思ったけど、そんなことなかったので、xdotoolを使った。 xdotool key super+2でworkspace 2に遷移できる。 あとは起動時間を考慮してsleepしつつ&で非同期に起動するだけ。 引っかかったところとして、xdotool key super…

i3wm と xdotoolを組み合わせて、起動時に自動で必要なツールを起動するようにした

i3wmのコマンド自体で自動化できると思ったけど、そんなことなかったので、xdotoolを使った。 xdotool key super+2でworkspace 2に遷移できる。 あとは起動時間を考慮してsleepしつつ&で非同期に起動するだけ。 引っかかったところとして、xdotool key super…

Flutterのstream(bloc)を同期的に待ち受ける方法

結論 streamは非同期的に使うのが主な使い方だが、複数のstreamを扱うにあたって同期的に同期的に値を流したい時もある stream1を処理した後に、stream2を処理みたいな そういう時は、await forを使う Future<int> getStreamInt(stream) async { var result; awai</int>…

環境変数に"\"を入れるとechoしても見えない

状況 Shellのプラグインで Keybindingの設定で環境変数を使う時がたまにある この際、以下のように環境変数を設定する # 例はfish # ただ、他のShellでも同様にバックスペースが要求される set -Ux EXAMPLE_KEY \C-t こうした時にechoで$EXAMPLE_KEYを表示し…

Terminalを録画してanime gifにする方法メモ

[evernote:678e7aa70a7b533d4738cef3e283dbfb Uploading] 結論 asciinemaで録画して、asiicast2gifを使う 色々なツールを使ってみたけどこの組み合わせが一番動作が安定していてよかった インストール homebrewなどのPackageManagerに入っていることも多いの…

VSCodeでTerminalがある下のパネルを開く方法

環境 Macで動作確認しています Windows、Linuxで操作する場合は、CmdをCtrlに置き換えると大体動くはず Panelを表示・非表示にする 下のやつの正式名称はPanelです。 Cmd + Shift + pのコマンド一覧でPanelと打つと、Panel用に用意されているコマンド一覧が…

Riverpodクラス整理メモ

Riverpod関連でクラスや関数が多すぎて訳がわからないので整理してみた。 整理方法 各パッケージのexportから主要なクラスや関数をピックアップした。 riverpod Riverpod本体。Dartだけで動く。 StateNotifierProvider StateProvider FutureProvider StreamP…

Vimの画面管理に関して Windowだけ優遇されてない?BufferとTabの待遇改善を要求する 

ウィスキーで酔ったまま書いた駄文です。 あと、Emacsを使っててVimの画面管理と大体同じことを思うことが結構あったので参考になるかもです。 Vimの画面管理の概要 Vimの画面管理には3つの概念があります Window Buffer Tab このうち、互いに関係している…