Skip to content

Latest commit

 

History

History

sveltekit

SvelteKit Example

This example shows how to implement a simple web app using SvelteKit and Prisma ORM.

Getting started

1. Download the example and navigate to the project directory

Download this example:

npx try-prisma@latest --template orm/sveltekit

Then navigate to the project directory

cd sveltekit
Alternative: Clone the entire repo

Clone this repository:

git clone git@github.com:prisma/prisma-examples.git --depth=1

Install npm dependencies:

cd prisma-examples/orm/sveltekit
npm install

[Optional] Switch database to Prisma Postgres

This example uses a local SQLite database by default. If you want to use to Prisma Postgres, follow these instructions (otherwise, skip to the next step):

  1. Set up a new Prisma Postgres instance in the Prisma Data Platform Console and copy the database connection URL.

  2. Update the datasource block to use postgresql as the provider and paste the database connection URL as the value for url:

    datasource db {
      provider = "postgresql"
      url      = "prisma+postgres://accelerate.prisma-data.net/?api_key=ey...."
    }

    Note: In production environments, we recommend that you set your connection URL via an environment variable, e.g. using a .env file.

  3. Install the Prisma Accelerate extension:

    npm install @prisma/extension-accelerate
    
  4. Add the Accelerate extension to the PrismaClient instance:

    + import { withAccelerate } from "@prisma/extension-accelerate"
    
    + const prisma = new PrismaClient().$extends(withAccelerate())

That's it, your project is now configured to use Prisma Postgres!

2. Generate Prisma Client

Run the following command to generate the Prisma Client. This is what you will be using to interact with your database.

npx prisma generate

3. Start the SvelteKit server

npm run dev

The server is now running at http://localhost:5173

Switch to another database

If you want to try this example with another database than SQLite, refer to the Databases section in our documentation

Next steps