Lycolog

皆さんは神戸市と聞くと何を思い浮かべるだろうか？
都会、おしゃれ、洋食、港町、1000万ドルの夜景、六甲山、色々あるだろう。

実は神戸市は農林業や水産業、畜産業も盛んであり割と大抵の食材を手に入れることができる。米は勿論のこと、ゴーヤーやドラゴンフルーツさえ手に入れることが可能だ。水産品としてはわかめや海苔、瀬戸内の魚介類などもあるし、畜産としては牛肉や豚肉だってある。そういう部分もあり、神戸市は食都神戸と名乗っている。

私はここ数年、地産地消に興味があり、つい最近ほぼほぼ神戸市産素材で味噌汁が作れるのではないか？ということに気がついたのだ。

まず神戸市産の味噌、北神みそがあり、これは神戸市産の米と大豆で出来ている。流石に使われている塩は神戸市産ではないが、兵庫県にゆかりのあるものが使用されている。

以下の写真は産直市的なイベントで購入した北神みそだ。イベントで買ったのでパンフレットと謎のチラシが入っていた。

豆腐についても神戸市内の豆腐業者が兵庫県産大豆と神戸の水を使って作っているものがある。この豆腐は兵庫県が認定するひょうご推奨ブランドに指定されている。認定には兵庫県に対するこだわりが多分に求められ、審査基準は結構厳しい。

他の具材についても、わかめ、大根、サツマイモ、しいたけは神戸産があるので、これは作れそうな気がしてくる。
玉ねぎだけは淡路島が近いこともあり、見たことがないのだが、なんとこれもあるらしい。

味噌汁の出汁についてはいりこ、昆布、鰹節は恐らく神戸市産がないのでちりめんじゃこで拵えようと思う。いりこは探せば可能性はゼロではないと思うのだが、漁港の直売所で売られていたものは大分県産のカタクチイワシを神戸市でいりこに加工したものだったので、希望は薄いだろう。

以下の写真はこないだ作った神戸市度の高い味噌汁である。だしの素は使わずにいりこからだしを取って作っているのがこだわりだ。

原材料はいりこ（原産地大分県、加工地神戸市）、味噌（神戸市北区産）、葉付き大根（神戸市西区産）、さつまいも（神戸市西区産）、玉ねぎ（淡路島産）、菌床しいたけ（加古川市産）、わかめ（三重県産）と、結構神戸市産を取り入れられたと思う。そこに外れても県内産、そこを外れても何とか関西地方の品で揃えられた。

実はしいたけも前日まで神戸市北区産があったのだが、味噌汁にすることを忘れて前の夜に焼いて食べてしまい、急遽調達したので市内産が手に入らなかったのだ。それでも一応県産品には拘れたので良かったと思う。わかめについては買いに行ったら売り切れていて入手自体が叶わなかった。

因みに味噌汁を作ったりだしを取るのはこれが二度目であるが、まずまずの出来だった。初めてはこれの二日前にガザミで出汁を取って作ったが、それもまぁまぁよかった。これは二回目の味噌汁なので更に上手くできた。正直上出来といってもいいレベルだ。そんな大変美味しいわけではないが、インスタント味噌汁よりは間違いなく旨いといえる仕上がりだ。

最後に神戸市産の味噌と、豆腐について私が現地で確認した販売所を書いておく。

北神みそ 販売所

兵庫の地豆腐 販売所

神戸市産の野菜が買えるところ

ライフにもあるにはあるが、無難なのは商店街の八百屋に行くことだと思う。ただこれでも取り扱いは限られるので、色んな野菜が欲しい場合に便利なところを紹介する。

一つは先ほど紹介した道の駅 神戸フルーツ・フラワーパーク大沢なのだが、もう一か所ある。

最近ちょいちょい気になっていたのですが、WordPressでGAのURLがURLエンコードされずに生の文字列で出るようになってきています。どうもある時期から切り替わっているようで、URLエンコードされた結果は徐々に減っていて、生の文字列の結果が増えてきています。何故だろう？GAの仕様がある日を境に変わったのかなぁ？

特急はまかぜ大阪行きは姫路駅で長時間停車を行うことがありますが、播但線ホームに停車するため停車したホームには売店がありません。しかし隣のホームには売店が見えます。

何とかして買いたいですが、播但線から出るには中間改札を抜ける必要があります。しかし中間改札を抜けると切符を取られて戻ってこられなくなりそうです。中間改札を出入りして売店を利用することはできないのかと思ったのですが、流石に事故ると怖いし、実験するのも大変なのでJR西日本に聞いてみました。

