Octo's blog
2024-03-10T08:46:24.947Z
https://www.ccbaxy.xyz/blog/
Octo 3.6
Hexo
Fresh 用の Bootstrap 5 プラグインを公開
https://www.ccbaxy.xyz/blog/2024/03/10/js86/
2024-03-10T06:26:13.000Z
2024-03-10T08:46:24.947Z
<p>先日、<a href="http://localhost:4000/blog/2023/12/12/js82/">Fresh(Deno) で Bootstrap 5 をプラグインで使う</a>を書いた。</p>
<p>このプラグインの話を、<a href="https://deno-ja.connpass.com/event/311182/">Denoハンズオン&もくもく会:Fresh + KV</a> へ伺ったときにした。</p>
<p>「Freshは、Preact を使っているゆえに、コンポーネントライブラリの選択肢が少なめ」という話の流れで。<br>Bootstrap 5 をプラグインで導入することはなかったのだけど、比較的印象が良かった(良さそうだった)ので、改めて公開した。</p>
<p>メモがてらまとめ。</p>
Fresh上でBabylon.jsを動かす - Havokを使った物理シミュレーションを非ブラウザ環境で
https://www.ccbaxy.xyz/blog/2024/01/27/js85/
2024-01-26T15:00:00.000Z
2024-03-08T17:03:34.418Z
<p>Babylon.jsを、Freshで動かしたいということを少し前から考えていた。<br>以前トライした時には、Preactとのつなぎ込みをうまくできずに断念した。</p>
<p>しかし、<a href="blog/2023/12/12/js82/">Fresh(Deno) で Bootstrap 5 をプラグインで使う</a>を書き進めていたら、これを転用できると思い至った。</p>
<p>なのでやってみる。</p>
<p>この実装にあたり、DenoコミュニティとBabylon.jsコミュニティにいくつか質問を投げ込ませていただいた。感謝。</p>
<p>実装物はこちら。</p>
<p><a href="https://github.com/Octo8080X/fresh-babylon-physics/tree/main">github - Octo8080X/fresh-babylon-physics</a></p>
<p>最終的には、以下のような画面が完成します。</p>
<p><img src="/blog/2024/01/27/js85/js8501.png"></p>
<p>とりあえず動かしてみたい場合はこちら。</p>
<p><a href="https://fresh-babylon-physics.deno.dev/">fresh-babylon-physics.deno.dev</a></p>
Deno Deployで静的解析できないダイナミックインポートは、できない(が、条件付きで回避できることがある)
https://www.ccbaxy.xyz/blog/2024/01/08/js84/
2024-01-07T17:00:00.000Z
2024-03-08T17:03:19.167Z
<p><a href="https://qiita.com/advent-calendar/2023/deno">Deno Advent Calendar 2023</a> 14 日目の記事です。</p>
<p>最近、<a href="https://lucia-auth.com/">Lucia</a>を使ったFresh用の認証プラグイン「<a href="https://github.com/Octo8080X/plantation">Plantation</a>」を作った。</p>
<p>ダイナミックインポートも使って、デフォルトの使いやすさとユーザーでのカスタマイズ性を頭に入れて実装した。<br>紹介のためにデモサイトをDeno Deployに構築したら、ダイナミックインポートが動かなかった。</p>
<p>調べてみると、現在の仕様の理解と回避方法で対応できたので、まとめておきたい。</p>
Fresh(Deno) の Plugin のテスト自動化する(in github actions)
https://www.ccbaxy.xyz/blog/2024/01/03/js83/
2024-01-03T02:00:00.000Z
2024-03-08T17:07:13.846Z
<p><a href="https://qiita.com/advent-calendar/2023/deno">Deno Advent Calendar 2023</a> 13 日目の記事です。</p>
<p>Fresh のプラグインをいくつか作って公開しているが、公開するからにはちゃんとテストも書きたかった。<br>そして昨今Freshの動きがなかなか激しく、新しいバージョンでも動作するための定期実行するテストも用意したかった。</p>
<p>数件実装して、方法が固まったので書き残したい。同じような需要の人に答えられたらうれしい。</p>
Fresh(Deno) で Bootstrap 5 をプラグインで使う
https://www.ccbaxy.xyz/blog/2023/12/12/js82/
2023-12-12T14:59:59.000Z
2024-03-08T17:07:13.845Z
<p><a href="https://qiita.com/advent-calendar/2023/deno">Deno Advent Calendar 2023</a> 12 日目の記事です。</p>
<p>Fresh 1.6 が公開されて、プラグインで link 要素が設定できるようになりました。<br>このことで、CSS をプラグインで設定できるようになりました。</p>
<p>ここで考えたのが、Bootstrap を Fresh にプラグインで設定できそうだったので試してみました。<br>Bootstrap の中でも js も入れて動くものにを確認したかったので、ツールチップの動作にフォーカス。<br>js も必要な Bootstrap の機能は同じように設定すれば動くでしょう。</p>
Deno で試すデータベースアクセス(Turso - Kysely 編)
https://www.ccbaxy.xyz/blog/2023/10/08/js81/
2023-10-08T02:00:00.000Z
2024-03-08T16:55:18.592Z
<p>Truso の動きが活発。<br>以前は CLI でしか、作ったテーブルを確認できなかったのが、管理画面も増えた。<br>無料枠も激増した。</p>
<p>そんな Turso は、Kysely をサードパーティの開発者ツールとして公式に記載している。<br>ここではクエリビルダーとして記載されているが、マイグレーションや ORM 寄りの機能も持っている。<br>(TypeScript 用のタイプセーフな SQLクエリ ビルダーということで、推論も優秀な様子。)</p>
<p>ということで、Turso(libsql) x Kysely を試してみる。</p>
Fresh 上の island をテストしたい
https://www.ccbaxy.xyz/blog/2023/10/01/js80/
2023-10-01T03:13:00.000Z
2024-03-08T17:20:18.024Z
<p>Fresh の island をテストしたかった。<br>それには preact のテストが必要になる。<br>それもランタイムは、Deno だけで解決したい。</p>
<p>いろいろやって、妥協点が見いだせるようになったので、一旦まとめておきたい。</p>
<p>(2023/10/07追記)<br>コミュニティーで質問投げたら、<a href="https://deno.land/x/fresh_testing_library@0.8.0">fresh_testing_library</a> を使いなよと回答。<br>この記事でいろいろ書いているが、結論これを使うと解決する。</p>
Deno で試すデータベースアクセス(SurrealDB編 - 2)
https://www.ccbaxy.xyz/blog/2023/09/09/js79/
2023-09-09T07:20:00.000Z
2024-03-08T17:28:27.258Z
<p>SurrealDB は、JOIN しないで効率よくデータが取れることを売りにしているところがある。<br>この機能は <a href="https://surrealdb.com/docs/surrealql/datamodel/records">Record Links</a>と紹介されている。<br>が、親から子は非常に取りやすいのだが、子から親の方向に辿ろうとすると、苦しいものだったとわかった。</p>
<p>今回は、もう1つのグラフエッジを作成してデータ連携させる RELATE を試したのでメモしておく。<br>こちらの方が、よほど親->子、子->親も階層が深くても取りやすかった。</p>
Deno で試すデータベースアクセス(SurrealDB編)
https://www.ccbaxy.xyz/blog/2023/09/02/js78/
2023-09-02T14:15:00.000Z
2024-03-08T17:28:19.800Z
<p>先日、X を見ていたらタイムラインに surrealDB が流れてきた。<br>クラウドの受付はまだっポイが、ローカルでインストールして使う分には、いろいろできるらしい。<br>いつも通り Deno で試してみる。</p>
AWS EC2 に Amazon Linux 2023 で Rails を立ち上げる。
https://www.ccbaxy.xyz/blog/2023/08/26/etc9/
2023-08-26T13:00:00.000Z
2024-03-08T16:54:16.945Z
<p>前回、Amazon Linux 2023 の Docker イメージで Rails を立ち上げられた。<br>今回は、改めて AWS EC2 上の Amazon Linux 2023 で Rails を立ち上げる。</p>
Amazon Linux 2023 の Docker イメージで Rails を立ち上げる
https://www.ccbaxy.xyz/blog/2023/08/26/docker11/
2023-08-26T06:30:00.000Z
2024-03-08T17:20:01.678Z
<p>AWS EC2 で Rails を立ち上げる機会があったのだが、Amazon Linux 2023 を使ってみたら、さっとできなかった。<br>(聞き及んではいたが、)Amazon Linux 2 と同じ感覚で触ってはいけないらしい。</p>
<p>Amazon Linux 2023 は、Docker イメージが公式から配布されている。<br>こちらをつかって、とりあえずRails が立ち上がるところまで持っていってみる。</p>
Babylon.js x havok で関節(拘束)を構成する
https://www.ccbaxy.xyz/blog/2023/08/06/js77/
2023-08-06T09:00:00.000Z
2024-03-08T17:03:34.418Z
<p>先日 babylon.js x havok で記事を書いたものの、もう少しやってみたいので関節を組み込んでみる。</p>
Ruby で MQTT(MQTTS) で動かしてみる
https://www.ccbaxy.xyz/blog/2023/07/29/ruby76/
2023-07-29T11:10:00.000Z
2024-03-08T16:43:45.672Z
<p>前回、Deno でMQTT(MQTTS) を試していたら Ruby はどうなのかということが気になった。<br>なので、確認しておく。</p>
Deno で MQTT(MQTTS) を動かしてみる
https://www.ccbaxy.xyz/blog/2023/07/29/js76/
2023-07-29T11:00:00.000Z
2024-03-08T16:59:42.612Z
<p>以前からこのブログでは、MQTTでドアセンサーからの通知を受け取ったりということをしてきた。</p>
<p>Node.js互換や、npm の対応も進んでいるので Deno でもできるんだろうなとぼんやり考えてたので、試してみたい。</p>
Fresh 用につくったミドルウェアを Fresh 1.3.0 のプラグイン形式に対応させる
https://www.ccbaxy.xyz/blog/2023/07/26/js75/
2023-07-26T00:40:00.000Z
2024-03-08T17:07:13.852Z
<p><a href="https://github.com/denoland/fresh/releases/tag/1.3.0">Fresh 1.3.0</a> でプラグインでミドルウェアを適用できるようになった。</p>
<p>これまでも Fresh 用のミドルウェアは作っていたが、これを機にプラグイン対応させたいので確認がてらメモ。</p>
Turso ちょっと勘違いしてたこと
https://www.ccbaxy.xyz/blog/2023/05/03/js74/
2023-05-03T08:00:00.000Z
2024-03-08T17:03:19.166Z
<p>Turso を本格的に Deno Deploy で使っていくために確認をしていたら、いくつか思い違い(ドキュメント全部読め)があったので、まとめておきたい。</p>
<p>速度回りの部分は、少し有用な情報だと信じてる。</p>
Deno で試すデータベースアクセス(Turso - Drizzle ORM 編)
https://www.ccbaxy.xyz/blog/2023/04/08/js73/
2023-04-07T17:00:00.000Z
2024-03-08T17:06:29.080Z
<p>先日 Turso を試した記事を投稿して Twitter で共有したら、Turso の CEO がすこぶる喜んでくれていた。</p>
<p>ORMとマイグレーションツール試したいと書いたら、Drizzle ORM を紹介してくれたのでこちらを試したい。<br>Drizzle ORM を始め上手いこと動かせなかったが、これもまた Drizzle ORM の開発者に助けられた。</p>
<p>できたことをまとめておきたい。</p>
Deno で試すデータベースアクセス(Turso編)
https://www.ccbaxy.xyz/blog/2023/04/04/js72/
2023-04-04T14:59:59.000Z
2024-03-08T16:55:17.629Z
<p>Twitter の タイムラインに流れてきた <a href="https://chiselstrike.com/">Turso</a><br>のクローズドベータに申し込んだのと前後してパブリックベータが公開された。</p>
<p>Turso は、SQLite 使った Edge データベース。<br>近しいものは、Cloudflare D1 という認識をしている。<br>Cloudflare D1 は、Cloudflare worker 向けの方向性が強くちょっと二の足を踏んでいたが、 Turso は、この機能を独立して単独サービスされたものらしい。</p>
<p>いつもの Deno x 何かのデータベースアクセスの確認としてトライしてみたい。</p>
Cloudscape を Fresh(Deno) で動かす
https://www.ccbaxy.xyz/blog/2023/03/05/js71/
2023-03-05T08:00:00.000Z
2024-03-08T17:07:13.853Z
<p><a href="https://www.ccbaxy.xyz/blog/2022/08/19/js59/">packup で スタイルが付いた React コンポーネントを取り扱う</a> で Cloudscape を扱う記事を書いた。</p>
<p>その時はある程度できることをまとめたが、Fresh で動かす方法が分かったので、これもまた纏めてておきたい。</p>
Deno で触る SVG
https://www.ccbaxy.xyz/blog/2023/03/02/js70/
2023-03-01T15:00:00.000Z
2024-03-08T16:48:30.331Z
<p>Deno で <a href="https://github.com/vercel/satori">vercel/satori</a> を動かせるのがざっくり確認していました。</p>
<p>これまで、Deno 周りで SVG を扱う手段についていくつか試みてきた中で、だいたいのユースケース(+α)に使えるものがだいたい固まったのでざっと記しておきたい。</p>