Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/chapter-three/next-drupal

Next.js for Drupal has everything you need to build a next-generation front-end for your Drupal site: SSG, SSR, and ISR, Multi-site, Authentication, Webforms, Search API, I18n and Preview mode (works with JSON:API and GraphQL).
https://github.com/chapter-three/next-drupal

decoupled drupal drupal-modules graphql headless headless-cms jsonapi next-plugin nextjs

Last synced: about 1 month ago
JSON representation

Next.js for Drupal has everything you need to build a next-generation front-end for your Drupal site: SSG, SSR, and ISR, Multi-site, Authentication, Webforms, Search API, I18n and Preview mode (works with JSON:API and GraphQL).

Awesome Lists containing this project

README

        


Next.js for drupal

Next.js for Drupal


Next-generation front-end for your Drupal site.


## Demo

https://demo.next-drupal.org

## Documentation

https://next-drupal.org

## Deploy to Vercel

[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/clone?repository-url=https%3A%2F%2Fgithub.com%2Fchapter-three%2Fnext-drupal-basic-starter&env=NEXT_PUBLIC_DRUPAL_BASE_URL,NEXT_IMAGE_DOMAIN&envDescription=Learn%20more%20about%20environment%20variables&envLink=https%3A%2F%2Fnext-drupal.org%2Fdocs%2Fenvironment-variables&project-name=next-drupal&demo-title=Next.js%20for%20Drupal&demo-description=A%20next-generation%20front-end%20for%20your%20Drupal%20site.&demo-url=https%3A%2F%2Fdemo.next-drupal.org&demo-image=https%3A%2F%2Fnext-drupal.org%2Fimages%2Fdemo-screenshot.jpg)

## Example

A page with all "Article" nodes.

```jsx
import { DrupalClient } from "next-drupal"

const drupal = new DrupalClient("https://cms.next-drupal.org")

export default function BlogPage({ articles }) {
return (


{articles?.length
? nodes.map((node) => (

{node.title}



))
: null}

)
}

export async function getStaticProps(context) {
const articles = await drupal.getResourceCollectionFromContext(
"node--article",
context
)

return {
props: {
articles,
},
}
}
```

## Supporting organizations

Development sponsored by [Chapter Three](https://chapterthree.com)

## Contributing

If you're interested in contributing to Next.js for Drupal, please read the [contributing guidelines](https://github.com/chapter-three/next-drupal/blob/main/CONTRIBUTING.md) before submitting a pull request.