Skip to content

Latest commit

 

History

History
46 lines (32 loc) · 1.82 KB

README.md

File metadata and controls

46 lines (32 loc) · 1.82 KB
Raw

Live demo

A live demo of this application is available at https://xata-gallery.vercel.app. The demo turns off the ability to upload and delete images. For local or forked versions, set the .env setting READ_ONLY=false.

Sample gallery app powered by Xata

A small example Xata application built with Next.js & Chakra UI.

image

This app showcases serveral Xata features including:

  • Offset based pagination
  • Form management and submission
  • Search
  • Aggregations
  • Summaries
  • Image transformations
  • Queries using junction tables and links
  • Proper Next.js + Xata TypeScript patterns

To run this example locally with your own database

You'll need to install Xata before performing these steps.

  • git clone git@github.com:xataio/sample-nextjs-chakra-gallery-app.git
  • cd sample-nextjs-chakra-gallery-app
  • pnpm install
  • Run pnpm run bootstrap the first you set up the project. This will ask for a Xata database to install to (you can create a new one) and then seed in some data.
  • pnpm run dev to load the site at http://localhost:3000
  • Add images either through the application, or through your database UI at https://app.xata.io

Environment variables

After you run init, your .env file should look like this

# Xata credentials
XATA_BRANCH=main
XATA_API_KEY=

# Setting to true will disable API / UI to write to the database
READ_ONLY=false

Deploy with Vercel