Hello, my name is Ryo Sano. I'm a huge fan of HTML, CSS, and JavaScript (TypeScript), and I absolutely love the web.

While I can handle backend development, I have a strong preference for frontend development.

こんにちは、私は さのりょう といいます。私は HTML, CSS, JavaScript(TypeScript)の大ファンであり、ウェブがとても好きです。

バックエンドもできますが、フロントエンドがとても好きです。

My favorite framework is undoubtedly Svelte!
I’ve been supporting Svelte for about three years (I think) through donations. Svelte, with its minimal code, expressive syntax, and intuitive, simple API, is unmatched among frontend frameworks.

I know the APIs of React and Vue, but I feel Svelte is the best fit for me.

• React
  It’s inconvenient that you can’t write CSS inside components (though Tailwind solves this issue, I’m not a fan of Tailwind).

• Next.js
  Frequent major updates make it less appealing for me.

• Vue
  Overstuffing information in attributes makes the code harder to read in my opinion. Also, Nuxt, Vue’s web framework, doesn’t provide free official tutorials, so I wasn’t motivated to learn it.

As a result, most of the websites I build are created with SvelteKit.
Whether for websites or web apps, I find it the best choice.

• Simple API
  Since it’s managed by the same team as Svelte, it’s incredibly straightforward.

• Performance Optimization
  It supports SSR, CSR, pre-rendering, and other features that make performance optimization simple.

• Routing
  Unlike Remix's directory-based routing, it doesn’t have strange rules.

私が好きなフレームワークはなんといっても Svelte！
私は Svelte をもう（たしか）3 年ほど寄付を通して支援しています。Svelte は最小限のコードと表現力豊かな記述で、直感的でシンプルな API をどのフロントエンドフレームワークよりも追求していると思います。

React や Vue も API は知っていますが、Svelte が最も私と相性がよいと感じました。

React はコンポーネント内に CSS を記述できない面倒さがあります（Tailwindを使えば解決する場合がありますが、私はTailwind を好みません）。Next.js はメジャーアップデートばかりするためあまり信用していません。

Vue.js は属性に情報を詰め込みすぎるあまり、個人的に読みづらいコードになると思います。また、Vue の Web フレームである Nuxt は無料の公式チュートリアルを公開していないため、学ぶ気になりませんでした。

そのため、ほとんどの Web サイトは SvelteKit で作られています。 SvelteKit はシンプルで分かりやすいドキュメント、美しい API とシンプルな構文、Remix のような複雑怪奇なディレクトリベースのルーティングがないことが非常に好印象です。また、Svelte グループが管理しているため、Svelte と緊密な統合を行えていることが愛用する所以です。

I’m also a huge fan of web components.

Though they have some usability drawbacks, they’re based on web standards and can be used anywhere, which is incredibly appealing.

Lit is my favorite library. Its simple yet powerful API is outstanding.

私はウェブコンポーネントの大ファンでもあります。

使い勝手が悪い面もありますが、ウェブ標準であり、あらゆる場所で使えることがとっても魅力的です。

Lit は私の最もお気に入りのライブラリであり、シンプルで強力な API が素晴らしいです。

link-generator is a package that leverages TypeScript’s string literal type inference to safely generate paths in a fully type-safe way.

• Speed: Extremely fast
• Compatibility: Works in both frontend and backend environments

This helps easily prevent broken links in web apps and websites!
I truly love TypeScript...

link-generator は、TypeScript の文字列リテラル型の型推論を利用して、完全に型安全にパスを生成するモジュールを提供するパッケージです。

• 生成速度: 超高速
• 互換性: フロントエンド・バックエンド問わず動作

これにより、ウェブアプリやウェブサイトでリンク切れすることを簡単に防ぐことができます！
私は TypeScript をこよなく愛しています・・・。

Koa.js avoids the callback hell often encountered with Express. It’s very user-friendly, minimalistic, and provides sufficient APIs. The fact that its documentation is only one page made it quick to understand.

Koa.js は Express のようなコールバック地獄に陥らない点がとても使いやすく、最小限でありながら十分な API を提供しています。さらに、ドキュメントが1ページであったため、理解に時間がかかりませんでした。

I’m a big fan of Firebase.

• Authentication: Firebase Authentication is the easiest to use.
• Database: Firestore is the most user-friendly database.

I can work with SQL, but I find managing foreign keys for consistency quite challenging. When using SQL databases, many opt for Prisma, but I feel its level of abstraction is too high. Firestore’s API, which allows easier project-specific abstraction, feels just right for me.

私は Firebase の大ファンです。

• 認証: Firebase Authentication が一番使いやすい。
• データベース: Firestore が一番使いやすい。

SQL も理解できなくはありませんが、一貫性を保つために外部キーの管理が大変すぎる印象があります。SQL データベースを利用する際に Prisma を使用するケースが多いとは思いますが、抽象化があまりにも高レベル過ぎる気がします。

Firestore のように、プロジェクトごとに抽象化しやすいレベルの API が丁度良いと感じます。