追記 Cloudflare Workers向けのWebフレームワークを作っているので、そちらを是非チェックしてみてください！ honojs/hono: Ultrafast web framework for Cloudflare Workers. Fast, but not only fast. Cloudflare Workers が面白い。面白いので、いくつか簡単なアプリを作ってみた。例えば、そのひとつが Slack Bot で「yusukebe++」とかやるとインクリメントされるやつ。 今回は Cloudflare Workers の面白さについて解説する。より興味のある方がいれば、上記のコードを参考にしてもらうといいだろう。 Cloudflare Workers とは？ Cloudflare の CDN エッジでスクリプトが動くのが Cloudflare Workers。いわゆる
Next.jsの対抗馬となりそうなReactのフレームワークでRemixのv1.0がリリースされました。 個人的にRemixでいちばん魅力を感じているのはCloudflare WorkersでSSRができるという点です（現状ではNext.jsをCloudflare Workers上でSSRするのは難しい）。これがなぜ嬉しいのかと言うと、パフォーマンスを出しつつ、低コストで運用でき、大量のアクセスに対しても低コストでスケールできそうだからです。 そもそもSSRをする必要ある？ ほとんどのWebサービスはSSRなしでSPAとしてビルドし、Cloudflare PagesやGitHub Pagesに静的ファイルをのせて動かせば十分だと思います。 例えば僕が先日作った個人開発のサービスもReact on Cloudflare Pagesの完全なSPAですが、SSRが必要な要素はまったくありません。
入門Cloudflare Workers
はじめに この記事はCloudflare Workersの入門記事です。 名前は聞いたことがあるけれどCloudflare Workersが何者か知らない方 「Cloudflare Workersはサーバーレス・エッジコンピューティングサービスだよ」と説明されて日本語でOKと感じた方 AWSのLambdaやGCPのCloud Runと似たコンセプトのサービスだろうと認識されている方 上記に当てはまる方のお役に立てるはずです。 開発環境の構築 まずは開発環境を構築しましょう。といっても、最新のnode.jsをインストールするだけです。 インストールできたらバージョンを確認しておきましょう。 補足 v16.13.0より新しいバージョンのnodeが必要になります。記事を読み進めて不具合が発生した場合はnodeのバージョンを確認してください。 Windowsの動作検証はしていません。ここから先の手
最近は Cloudflare Workers ばっかりいじってて、フレームワークまで作ってるのですが、これ、ちゃんとやればそれなりの立派な Web サイトができるので、紹介します。 できたサイト 「家系ラーメン食べたい！」というサイトを作りました。 管理者の僕が家系ラーメンを登録できて、トップでは一覧で見れて、 詳細ページに行くと写真と紹介文が見れます。 質素に見えますが、 コンテンツ（ラーメン屋）をどんどん追加できる。 プロパティを追加することも可能。 画像はリサイズされる。 速い。 OGP ちゃんと設定している。 favicon.icon もやってる。 と、「ちゃんと」してます。そう、ちゃんとしてます。 では、どう作っていくか。 Cloudflare Workers Cloudflare Workers 、そのユースケースについて。 CDN のエッジで実行される、ということでスクリプト
ブログに画像を貼るのに、保存してリサイズして名前変えて、アップロードして… という作業がめんどくさい。 なので、Gyazo を使っていた。でも、Gyazo を使い続けるのもなんかアレなんで、代替の手段を考えていた。 macOS Monterey に「ショートカット」が入ったので Automator より触りやすいと試していたら、いつの間にか「Gyazo もどき」ができた。 バックエンドに S3、フロントの API サーバー に Cloudflare Workers を使った。 これ、なかなか面白いので紹介する。 デモ 右上のメニューバーより起動できる。 macOS のショートカット 最初に macOS の「ショートカット」アプリをどのように構成しているかを説明する。以下の通りである。 インタラクティブにスクリーンショットを撮る スクリーンショットを1000 x 自動高さ設定 のサイズにサイ
Cloudflare Workers メモ
前提 Cloudflare Workers は知っていたが最近触って、本番環境へ導入済み。 普段は Erlang/OTP を書いてるので JavaScript は専門外 自社サービスの本番環境には Cloudflare Workers を導入済み OpenResty はエンタープライズ大規模環境向けで設計/開発経験あり 雑感 Cloudflare Workers® ざーっと見た感じ Nginx + Lua (OpenResty) のマネージド、さらに Edge で動かしてくれて、スケールも勝手にしてくれるバージョンという認識。実際 shared.dict / redis の代わりが Workers KV が利用できる。 さらにローカル開発環境が充実している、デプロイ後のログ確認も管理画面から簡単に利用できる。 Lua Introducing Cloudflare Workers これを読む
tl;dr 生産性を上げる & SQL インジェクションを防ぐために ORM を使うのがよいとされている(諸説あります) cloudflare workers + d1 はウェブの破壊的イノベーション(諸説あります) モダンフロントエンドで大切なのは TypeScript との親和性と言われている(諸説減ってきた) 本当は理想の ORM を自作したいのけど、drizzle が現状一番自分のゴールに近いので、試したら良さそうだった 既存の問題と drizzle-orm 今までのあらすじ というわけで d1 に全振りするのが今後の生存戦略として有効だと思っているんですが、d1 client は専用のAPIからクエリ文字列を送り込む形式なので、native driver を使ってる prisma や typeorm 等が使えません。 自分が Mongodb + たまに Rails ActiveR
「Hono」というCloudflare Workers向けのフレームワークを作っています。 以前もYAPCの発表とZennの記事で紹介したものです。 Hono[炎]っていうイケてる名前のフレームワークを作っている Hono[炎] Ultrafast web framework for Cloudflare Workers. あらためて、さかのぼってみると「Initial Commit」が去年の12月15日でそれから現在405コミット。頑張っています。これは僕個人だけのものではなく、コントビューターの方のかいもあってです。ちなみに、そういうのも考慮して、個人リポジトリでやっていましたが、ある時から「honojs」オーガナイゼーションに切り替えました。 現在のバージョンは「v1.4.5」。 APIで紆余曲折ありつつも、安定してきました。また、使ってくれる人もだんだんと増えています。 今回は「現
RemixをCloudflare Workersを動かす最初の一歩について、まずはデプロイまでの手順をご紹介します。（Wrangler v2版） はじめに こんにちは、CX事業本部MAD事業部の森茂です。 最近ビックニュース続きのCloudflare使っていますか？とくにCDN エッジを利用したサービスが話題になっており私もわくわくがとまりません:) RemixはCloudflareのCDN エッジサービスであるWorkersでSSRを使って動かすことのできるReactベースのフレームワークのひとつです。そこで、今回は、これを機にCloudflare Workersを使ってみようという方向け、RemixをCloudflare Workersで動かす最初の一歩を紹介させていただきます。 Cloudflare の記事一覧 | DevelopersIO Remix の記事一覧 | Develop
エッジ上の Cloudflare Workers で RDB からデータを取得してみる - Techtouch Developers Blog
この記事はテックタッチアドベントカレンダー15日目の記事です。 エンジニアの kenyu です。最近ウェブでもエッジコンピューティングが流行っていますね。AWS の Lambda@Edge や、ちょっと前に発表された Vercel の Edge Functions などなど、エッジでサーバサイドの処理をするのがトレンドになりつつあるのかなと感じています。 そこで気になるのは「RDB などのデータストアとどのように通信すればよいのか？」ということですが、先月 Cloudflare よりエッジから RDB に接続するためのソリューションが発表されました。 せっかくなのでどんな感じか試してみたいと思います！ 引用元：Relational Database Connectorsのご紹介 イメージはこんな感じ。tunnel ごしに Worker と RDB がつながるイメージですね。 今回は Clo
CloudflareがMastodonに対応したActivityPub実装、Wildebeestを作ってたので紹介します。一部有料です
Intro 一応私はActivityPubの専門家として活動しているので、恥じないようActivityPubに関するエゴサーチを毎日しています。 仕事の昼休み中エゴサーチをしていたところ以下のGitHubリポジトリを紹介していたTweetが目に入りました。 おや？？？？？？ CloudflareのGitHubリポジトリだ……。 どうやらSven-sanをはじめとしたCloudflareに勤務している5名のチームで始まったプロジェクトのようです。（最初のコミット"Import wildebeest code"にて確認） ActivityPub実装って難しいよねわかると思いながらコードを読みました。 完成度がヤバい。 ヤバいヤバいヤバい。 マジでヤバいActivityPub実装が登場したので紹介します。 Wildebeest 2023/01/10現在のWildebeestのREADME.mdを
Cloudflare Workersで簡単にGoのHTTPサーバーを動かすためのライブラリを作ったので、紹介させていただきます。(まだかなり実験的な実装です) 特徴 http.Handlerを作って、 workers.Serve に渡すだけでCloudflare Workers上でHTTPサーバーとして動作する 必要なツールはtinygoとwrangler (Cloudflare WorkersのCLI) だけ JavaScript側のコードを触る必要が無い Cloudflare R2のバインディング（一部）を提供している 今後、KV等の対応も頑張る予定 デモ 下記のURLにアクセスすると Hello, world! と表示され、例としてURL末尾の world を syumai に差し替えると、 Hello, syumai! と表示されます。 ソースコードは、以下のような非常にシンプルな
Introduction 最近各所で話題のCloudflare。 Wranglerも2.0になり、worker-rustの テンプレも動いたので、それを少し変更して画像の加工処理を実装したいと思います。 Cloudflare Workers? Cloudflare Workersは、Cloudflare上で実行される サーバーレスアプリケーションの実行環境です。 AWSで近いサービスを挙げると、AWS Lambda（Lambda＠Edge)になるかと思います。 自動スケーリング&Edgeロケーション&コールドスタートなしで起動する、 などの特徴があり、対応言語はJS, Rust, C, C++です。 また、WorkersKV(低レイテンシのKey-Valueデータストア)を使うことで （SSRやったりとか）Workersの用途が広がります。 Environment 環境は以下。 MacBo
![[Rust] Cloudflare Workersで画像の加工をやってみる | DevelopersIO](https://cdn-ak-scissors.b.st-hatena.com/image/square/5a5ba277b72d1c9cd7ed446ff9649d34a024a1f8/height=288;version=1;width=512/https%3A%2F%2Fdevio2023-media.developers.io%2Fwp-content%2Fuploads%2F2021%2F04%2Fmaxresdefault.jpeg)
Node.js compatibility for Cloudflare Workers – starting with Async Context Tracking, EventEmitter, Buffer, assert, and util
Node.js compatibility for Cloudflare Workers – starting with Async Context Tracking, EventEmitter, Buffer, assert, and util03/23/2023 Over the coming months, Cloudflare Workers will start to roll out built-in compatibility with Node.js core APIs as part of an effort to support increased compatibility across JavaScript runtimes. We are happy to announce today that the first of these Node.js APIs –
Cloudflare Workers Browser Rendering API を使ってスクリーンショットを R2 に保存する - Qiita
Cloudflare Workers Browser Rendering API を使ってスクリーンショットを R2 に保存するcloudflareCloudflareWorkers Workers Browser Rendering API とは Automate an isolated browser instance with just a few lines of code This is why we’re excited to announce a private beta of the Workers Browser Rendering API, improving the browser automation experience for developers. With browser automation, you can programmatically do any
Improving Workers TypeScript support: accuracy, ergonomics and interoperability
Improving Workers TypeScript support: accuracy, ergonomics and interoperability11/18/2022 This post is also available in 简体中文, 繁體中文, 日本語, Deutsch, Français, Español and Português. TypeScript makes it easy for developers to write code that doesn’t crash, by catching type errors before your program runs. We want developers to take advantage of this tooling, which is why one year ago, we built a syst
Vercel's Edge Functions are built on top of Cloudflare Workers. The runtime is d... | Hacker News
Vercel's Edge Functions are built on top of Cloudflare Workers. The runtime is designed for any similar provider, but we've chosen Cloudflare for now because they have an amazing product.
GitHub 今回のソースを上げました。 目標 前回はCRUDのREADだけを実装しました。 それだけではフレームワークを活かせていないので、今回はかんたんな認証を実装します。認証済みのユーザーだけsecretページに入れるようなものを作りたいと思います。それでは行きましょう。 認証 認証について調べたのですが、表題の構成ですと2022年2月では大きく２通りのパターンがあるようです。 Remix Auth Supabaseを用いる Supabase Authを用いる それぞれどういうメリット・デメリットがあるのかわからないのですが、Remix Auth Supabaseを用いるとあまりに簡単に実装できてしまい書くことがなくなるので、今回はSupabase Authの方を選択します。また、Remix Auth Supabaseの方も内部的にはSupabase Authを使っているので、結局ソ
日記です。 タイトルの通り10年勤めたfreee株式会社を退職して、自分で会社を作ってやっていくことにした。 freee最終出社でした、10年間ありがとうございました！(ビルを見上げる写真撮り忘れた) 次回作にご期待ください！ — yo_waka (@yo_waka) June 16, 2023 やってきたことはこの辺のスライドによくまとまっている。 https://speakerdeck.com/waka/da-kinapurodakutofalseyu-tefang 社員5人から1000人になったり、ARRゼロ円からARR200億円になったり、ヤバかった品質をどうにか底上げしたり、開発本部長の立場で上場を経験したり、普通では経験できないことを濃度高く経験できて楽しく過ごせた10年だった。 freee会計という業務系Webサービスを10年間機能面/パフォーマンス/品質面共に育ててきた経験
一日単位で見ると書き込みと削除が1,000回なので大規模サービスでは厳しいですが、中小規模サービスであれば十分です。 読み込みに関しては、日次で10万回、月間で約300万回ですから十分な無料枠が提供されています。 Cloudflare Workers KVの無料枠の使い道読み込みの枠が多いので、共通の固定データベースなどを置いておくのに使いやすいでしょう。例えば、都道府県一覧や、郵便番号一覧などのデータの変更があまり入らないデータを置いておいて、Cloudflare Workersで稼働させるAPIから高速配信するなどです。 また、バリューの最大枠が25MBまで拡張されたので、ユーザーのローカルに保存しておいたJSONデータなどを丸っと定時でバックアップするサーバーレスAPIとして使うのも使い勝手が良さそうです。 データを丸っとコピーするだけであれば、書き込み回数は1回で済むため中小規模で
Doubling down on local development with Workers: Miniflare meets workerd
Doubling down on local development with Workers: Miniflare meets workerd11/18/2022 Local development gives you a fully-controllable and easy-to-debug testing environment. At the start of this year, we brought this experience to Workers developers by launching Miniflare 2.0: a local Cloudflare Workers simulator. Miniflare 2 came with features like step-through debugging support, detailed console.lo
Cloudflare Workers KV は、Cloudflare のエッジサーバからアクセスできる、グローバルなキーバリューストア。 Workers スクリプトからアクセスして使う。 各エッジサーバ毎に存在するのではなく全てのエッジサーバが共有するストアであるため、API など様々な用途で使える。 そしてエッジサーバで動くため、レイテンシが小さくなるというメリットもある。 この記事では、既に Cloudflare Workers を利用しているサイトに Workers KV を導入する手順を見ていく。 まず、名前空間を作成し、それを Workers と紐付ける必要がある。 名前空間の作成は Cloudflare のダッシュボードからもできるが、ここでは CLI ツールの wrangler を使う方法を紹介する。 Workers スクリプトのディレクトリで、以下のコマンドを実行する。wr
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Cloudflare Workers 面白い - ゆーすけべー日記
Cloudflare WorkersでSSRができると何が嬉しいか
Cloudflare WorkersでちゃんとしたWebを作る - ゆーすけべー日記
macOSのショートカットとS3とCloudflare WorkersでGyazoができる - ゆーすけべー日記
Cloudflare D1 で ORM を使う (drizzle-orm)
Cloudflare Workersフレームワーク「Hono」の紹介
RemixをCloudflare Workersで動かす最初の一歩 | DevelopersIO
Cloudflare Workersで簡単にGoのHTTPサーバーを動かすためのライブラリを作った
[Rust] Cloudflare Workersで画像の加工をやってみる | DevelopersIO
Supabase+Remix+Cloudflare Workersで認証
waka.dev
無料枠も登場したCloudflare Workers KVまとめ | SERVERSUS
Cloudflare Workers KV の初歩 - 30歳からのプログラミング