スタイルを設定できる部分がコンポーネントによってらしい。Collapse は padding と背景色が変えられるようなので試してみた。 ConfigProvider の theme で設定する。 import React from &qu
PCやスマホなど、興味があった事を綴っています。
おじさんソフトウエアエンジニアです。 仕事は Windows、私用は Mac を主に使っています。
|
https://twitter.com/kumaemoncom |
---|
2024年7月
Ant Design:Collapse のヘッダーとコンテンツの padding と背景色を変更する
スタイルを設定できる部分がコンポーネントによってらしい。Collapse は padding と背景色が変えられるようなので試してみた。 ConfigProvider の theme で設定する。 import React from &qu
react-markdown と remark-gfm を使ったコンポーネントのテストコードを jest で実行する設定のメモです。要点を挙げるなら、 JSDOM で未実装のメソッドはモックを用意しておく transformIgnorePa
2024年7月
「ブログリーダー」を活用して、熊右衛門さんをフォローしませんか?
スタイルを設定できる部分がコンポーネントによってらしい。Collapse は padding と背景色が変えられるようなので試してみた。 ConfigProvider の theme で設定する。 import React from &qu
react-markdown と remark-gfm を使ったコンポーネントのテストコードを jest で実行する設定のメモです。要点を挙げるなら、 JSDOM で未実装のメソッドはモックを用意しておく transformIgnorePa
以前やった URL.createObjectURL で良いと思いますが、直接作っちゃっても行けたのでメモ。 <!DOCTYPE html> <html lang="ja"> <head&gt
マークダウンの表示に react-markdown と remark-gfm を使った際、tailwind css が影響してスタイルされなかったときの対処です。 ・使用したマークダウン (remark-gfm のリポジトリから) # GF
Next.js で Ant Design を使った際に、TextArea にフォーカスを移すためのメモです。 環境 Next.js v14.2.3 Ant Design v5.18.0 作例 以下のように、カーソルの位置を指定できます。 先
以下の様に、テキストファイルの内容の取り出しを import で済ませたい場合です。極端に大きなファイルで無ければ、起動時間に与える影響は少ないと思います。 Hello, world. This is an example text fil
こんな感じで開いて行った後、まとめて閉じるときの操作です。 ⌘ + A で全選択 ⌘ + ← で選択対象が閉じます。 逆に、開きたいときは ⌘ + → です。
以前 React で書いたものの Next.js の場合になります。Next.js は API Routes を通すこともできますが、バックエンドを単純に呼びたいだけなら rewrites が便利です。 設定方法 next.config.m
String.prototype.trim() は対象が空白文字ですが、他の文字を指定したかったときのサンプルです。 /** * 文字列の先頭と末尾から指定した文字を削除 * @param {string} str - 対象の文字列 * @
長野市ごみ収集日の CSV ファイルを公開していますが、使うには少しハードルがありますよね。カレンダーの共有リンクで自分のカレンダーに反映できたら楽だろうなと思っていたのですが、40 以上のカレンダーを手動で作って公開までする気にはならず、
DevTools でコマンドを実行して取得していましたが、ショートカットが割り当てられることを知ったので設定しました。 DevTools を開き、歯車アイコンをクリック サイドメニューの「ショートカット」を選び、「フルサイズのスクリーンショ
例えばシェルスクリプトが test.sh で環境変数 TEST_ENV を設定していたとき、test.sh の実行が終わると環境変数 TEST_ENV は消えている。実行後も残したい場合は、. test.shまたはsource test.s
仮想環境(venv)で明示的にインストールしたパッケージの一覧を取得したく、pip freeze を使ったのですが、依存でインストールされたパッケージまで含まれているもので欲しい一覧になりませんでした。 調べた所、pip-chill パッケ
ワークスペースのフォルダ直下に .env ファイルを作成して環境変数を設定するメモ。 プロキシ環境下かつルート証明書の設定を定義した例。プロキシの設定 http_proxy, https_proxy が無いと外部に繋がらない。→ プロキシの
2024年度(令和6年度)長野市のゴミ収集日を Google カレンダーに表示させる為の CSV ファイルを作成しました。 Google カレンダーに CSV ファイルを読み込ませる方法はこちらを参照ください。 地区別 CSV ファイル 長
@pytest.fixture デコレータで前処理/後処理が書けるので、テストで共通するログイン処理を前処理として作成した例です。 import requests import pytest @pytest.fixture def logi
日本取引所グループで公開されていた"構成銘柄別ウエイト一覧(1月末現在)"に、配当利回りの列を付与してみました。 銘柄コードの終わりが ".0" だったので、".T" に置換。それ
関数をモックに差し替えるけど、引数の値によっては元々の関数で処理したい、という場合のメモです。 まずは、モックに差し替える関数の例。 def myfunc(cond): return f"original: {cond}&quot
自分が調べた限り、現時点では以下の拡張機能をインストール、設定すれば良さそうに感じました。 Black Formatter Flake8 isort 設定は以下で初めようと思います。まずは black と flask8 で1行の長さの初期値
長い文字列、例えば「心地よい陽光、爽やかな風、穏やかな心。自然と笑顔が溢れ、幸せが全身を包みます。感謝と平和の日。」を変数に代入するとき、複数行で書く際の例です。 バックスラッシュを使う value = "心地よい陽光、爽やかな風
コードは Mac のシェル(zsh)から実行しています。 $?: 直前に実行されたコマンドの終了コード % date 2023年 12月16日 土曜日 15時36分19秒 JST % echo $? 0 $$: 現在のシェルプロセスのプロセ
JavaScript のスプレッド演算子の様なことをしたかったので調べました。 dict1 = {'a': 1, 'b': 2} dict2 = {'c': 3, 'd&
スタックトレースを出力するには exc_info を True にするが、毎回引数に指定はしたくない。そんなときの対応方法のメモです。 スタックトレースが欲しいのは error と critical かと思いますが、その辺りはお好みで。fu
Python の logger モジュールでは、getLogger関数を使用してロガーを取得しますが、getLogger に未定義の名前を渡した場合、その名前のロガーが新しく作成されます。新しいロガーを作成したときは設定を行いたいことがあっ
copy.deepcopy を使えば良い。 import copy import json value = { "name": "Yamada", "gender": "
用途によってはクラスを作るより contextmanager の方がスッキリ書けると知ったのでメモです。例えば、リソースを使う際に "開く/閉じる" や "接続/切断"、"確保/解放&quo
ということで、付けると引数の値を出力するデコレータのコードを例として書き留めておきます。 from functools import wraps def print_params(func): @wraps(func) def wrappe
いわゆる format ですが、何パターンか見かけたのでメモです。場面によりますが、個人的には最後の書き方をすることが最近は多いです。 first_name = 'Taroh' last_name = 'Yam
デバックで要求を console.log 出力させてみたときのメモです。個々の URL で処理するのでは無く、一箇所で対応します。 import express from 'express'; const app = e
素の table タグに設定しているのと変わらないので、他にも流用できると思います。v-table は props に先頭行・末尾行を固定にする設定(fixed-header、fixed-footer)があるので、それで十分なら props
Vuetify 2 は props にありましたが、3 には無いので css で変更します。対象のコンポーネントでのみ透明度を変更する場合の例です。 <template> <slot /> <v-overlay
今回もインストールできるUSBも作成しました。以下の画面が表示されずにアップデートが済んでしまったので、再度ダウロードしました。 USBメモリをマウントして、ターミナルから次のコマンドを実行すると、インストーラのUSB起動ディスクが作成でき
GUIから実行できるので、コマンド入力が減りました。使用頻度の高いもののメモです。環境VSCodev1.82.2Docker機能拡張v1.26.1DockerイメージのビルドDockerファイルの右クリックメニューから「BuildImage
以前に自前で算出しましたが、便利なライブラリがあったのでメモです。日付に関する多くの機能があるので、自作する機会は無くなるのかもしれません。日数の加算・減算import{add,sub}from'date-fns';co
create-next-app@13.4.19で初期コードを生成後、実現したいフックを書いてみました。保存のショートカットキーで、指定した処理を実行するフックMacならCommand+S、MacでなければCTRL+Sで指定した処理を実行しま
ある日付の数日前、数日後といった日付を得たいことがあったので、そのメモです。日数の加算・減算getDateの結果に加算・減算して、setDateします。//明日varcurrentDate=newDate();currentDate.set
以前紹介したChrome機能拡張のSafari版が出たのでインストールしてみました。Y!NewsExcluderforSafarimacOSとiOSのどちらもAppStoreからインストールできます。macOS用インストール後、設定画面を開
拡張機能のMarkdownPDFでできます。日本語の説明も用意されています。VSCodeでMarkdownファイルを開いて、右クリックメニューの「MarkdownPDF:Export(pdf)」を選択すればOKです。
Apple Watch のバンドをレザーバンドに変えました。土屋鞄製造所のレザーウォッチバンド画像:土屋鞄製造所のサイトから購入したレザーウォッチバンドAppleWatch用(オイルヌメ革)は、職人さんによる手作りで販売本数に限りがあるそう
受け取る際のメモです。ボディで渡すパラメータは JSON 形式を想定します。環境express:4.18.2typescript:5.1.6例express 側のコードimport express from 'express&#0