HonoのCloudflare Pagesテンプレートのチュートリアルを触る

# gardenia_710 @ makkubukku in ~/dev [20:57:09]
$ npm create hono@latest hono-pages
Need to install the following packages:
create-hono@0.3.2
Ok to proceed? (y) y

create-hono version 0.3.2
✔ Using target directory … hono-pages
✔ Which template do you want to use? › cloudflare-pages
cloned honojs/starter#main to /Users/gardenia_710dev/hono-pages
✔ Copied project files

$ npm install
npm WARN deprecated rollup-plugin-inject@3.0.2: This package has been deprecated and is no longer maintained. Please use @rollup/plugin-inject.
npm WARN deprecated sourcemap-codec@1.4.8: Please use @jridgewell/sourcemap-codec instead

added 85 packages, and audited 86 packages in 20s

9 packages are looking for funding
  run `npm fund` for details

found 0 vulnerabilities

$ tree
.
├── README.md
├── package-lock.json
├── package.json
├── public
│   └── static
│       └── style.css
├── src
│   ├── index.tsx
│   └── renderer.tsx
├── tsconfig.json
└── vite.config.ts

4 directories, 8 files

npm run dev

import { Hono } from 'hono'
import { renderer } from './renderer'

const app = new Hono()

app.get('*', renderer)

app.get('/', (c) => {
  return c.render(<h1>Hello!</h1>)
})

export default app

return c.render(<h1>Hello! World!</h1>)

npm run deploy

Successfully logged in.
No project selected. Would you like to create one or use an existing project?
❯ Create a new project
  Use an existing project
✔ Enter the name of your new project: … hono-pages
✔ Enter the production branch name: … main
✨ Successfully created the 'hono-pages' project.
🌍  Uploading... (1/1)

✨ Success! Uploaded 1 files (1.15 sec)

✨ Compiled Worker successfully
✨ Uploading Worker bundle
✨ Deployment complete! Take a peek over at https://43636d3b.hono-pages-dy9.pages.dev

app.get("/api", (c) => {
  return c.json({ message: "Hello! World!" });
});

app.get("/api/user/:id", (c) => {
  const id = c.req.param("id");
  return c.json({ id: id });
});

app.get("/api/user/:id", (c) => {
  const id = c.req.param("id");
  const name = c.req.query("name");
  return c.json({ id: id, name: name });
});