小学生でもわかる AI図鑑
  1. ホーム
  2. 小学生でもわかるVercel
  3. 第6話

Vercel 第6話

【小学生でもわかる】Vercel Functionsガイド!サーバーを借りずに、ファイル1つで裏側の処理を動かす

第5話の結論は、「秘密の鍵は、ブラウザではなく裏側の処理で使う」でした。では、その裏側はどこにあるのか。ネットで調べると、「サーバーを借りる」「月額いくら」「Linux の設定」といった言葉が並びます。そこで手が止まる人も多いはずです。Vercel では、そこまでしなくていい。

  • 無料プラン(Hobby)の月の枠の中で動かせる(メモリは2GBで、360 GB時は月に約180時間ぶん。1回の上限は300秒)。枠を超えると、課金ではなく止まる
Xで記事を読む シェア
裏側の処理のカバー

どんな話?

api というフォルダにファイルを1つ置くだけで動く「裏側の処理」(Vercel Functions)の回。api/hello.mjs を置き、本番の短いURLの後ろに /api/hello を付けて開き、Observability で呼ばれた回数と動いた時間を見ます。CPU は動いた時間だけ、メモリは待ち時間も数える。無料の枠を超えたら、止まる。/api/〜 のURLは誰でも呼べます。手順は公式ドキュメントに沿っています。

この記事でわかること

  • STEPは3つ。GitHub の保管庫に api/hello.mjs を置く・本番の短いURLの後ろに /api/hello を付けて開く・Observability で呼ばれた回数と動いた時間を見る(月の合計は Usage)
  • フレームワークを使わないプロジェクトは、ファイル名の最後を .js ではなく .mjs にする(または package.json に "type": "module" を書く)。Vercel が裏側の処理として扱うのは、api フォルダの中のファイル
  • Active CPU は、コードが実際に動いていた時間だけを数える。処理に100ミリ秒、データベースの返事待ちに400ミリ秒なら、数えるのは100ミリ秒だけ。メモリ(Provisioned Memory)のほうは、待っているあいだも数える
  • 無料プランのメモリは2GBで決まっていて、360 GB時は月に約180時間ぶん。1回の処理の上限は300秒で、超えると 504 のエラーになる
  • 無料プランで枠を超えると、課金ではなく止まる方向に倒れる。本番のデプロイごと止まって、ページも 503 になることがある。多くの場合、また使えるようになるのは30日後
  • 裏側の処理は、何も設定しなければアメリカ東海岸のワシントンD.C.(iad1)で動く。無料プランで選べるのは1か所だけ。裏側の処理は、データの近くに置く

こんな人に

  • 第5話を読んで、「鍵を使う裏側」を実際に置いてみたい人
  • 「サーバー」「API」という言葉で手が止まった人
  • 無料でどこまで動かせるのか、先に知っておきたい人

この話のTIPS

  • 注意無料プランで枠を超えると、課金ではなく止まる方向に倒れます。止まるのは裏側の処理だけとは限らず、本番のデプロイごと止まって、ページも 503 になることがあります。多くの場合、また使えるようになるのは30日後です。
  • コツ裏側の処理は、何も設定しなければアメリカの東海岸で動きます。無料プランで選べる場所は1つだけです。日本から呼ぶと、そのぶん少し遠回りになります。
すべてのTIPS