ハンズオン用の記事です。随時修正・アップデートされます。 対象レベルは「少々JavaScriptが書ける」初心者向けです。中級編はこちら 色々端折るために拡張機能をインストールします。Next.jsなどに親しんでフロントエンドをバリバリやっている方には冗長な説明が多いと思います。上級者は公式ドキュメントを全部読み込むことをおすすめします。 Freshの特徴 Freshはシンプルさと速度、信頼性に重点を置いたDeno用のWebフレームワークです。 特徴としては「サーバサイドレンダリング」を基礎に下記の特徴を備えています。 必要がない限りゼロJavaScript 基本的にすべてTypeScript ビルドステップなし（条件あり） この結果、型の恩恵を受けながら、極力軽量な構成でWebアプリケーションを作ることができます。 ゼロJavaScript FreshはIsland architectu

Denoで画像を生成する記事に感化されましたが、画像さえ作れれば動画も作れます。連番で出力してffmpegでmp4にしてしまえばよいです。 素材として３枚の画像を用意しました（遊びに好きに使ってください）。 まずは、最小限の画像を生成するコードを書きます。 // main.tsx import { ImageResponse } from "https://deno.land/x/og_edge@0.0.6/mod.ts"; async function imageToBase64(image: string) { const data = await Deno.readFile(image); const base64 = btoa(String.fromCharCode(...data)); const mimeType = image.split(".").pop(); return

Deno Advent Calendar 2022の16日目の記事です！ Denoでこんな感じのコードを書いていました。内容的には大量（2000個以上）のSVGファイルをゴリゴリとTSXファイルに変換していくなんてことをやっています。 変換部分の本体はsvgrというライブラリを使っています。内容的にはよくわかっていませんが、babelでパースしてastでどうのみたいな感じのようです。 SVGファイルをバッチ的にTSXに変換していくんですが、最後に deno fmt は手作業でかけなければならずそれが微妙でした。ここはDeno.Commandの出番かな〜とも思ったんですが、前から作者に激推しされていたdaxを使うことにしてみました。 利用方法 というわけでdaxをimportしてきます。

Deno Advent Calendar 2022の7日目の記事です！ 画像のリサイズや変換面倒ですね。PhotoShopのようなレタッチツールを使う方、ImageMagickのようなCLIツールを使う方、シェルスクリプトやバッチファイルまで用意されてる方、色々いるのではないでしょうか。ちなみに個人的にはSquooshやClip Studio Paintなどでやってしまうことが多いです。 このあたり、Denoで置き換えると便利ではないだろうか、と考えました。 メリットはこういったものがありそうです。 高いポータビリティ 何ステップにも渡る複雑な変換処理をTypeScriptで綺麗に書ける Deno.watchFsを使った監視＆自動処理 deno compileを使ったexe化と、ドラッグアンドドロップによる簡単な変換アプリの作成 というわけで、今回はDenoでどこまで画像系のタスクを行える

で…できらぁ！！！ Deno Advent Calendar 5日目です。簡単なデスクトップペイントツールをDenoで作りました。 Denoは基本CUIツールやWebサービスを作るものと考えて差し支えないです。普通GUIはつくらないですね。その点はNode.jsだって同じなんですけど、とは言えみんなElectronアプリは使ってますよね。VSCode, Slackアプリ, Discordアプリ, Docker Desktopなどなど…。Electronアプリには個人的には思うところが山ほどありますがここでは省略します。まあとにかく、Denoでも画面を作りたい人はいます！ここに！ DenoでもElectronと同様にwebviewを使えるライブラリがあります。 使い方 使い方は簡単で、このスクリプトを deno run --unstable -A main.ts で実行するだけです。 imp