Pubblicazione

Esegui la build, imposta i metadati e fai il deploy di Acme Deploys.

L’app di questo capitolo è in esecuzione nella tua console. Aprila con ⌘⌥JCtrl+Shift+J⌘⌥KCtrl+Shift+K⌘⌥C (prima attiva le funzionalità per sviluppatori), poi provala.
Guarda il capitolo3:04

In questo capitolo

  • Build
  • Metadata
  • Hosting statico
  • Prima del deploy

text build produce un client statico e, se hai route handler, un server per text start.

Build

bun run build
   ▼ Text.js 1.0.1 (Turbolog)   Creating an optimized console production build... ✓ Compiled successfully in 0.8s ✓ Collecting route data ✓ Generating static console cells (3/4) ✓ Prerendering console shells (3/3) ✓ Prerendering curl frames (3/3) ✓ Finalizing console optimizationRoute (app)                              Type       Target┌ ○ /                                    Static     console.log (%c)├ ○ /_not-found                          Static     console.log (%c)├ ○ /deployments                         Static     console.log (%c)├ ƒ /deployments/[id]                    Dynamic    console.log (%c)├ ○ /settings                            Static     console.log (%c)└ ƒ /api/deployments                     Dynamic    Route Handler+ First Load JS shared by all             698.2 kB (241.6 kB gzip)○  (Static)   prerendered as static console cellsƒ  (Dynamic)  on-demand console reconciliation

text start serve la build ed esegue i tuoi route handler. Funziona su qualsiasi host con Bun 1.2+ o Node.js 22+.

Metadata

Imposta il titolo della scheda del browser nel layout radice. Le pagine possono sovrascriverlo.

app/deployments/page.tsx+1tsx
Aggiunto: export const metadata = { title: "Deployments" }; // → "Deployments · Acme"

Hosting statico

Senza route handler, la build è un normale sito statico. Ogni route statica ha il proprio file HTML. Le route dinamiche come /deployments/[id] sono servite da index.html.

Su Vercel e Cloudflare Pages, text build rileva la piattaforma e scrive autonomamente quel fallback. Gli altri host statici richiedono una regola di riscrittura. Su Netlify, aggiungi un file _redirects a public/:

public/_redirects+1text
Aggiunto: /*  /index.html  200

Netlify serve i file esistenti prima di applicare la regola, quindi le risorse e le route con pre-rendering restano invariate.

Prima del deploy

  • Disattiva Mantieni il log nelle impostazioni della console. Anche i tuoi utenti devono disattivarlo.
  • Prova dimensioni ridotte come 80×24. DevTools ancorato lateralmente produce una griglia stretta.
  • Esegui bun test.

Premi Enter nella console per fare il deploy. Poi ritira il tuo certificato.

Provala

Questa è Acme Deploys alla fine del capitolo, in esecuzione in DevTools. Fai clic sul pannello del focus, poi usa i tasti qui sotto.

▼ 10 · Pubblicazione

Apri la console

⌘⌥J
CtrlShiftJ
⌘⌥K
CtrlShiftK
⌘⌥C

L’app viene renderizzata in DevTools.Prima attiva «Mostra funzionalità per sviluppatori web» in Safari Impostazioni → Avanzate. Poi fai clic qui e premi Enter.

Aprire su desktop

Questa app viene renderizzata nella console DevTools, che richiede un browser desktop.

Quiz

2 domande

Rispondi a tutte le domande per completare il capitolo.

Cosa serve a un host statico per le route dinamiche?

 

Quale impostazione della console deve essere disattivata?