tailwindのconfigで定義したprimaryの色とかをtailwindのクラス以外で使用したい。 import type { Config } from "tailwindcss"; export const customColors = { primary: "#2563eb", secondary: "#4b5563", danger: "#cd2626", success: "#16a34a", warning: "#f59e0b", }; const config: Config = { theme: { extend: { colors: customColors, }, }, plugins: [], }; export default config; みたいにすればいい。
会社のPCを新しくしてもらった。 本当はSurfaceが良かったのだが、贅沢は言えない。 それにSurfaceだけど、チップがArmベースに移行したということで、ちょっと口コミが良くない。 個人で買うつもりだったけど、すこし迷いが生じている。 ともかく会社のPCが新しくなった。 で、そうすると移行作業が生じるのだが、非常に楽になっていた。 今回、とにかく移行したいのはWindowsにインストールしたアプリとvscodeの拡張機能の2つ。 Windowsにインストールしたアプリを以降 wingetを使用したら、何とも簡単に移行できた。 WingetでWindowsにアプリをインストールする これのインストール情報をエクスポートするを実行すれば何の問題もなく移行できる。 vscodeの移行 こちらはプロファイルを使用する。 vscode右下の歯車アイコンをクリックし、プロファイル（規定）をクリック、最後にプロファイルをエクスポートを選択し、エクスポートする。 次にそれをインポートすれば、移行が完了する。 新しいPCを迎え入れるストレスが減った。
レベルが低かろうと技術ブログという矜持を持つ 最終更新日を付与したい。 というのも技術ブログにおいて更新日はとても大きな意味を持つ。 ちゃんと更新されている記事であれば、たとえ公開日が古かろうと問題ない。 ということで、このブログにも更新日を付与することにした。 HogoのテーマであるPagermodのカスタマイズ 当然、サブモジュールとしてインストールしたファイルをカスタマイズすると、本家の更新時に上書きされる。 これはみんな大好きwordpressと同様。 wordpressで子テーマを作るのと同様に、Hugoではサイト名\layouts\partials\というフォルダを用意して、そこにカスタマイズしたいファイルを持ってくる。 更新日を付与する 今回であれば、post_meta.htmlに投稿日の記述等があったので、このファイルをカスタマイズする。 そのため\layouts\partials\post_meta.htmlを作成し、 {{- if not .Date.IsZero -}} {{- $scratch.Add "meta" (slice (printf "<span title="%s" >%s</span >" (.Date) (.Date | time.Format (default "January 2, 2006" site.Params.DateFormat)))) }} {{- end }} という元記述を {{- if not .Date.IsZero -}} {{- $scratch.Add "meta" (slice "投稿日" (.Date.Format (default "2006-01-02" .Site.Params.DateFormat)) "更新日" (.Lastmod.Format (default "2006-01-02"))) }} {{- end }} に変更した。ついでに日本語にした。 最後にhugo.yamlにenableGitInfo: trueを付与する。 この設定はbuild時に読み込まれるので、ローカルで開発している場合は一度サーバーを止め、再度buildしなおせば更新日が付与されていることが確認できる。 実際に付与されている例 ↓ nextjsで開発中にモックサーバーを立ち上げたいのでnext-swagger-docと@stoplight/prism-cliを比較してみた
ネイティブアプリを諦めた さかのぼることはるか昔、まだ子どもが妻のおなかにいる頃。 要は1年9か月前にネイティブアプリの作成を思いついた。 それから幾星霜、まだネイティブアプリは完成していないし、モチベーションはすっかり下火になっている。 技術スタックを欲張った 理由はバックエンドにある。 というより、技術スタックを欲張ったことにある。 というのも今までは慣れた言語に1つ新しい言語を取り入れることで個人開発をしてきた。 Nuxt + firestore Next + firestore Next + Nest + aws といった具合に行ってきたのだが、今回は「React Native + Go + GCP」というすべて初めての言語で臨むことにした。 わからないストレスをずっと感じつつプログラミングを進めていった結果、すべてそれなりの形にすることに成功した。 GCPにかかる料金で心が折れた じゃあ、結合しようという時点で、GCPにかかる料金を知り仰天し、心が折れた。 Go & Cloud Run & Cloud SQLでWebAPIを作成したけど、公開する前に諦めた GCPは無理だと知った時、もうモチベーションを保つことができなくなった。 すらすら書けないストレス コードを書く時に、すらすら書ける言語と調べつつ書く言語だと心理的ストレスが全然違う。 今は全ての言語が初めてで調べつつ書いているので、辛い。 すらすらコードを書きとりあえず、モチベーションを上げ、最終的にネイティブアプリを完成させたい。 ただでは起きない という理由があり、すらすら書けるWeb版の作成に着手しようと思い立った。 ただそれだけだとつまらないので、今回はテストコードも書いてみうと思う。 テストコードの勉強をしたいと思っていたのでちょうどいい。 そして、最終的にネィティブアプリを作成するので、その時の労力を減らすためにここでAPIを作成しちゃおうと思う。 決してただでは起きないように頑張る。 やること じゃあ何をするのか。 Nextでフロントエンドを実装する バックエンドはSupabaseを使ってみる。 app/apiでSupabaseをAPIにラップする テストコードをしっかり実装してみる という風にしようと思う。 それでPWAにしようかなあ。 その後ネイティブアプリ化するっていう目標。
new Set()ってなに？ 先日ChatGPTでコード生成したところ、new Set()というオブジェクトが登場した。 そういえば使ったことあると思い調べてみると、JavaScriptの配列で重複したものを削除し、ユニークな配列を作成するで使っていた。どうやら配列を削除するのに使っていたよう。 実際に調べてみると、 Set オブジェクトは値のコレクションです。 Set に重複する値は格納出来ません。 Set 内の値はコレクション内で一意になります。 とのこと。 簡単に言うと「要素の重複を許可しない配列のこと」だと思う。 じゃあ、配列と何が違うのか。 配列と何が違うのか 配列との違いは、 重複を許さない インデックスでアクセスできない あとは追加とか削除とかのメソッドが異なる 高次関数（map, filter, reduce）を使用できない という点。 重複を許さない const setValue = new Set([1, 2, 3, 4, 5, 6, 1, 2, 3, 4, 5, 6]); console.log(setValue); // [LOG]: Set (6) {1, 2, 3, 4, 5, 6} このように重複した値はなかったことになる。 インデックスでアクセスできない const setValue = new Set([1, 2, 3, 4, 5, 6, 1, 2, 3, 4, 5, 6]); console....