Aller au contenu

Neon Postgres & Astro

Neon est une base de données Postgres entièrement gérée sans serveur. Elle sépare le stockage et le calcul pour offrir une mise à l’échelle automatique, des ramifications et un stockage illimité.

  • Un compte Neon avec un projet créé
  • Une chaîne de connexion à la base de données Neon
  • Un projet Astro avec le rendu à la demande (SSR) activé

Pour utiliser Neon avec Astro, vous devez définir une variable d’environnement Neon. Créez ou modifiez le fichier .env à la racine de votre projet et ajoutez le code suivant, en remplaçant les détails de votre propre projet :

.env
NEON_DATABASE_URL="postgresql://<user>:<password>@<endpoint_hostname>.neon.tech:<port>/<dbname>?sslmode=require"

Pour une meilleure prise en charge de TypeScript, définissez les variables d’environnement dans un fichier src/env.d.ts :

src/env.d.ts
interface ImportMetaEnv {
readonly NEON_DATABASE_URL: string;
}
interface ImportMeta {
readonly env: ImportMetaEnv;
}
En savoir plus sur les variables d’environnement et les fichiers .env dans Astro.

Installez le paquet @neondabase/serverless pour vous connecter à Neon :

Fenêtre du terminal
npm install @neondatabase/serverless

Créez un nouveau fichier src/lib/neon.ts avec le code suivant pour initialiser votre client Neon :

src/lib/neon.ts
import { neon } from '@neondatabase/serverless';
export const sql = neon(import.meta.env.NEON_DATABASE_URL);

Vous pouvez désormais utiliser le client Neon pour interroger votre base de données à partir de n’importe quel composant .astro. L’exemple suivant récupère l’heure actuelle à partir de la base de données Postgres :

src/pages/index.astro
---
import { sql } from '../lib/neon';
const response = await sql`SELECT NOW() as current_time`;
const currentTime = response[0].current_time;
---
<h1>Heure actuelle</h1>
<p>Il est : {currentTime}</p>

La fonction de ramification de Neon vous permet de créer des copies de votre base de données à des fins de développement ou de test. Utilisez-la dans votre projet Astro en créant différentes variables d’environnement pour chaque branche :

.env.development
NEON_DATABASE_URL=your_development_branch_url
.env.production
NEON_DATABASE_URL=your_production_branch_url

Plus de guides sur les services backend

Contribuer Communauté Parrainer