https://github.com/jesstelford/keystone-next-adminui

A prototype of using Next.js as KeystoneJS's Admin UI
https://github.com/jesstelford/keystone-next-adminui

Last synced: about 1 month ago
JSON representation

A prototype of using Next.js as KeystoneJS's Admin UI

• Host: GitHub
• URL: https://github.com/jesstelford/keystone-next-adminui
• Owner: jesstelford
• Created: 2020-04-25T14:02:36.000Z (over 4 years ago)
• Default Branch: master
• Last Pushed: 2023-01-09T22:49:40.000Z (about 2 years ago)
• Last Synced: 2024-06-11T17:37:02.584Z (7 months ago)
• Language: JavaScript
• Size: 4.26 MB
• Stars: 1
• Watchers: 4
• Forks: 0
• Open Issues: 21
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGELOG.md

Awesome Lists containing this project

README

        
# KeystoneJS + Next.js powered Admin UI Prototype

> ⚠️ **This is a prototype only** ⚠️

Using Next.js' new `getStaticPaths()`/`getStaticProps()` methods to do static

builds of Admin UI pages that can also handle dynamically rendering new data.

## Running it

```

yarn

yarn dev

```

Then visit `http://localhost:3000/admin`

(for production mode; `yarn build && yarn start`)

## Rendering the Admin UI

This KeystoneJS App does _not_ include usage of `@keystonejs/app-admin-ui`.

Instead, it uses `@keystonejs/app-next` to render a Next.js based Admin UI.

The Next.js Admin UI is the last app (aka; route handler) exported from

`index.js`, so acts as a catch-all. It defines a single route `/admin` which has

3 nested routes:

- `/admin` - the "Dashboard" index page

  - ✅ Statically rendered List tiles at build time

  - ✅ Client side data fetching for list meta data

- `/admin/[listKey]` - A list view for a Keystone List

  - ✅ Statically rendered skeleton at build time

  - ✅ Client side data fetching for list items

- `/admin/[listKey]/[id]` - Detail view for a single item of the given Keystone

  List

  - ✅ Statically rendered skeleton at build time

  - ✅ Client side data fetching for item data