Conform / 概要
概要Conform は、Web 標準に基づいて HTML フォームを段階的に強化し、 Remix や Next.js のようなサーバーフレームワークを完全にサポートする、型安全なフォームバリデーションライブラリです。 #特徴プログレッシブエンハンスメント・ファーストな API型安全なフィールド推論きめ細やかなサブスクリプション組み込みのアクセシビリティ・ヘルパーZod による自動型強制#The GistConformは、クライアントからサーバーへのフォーム送信のライフサイクルを制御し、useForm() フックを通じてフォームの状態を提供します。フォームのマークアップを制限せず、有効なHTMLフォームであればどのようなものでも動作します。フォームの値は、FormData Web APIを使用してDOMから取得され、イベント委譲によって同期されます。 1import { useForm }
全モダンブラウザで使えるJavaScriptのdynamic import（動的読み込み） - Qiita
JavaScriptでは他のJSファイルを読み込みES Modulesという仕組みがあり、Chrome、Edge、Safariなどブラウザのサポートが拡大しつつあります（参考記事「JavaScriptでモジュールを使う時代に！ ブラウザで覚えるES Modules入門」）。 さらに、モジュールをimport()を使って「関数のように」呼び出すためのdynamic importという仕組みが2020年に公開されるECMAScriptの仕様で導入されます（tc39/proposal-dynamic-import）。Google Chrome、Firefox、Safariではではモジュールのdynamic importに対応しており、ブラウザでその挙動を確認できます。 dynamic importのメリットは、任意のタイミングでモジュールを読み込めること。たとえば、ページの初期表示に必要なJav
Environments · Cloudflare Workers docs
Wrangler allows you to use environments to create different configurations for the same Worker application. Environments are configured in the Worker's Wrangler configuration file. There is a default (top-level) environment and you can create named environments that provide environment-specific configuration. Review the following environments flow: Create a Worker, named my-worker for example. Cre
Cloudflare Workersの環境設定
Cloudflare Workersで環境設定を行う場合、いくつかやりかたがありますが、その内の1つを紹介します。 wrangler.tomlの設定 ステージとして、dev stg prd を用意してみました。 [dev.*]毎に環境に依存したwrangler.tomlの設定と、[dev.*.vars]で環境設定が出来ます。 compatibility_date = "2023-01-01" [env.dev] name = "my-app-dev" [env.dev.vars] API_URL = "http://localhost:8080/rest/v1" API_KEY = "..." [env.stg] name = "my-app-stg" [env.stg.vars] API_URL = "http://stg.example.com/rest/v1" API_KEY = "
Remix on CloudflarePages + Prisma + Supabase で銀の弾丸を目指す 20240828
自分が思う最強の(かつ貧者の)構成を目指したログ。流行りの技術選定ってやつしたかった。 結論だけ言うと、まだ綺麗ではないが現実的に動く。動かし方を理解してないと事故る、かも。 この記事は自分がたどり着いた結論を順を追って記述するが、自分にとって自明な場所の差分を記録してないので、コードをなぞるより変更意図を追って各々自分で組み立てる、ということを推奨する。 動いてるリポジトリはここ。ただこの記事の説明を読まないと、その意図が伝わらない。 追記 20240829: DATABASE_URL で Connection Pool を有効にするのに ?pgbouncer=true を追加 https://supabase.com/partners/integrations/prisma このスタックの意図 Remix on cloudflare-pages コストとパフォーマンスを両立できる、20
[キャッチアップ] Prisma + supabase DB におけるコネクション管理
結論 Prisma 側がデフォルトで提供するコネクションプールは無効化する(≒同時接続上限を1にする) 接続URLに connection_limit=1 を付与 PostgreSQL 用のコネクションプールである PgBouncer を supabase の管理画面で有効化する プールモードはトランザクションモードにする Prisma 側で PgBouncer を使用するように設定する 接続URLに PgBouncer のポートを指定し、 pgbouncer=true を付与 prisma migration の場合のみ、 PgBouncer を使わずに直接 PostgresQL に繋ぐようにする 接続用URLはこんなん postgres://postgres:[YOUR-PASSWORD]@db.xxxxxxxx.supabase.co:6543/postgres?pgbouncer=
![[キャッチアップ] Prisma + supabase DB におけるコネクション管理](https://cdn-ak-scissors.b.st-hatena.com/image/square/9d3c26fea77c415bdd832dd67b3a9d773235e8ce/height=288;version=1;width=512/https%3A%2F%2Fstorage.googleapis.com%2Fzenn-user-upload%2Favatar%2F845fa75ba8.jpeg){kind=avatar}
新規サービスにRemixを採用したぜ✌️ - Ateam Tech Blog
こんにちは。エイチームライフデザイン技術開発室の@aiji42です。 先日、弊社が運営しているイーデスというメディアの関連サービスとして、「イーデス専門家相談Q&A」という新しいサービスをリリースしました。 www.a-tm.co.jp 暮らしとお金に関する悩みや質問をサイトに投稿すると、住宅ローンや資産運用など専門分野ごとに実績があるファイナンシャルプランナー(専門家)や、同じような悩みを持っている一般のユーザーからアドバイスや意見を無料でもらうことができるというサービスです。 今回はその新サービスの開発・運営で採用した技術スタックや、それを採用した理由を紹介します。 技術スタック アーキテクチャの概略図は次の通りです。 アーキテクチャの概略図 まず、フロントエンド及びバックエンドはRemixで構築しており、クライアントへはサーバーサイドレンダリング(SSR)でコンテンツを提供しています
More NPM packages on Cloudflare Workers: Combining polyfills and native code to support Node.js APIs
Today, we are excited to announce a preview of improved Node.js compatibility for Workers and Pages. Broader compatibility lets you use more NPM packages and take advantage of the JavaScript ecosystem when writing your Workers. Our newest version of Node.js compatibility combines the best features of our previous efforts. Cloudflare Workers have supported Node.js in some form for quite a while. We
Cloudflare の nodejs_compat_v2 を有効にして prisma から pg を使う | 空雲 Blog
nodejs_compat_v2 は Cloudflare Workers/Pages を扱う場合に、Node.js の機能と互換性を持たせることができます。nodejs_compat よりも対応する幅が増えました。compatibility_date の 2024-09-23 以降からは、v2 の機能がnodejs_compatに統合される予定です。 https://blog.cloudflare.com/more-npm-packages-on-cloudflare-workers-combining-polyfills-and-native-code/ ちなみに nodejs_compat は機能がランタイム側にあるため、利用してもデプロイ時のサイズに影響を与えないのですが、nodejs_compat_v2は デプロイ前にPolyfillが働くらしく、サイズ増加を覚悟する必要がありま
HonoとPostgreSQL with Workersを本番投入に向けて検証している話
コード https://github.com/pensuke81/workers-playground 参考文献 - JavaScript Containers -
日本とグローバルのクックパッドを統合しました - クックパッド開発者ブログ
こんにちは、レシピ事業部プロダクト開発グループの赤松(@ukstudio)です。 昨年の10月頃からレシピ事業部ではひとつの大きなプロジェクトに取り組んでいました。このプロジェクトは社内ではOne experienceと呼ばれています。本記事ではこのOne experienceについてご紹介します。 追記: これまでに投稿された One Experience 関連の記事をまとめました。あわせてご覧ください。 Web ちょっと複雑なサイドバーをHotwireで簡単に作りたい - クックパッド開発者ブログ レシピIDリンク移行の話 - クックパッド開発者ブログ モバイル モバイルアプリの One Experience - クックパッド開発者ブログ Simple Custom Compose Layout - クックパッド開発者ブログ iOSアプリにおける複数リリースに跨った機能改善の開発事例紹
「Rails vs Node.js」を観た｜laiso
このYouTubeライブはフロントエンドの最適化を専門にするmizchiさんがCloudflare Meet-up Tokyoで行った同タイトルのプレゼンを、RustやRDBの実装に詳しいkoba789さんを話し相手に語っていくというものだ。背景としては2人ともチーム開発の現場でのRailsが活発に利用されていた時期にウェブ開発を経験し、現在はNode.jsのサーバーサイドも実践している。 ライブは3時間半という長時間におよび、スライド外の周辺情報や持論や余談など多岐に渡るので、すでにこのプレゼンに触れた人でもさらに深掘りできるようなコンテンツになっている。 全体を大まかに1時間ごとの3パートに区切って視聴するとわかりやすい。前半はRailsからNext.jsに辿り着くまでのウェブ開発の変遷。ORMの話は主に後半戦で。最後の1時間はアフタートークになっている。 内容としてはRailsアプリ
dotenvx、ありがとう
dotenv の改良版である dotenvx が使ってみてめっちゃ良かったので紹介します。 特徴 特に大きいのは「環境変数の暗号化」と「複数 .env ファイルへの対応」の2つです。 環境変数の暗号化 dotenvx 経由で環境変数をセットすることで、環境変数が公開鍵暗号方式で暗号化されます。 #/-------------------[DOTENV_PUBLIC_KEY]--------------------/ #/ public-key encryption for .env files / #/ [how it works](https://dotenvx.com/encryption) / #/----------------------------------------------------------/ DOTENV_PUBLIC_KEY="03f8b376234c4f2
Remix Validated Form
For new projects, we recommend starting with v6. For existing projects, there's a migration guide available. A form library purpose-built for Remix to make validation easy. Client-side, field-by-field and form-level validation Re-use validation on the server Set default values for the entire form in one place Supports nested objects and arrays Easily detect if a specific form is being sumitted Val
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Many-to-many relations | Prisma Documentation
TypeScript(恐らくJavaScriptでも)で読み込むモジュールを切り替えたかった話 - Qiita
🐛 BUG: `experimental:nodejs_compat_v2`Not Working Local or Deployment · Issue #6095 · cloudflare/workers-sdk
Vite+Vue3+Vuetify3+Expressのプロジェクトを1から作成する（ESLint、Prettier、Node.jsをPJに含めたモノレポ？構成） - Qiita
RemixでWeb標準を学んだ1年間 / First year with Remix
クレジットカードを製造する技術
