Logo
    HonoをCloudflare Worksにdeployしてみた

    HonoをCloudflare Worksにdeployしてみた

    はじめに

    ゆとり世代の中野です。

    さっそくチャレンジについて書いていきます。

    チャレンジする背景

    • Honoを使ってAPIを開発している
    • 試しにHonoをCloudflare Worksにdeployしたい

    チャレンジ内容

    • HonoをCloudflare Worksにdeployする

    やったこと

    • projectを作成
      1. pnpm create hono@latest
      2. 対話した内容は以下
      3. ? Target directory my-app
        ? Which template do you want to use? cloudflare-workers
        ✔ Cloning the template
        ? Do you want to install project dependencies? yes
        ? Which package manager do you want to use? pnpm
        ✔ Installing project dependencies
        🎉 Copied project files
    • CLIでログインする
      1. pnpm dlx wrangler login 
      2. ブラウザが立ち上がってAllowするか確認する画面が表示される
        • Allowのボタンをクリックすると以下の画像が表示される
        • image
    • エントリーポイントを登録する
      • wrangler.tomlにmainを追加する
      • name = "my-app"
        main = "src/index.ts"
    • deployする
      1. pnpm dlx wrangler deploy
      2. deployが成功すると以下がログに出力される
      3. Uploaded my-app (1.72 sec)
        Published my-app (4.01 sec)
          https://my-app.アカウント名.workers.dev
        Current Deployment ID: xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx
        Current Version ID: xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx
    • 確認する
      • https://アプリ名.アカウント名.workers.dev

    結論

    • deployまでは簡単にできた

    さいごに

    • あとはgithub actionsの準備や任意の環境へのdeployどうするか調べる

    Reference

    Cloudflare WorkersをWranglerで構築してみる

    数十回クリックするだけでWorkersがデプロイ出来ることが確認でき、めちゃくちゃ驚きました。 手動で作れることが確認出来れば、コードで実行したくなるのがシステム屋さんの性でしょう!(知らんけど)

    zenn.dev

    Cloudflare WorkersをWranglerで構築してみる
    Cloudflare Workersの環境設定

    https://developers.cloudflare.com/workers/platform/environment-variables/

    zenn.dev

    Cloudflare Workersの環境設定

    yutanakano

    WEBエンジニア

    大阪生まれのゆとり世代です

    趣味はバイクでツーリングに行くこと

    愛車は Ninja ZX-25R SE KRT EDITION

    Expoでプロダクトを作っています

    image

    ©ゆとりちゃれんじ

    GitHubXInstagram