結論としては停車中に中間改札を往来することは可能ですが、ICカードで自動改札を利用するとエラーになるので駅係員に切符ないしICカードを提示して通行すれば問題ないとのことでした。切符を通した場合にどうなるのかは教えてくれなかったので謎ですが、暇な時に試してみようかとは思います。（不審者に見られそうですが…）大阪市営地下鉄の定期券みたいに出入り自由ならワンチャンある気がします。

勿論、改札通過時に駅員が別に対応をしているなどではまかぜの乗車に間に合わなかった場合は自己責任になるので、ほぼ賭けです。ぶっちゃけほとんどやる意味はないと思います。ただ香澄駅からはまかぜ6号に乗ると駅弁がないんですね。折角の特急なので食べたいじゃないですか。そもそもあの時間に駅弁売ってるかや、在来線ホームでいまだに販売があるのかが謎ですが…ｗ

タイトル通りトップページのレイアウトを変えてみました。

誰が見に来てるのか解らない部分なので変えたところでアレですが…ｗ（トップページはアクセス計測してないので。。。）

PCビュー

変更前は縦長のレイアウトだったのですが、もうちょっと余白を活かした方がいいかなと思い、横にもレイアウトしてみました。デザインセンスが皆無なのでなんか余計に微妙になった気もしますが…。

他にも表組だった場所を段落にしたり、Sponsoredのバナーを縦置きにしたり細々と変えてます。

変更前	変更後

SPビュー

経験技術のところは見やすさがマシになったと思います。余白が詰まって少し息苦しくなった気もします。

PCビューが縦長だったのはレスポンシブ対応をサボる為というのもあったので、今回はそこそこ真面目にやりました。結果、まぁまぁちゃんとレスポンシブになっているとは思います。まぁ、一応本業なので…。ブレークポイント周りの挙動は怪しい気もしてますが…（

変更前	変更後

あとがき

半ば何のためにあるかわからないトップページですが、素のHTMLを書く機会が少ないので、それを書くためだけにある節があります。それもあってJSは入れず、HTMLとCSSだけで書いてます。

一応自分なりにセマンティクスには拘って書いているつもりですが、概ね自己満足レベルな気はしています。Lighthouseの数値は悪くない気がするので、無難なところかなという気はしていますが…。

Lighthouseの結果は取り合えずぼちぼちな気はする。

まぁまた気が向いたときにいじろうと思います。この新レイアウトも8月頭に着想して原型を作って、中途半端な状態で今日まで放置してたのを直して何とか形にしたくらいなので…。

こんなんでもやってるとMedia Queries Level 4という新機能を知れたり、HTMLやCSSを書く能力が多少は鍛えられるので悪くないです。

MDNによるとMedia Queries Level 4の対応状況は「それなり」ということですが、今回使用したMedia Queries: Range Syntaxは、どのブラウザも対応してくれてそうで良かったです。MDNでも全てのブラウザがFull supportとあるので安心です。

ESM化が叫ばれて久しいですが、未だにJestはESMとCJSが混在したコードを処理してくれません。

Getting StartedにもSWCに対する言及がないので、きっともう忘れられているのでしょう。swc-project/jestの方も特にやる気はなさそうだし、やりたければ自分でPR書きましょうって感じだと思います。きっと。

確認環境

node_modules配下にESMで作られたモジュールが存在し、コードはTypeScript、トランスパイルにはSWCを利用する。

やったけど意味がなかったこと

• package.jsonのtypeをmoduleにする
• jest.config.jsのtransformIgnorePatternsにESMモジュールのパスだけ除外する設定を書く
• 上記に加えてtransform.jsc.pathにpkg-name: ['node_modules/pkg-name']を追記する
• node --experimental-vm-modules node_modules/jest/bin/jest.jsで実行する
  • 多少マシになったがコケるものはコケる
• ESMで書かれたモジュールを丸ごとモックする
  • 一切効果なし

所感

多分Webpackでバンドルしてnode_modulesの中身も外も関係ない状態にするのが一番無難なのではないかと思いました。

Node.jsの組み込みテストランナーにすれば解決するかな？と思ったものの、こちらは現状SWCでは使えそうにないので諦めました。
参考までに以下のコマンドで走らさせられます。

node --require @swc/register --test ./src/**/*.spec.ts

取り敢えずESMに引っかったモジュールはCJS時のバージョンを維持しておくことにしましたが、このままだとSWC使えないし、なんとかなって欲しいですね。Webpack使えば解決できるのはわかるんですが、このために使いたくないので、テストを重視する場合、Vitestを持つViteが有力候補になって来そうです。

2024-02-17追記

esbuild + Node.js built-in test runnerの組み合わせであればテストはできるが肝心の実行ができず無意味だった