Giter Site home page Giter Site logo

neondatabase / neon-vercel-zapatos Goto Github PK

View Code? Open in Web Editor NEW
1.0 9.0 2.0 461 KB

Example use of Neon serverless driver on Vercel Edge Functions with Zapatos

Home Page: https://neon.tech

TypeScript 66.72% JavaScript 33.28%
neon postgresql serverless vercel vercel-edge-functions zapatos

neon-vercel-zapatos's Introduction

neon-vercel-zapatos

This repo demonstrates the use of Zapatos with Neon's serverless driver on Vercel Edge Functions.

We implement a simple app that generates a JSON listing of the user's nearest 10 UNESCO World Heritage sites via IP geolocation (data copyright ยฉ 1992 โ€“ 2022 UNESCO/World Heritage Centre).

How it works

The @neondatabase/serverless driver is compatible with (and built on top of) node-postgres, the pg package. But because Zapatos tries to import the pg package directly, we have a small amount of extra work to do.

First, we include a tiny local-path package, which you'll find in shims/pg. This calls itself pg but simply re-exports the contents of @neondatabase/serverless. That makes Zapatos work in a serverless environment.

Second, we generate and update the Zapatos schema types (inside ./zapatos) at development-time using Node, by running npm run update-zapatos-types. Because Node has no native WebSocket object, this calls a simple custom script, update-zapatos-types.mjs, in which we configure the serverless driver to use the ws package.

Third, it's important to set "strict": true and add "zapatos/**/*" to the "include" directive in tsconfig.json.

Deploy

  • Ensure the psql client is installed.

  • Create a Neon database and make a note of the connection string from the Neon console.

  • Clone this repo, then:

# get dependencies
npm install
npm install -g vercel@latest

# create DATABASE_URL environment variable, remote and local
npx vercel env add DATABASE_URL  # paste in the connection string and select all environments
npx vercel env pull .env.local  # now bring it down into ./.env.local for local use

# create the schema and copy data to DB
(source .env.local \
 && curl -s https://gist.githubusercontent.com/jawj/a8d53ff339707c65128af83b4783f4fe/raw/45dbcc819b00ecb72f80b0cf91e01b3d055662b5/whc-sites-2021.psql \
 | psql $DATABASE_URL)

# update Zapatos types from DB
npm run update-zapatos-types

# test
npx vercel dev

# ... and deploy
npx vercel deploy

Feedback and support

Please visit Neon Community or Support.

neon-vercel-zapatos's People

Contributors

jawj avatar

Stargazers

 avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

neon-vercel-zapatos's Issues

Is this still necessary?

I'm using @vercel/postgres to create pool and pass a client to run function. Won't this be enough?

Steps to reproduce

import { createPool, VercelPool } from '@vercel/postgres';

let pool: VercelPool;

export async function getPool() {
	if (!pool) {
		pool = createPool({
			connectionString: DATABASE_URL
		});
	}
	return await pool.connect();
}

export async function runQuery<T>(query: SQLFragment<T>) {
	const client = await getPool();
	const res = await query.run(client);
	client.release();
	return res;
}

Expected result

It works without issues on Vercel

Actual result

Environment

Vercel

Logs, links

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.