Tips– tag –

Chakra UIのカスタムテーマ、使っていますか？ カスタムテーマは便利で汎用的なスタイルを定義することができますが、その反面で意外と奥が深くやろうとしていることに時間がかかってしまうこともあります。 今回はカスタムテーマをもっと使いこなすために...

今回はRustで標準入力する方法について紹介します。 この記事でわかること Rustでの標準入力方法 標準入力した文字列のパース 【単純な実装】 さっそく実装です。 標準入力は標準ライブラリstdにて実装されており特別なクレートは必要ありません。 単純に...

Rustのパッケージの構成ルールについて公式ドキュメントに記載がありますが、あり得る構成パターンの具体的な作成方法については記載がありません。 そこで今回はタイトルのとおり、単一/複数のクレートを持ったパッケージを作成する方法について試してま...

今回はTauriでファイル操作処理を行う方法について紹介していきます。 合わせてよく使用するであろうファイル選択ダイアログの実装もしてみました。 Next.jsのみで作るWebアプリケーションの場合はファイルダウンロード処理を実装する感じになりますが、Ta...

Google Chrome拡張機能(Chrome Extension)のContent Scriptなどを使用すると、既存ページに対して新たなDOM要素を追加することができます。 しかし追加したDOMが既存サイトのCSSから影響を受けたり、また逆に追加したDOMが既存サイトのCSSを上書きしたりと...

blurを使用してぼかし効果で消えたり現れたりするコンポーネントのサンプルを作りました。 【使用ライブラリ】 使用したライブラリはFramer Motionというアニメーションライブラリです。 参考リンク Framer MotionはChakra UIをインストールすると依存パッ...

TypeScriptでちょっとしたときに使う・使った型定義をまとめていきます。（随時更新） オブジェクトの値を型として定義する 型定義 export type RecursiveValueOf<T extends object> = { [K in keyof T]: T[K] extends unknown[] ? T[K] : T[K] exte...

ブログなどで見るステップデザイン。 見やすくて便利で使いやすいので本サイトでも頻繁に使用しています。 今回はそれをChakra UIで実現してみたTips記事となります。 【完成形】 以下のようなステップコンポーネントを作成します。 【実装】 以下のように...

今回はGitHub Actionsにてユニットテスト（Jest）を実行させるように設定します。 ただそれだけです。 この記事でできること GitHub ActionsでNode.jsの環境を構築するGitHub Actionsでユニットテスト（Jest）を実行する 【対象環境】 Jestのセットアップ...

「Githubを作ったはいいけど、登録したメールアドレスとか全世界に公開されたりしない？」というように不安がある方へ。 まずは本記事で紹介することだけでも設定しておけば不用意にメールアドレスを公開することなくGithubやGitを使用することができます...