1

I don't see a clear path to get the full page creating experience in any headless configuration as is available in Craft/Twig. The routing in next.js specifically I think is the main obstacle.

Next.js routing is file-based, so if I want to create a blog page, I would create blog/index.js as shown:

Index routes
The router will automatically route files named index to the root of the directory.

pages/index.js → /
pages/blog/index.js → /blog

The file structure below could support my top-level pages, but what about singles, or kitchen sink pages that can be used as a child of any top-level page, or as top-level pages themselves? Where is the ability to create a new entry in a headless Craft setup, and that generate a new page on a next.js frontend?

\---pages
    |   index.js
    |   
    +---about
    |   |   index.js
    |   |   
    |   \---[staff]
    |        index.js
    +---blog
    |   |   index.js
    |   |   
    |   \---[post]
    |        index.js
    +---events
    |   |   index.js
    |   |   
    |   \---[event]
    |   |    index.js
    |           
    \---products
        |   index.js
        |   
        \---[product]
             index.js

We're all familiar with section and type in Craft. How would I go about dynamically routing in next.js based on a page's section and type instead of the filename?

Ex:

I have a page with a slug of widgets, a section of pages and a type of gadgets

In Twig, Craft would look in pageTypes/pages.twigwhere I would include the page type {% set type = entry.type %} {% include 'pageTypes/' ~ type %}

Am I approaching this problem the wrong way by trying to solve it the Twig way instead of the Next way? Or is there a solution that mimics/is closer to the way we would do this in a conventional Craft site?


0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.