tailorjs nextjs alternative

[joriswijlens]

Hi,

I like the nextjs framework when it comes to creating server side rendered apps. But it is not very suitable for micro frontends. I think it is build not build for that purpose. Do you know about solutions like nextjs but that play nice with tailor? So a framework with which it is very easy to create apps that serve a couple of fragments, that even when you put two fragments of that app on one tailor template will still work?

Tnx,

Joris Wijlens

[rorofino]

Also interested.

[stevoPerisic]

Why do you say nextjs is not suitable for tailor? Did you run into any problems? Stevo

…

Sent from my iPhone

On Aug 9, 2019, at 3:05 AM, Rodrigo Orofino ***@***.***> wrote: Also interested. — You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub, or mute the thread.

[rorofino]

I think NextJS needs to handle the whole page render.
Do you know if it is possible to use it to generate only the HTML of fragments?

[stevoPerisic]

I have no immediate experience with NextJS, however I do have multiple micro services running through a Tailor JS layout service. If NextJS can serve a response that is a string of HTML than Tailor can handle it. I don’t think the framework is a blocker for you. Stevo

…

Sent from my iPhone

On Aug 9, 2019, at 10:06 AM, Rodrigo Orofino ***@***.***> wrote: I think NextJS needs to handle the whole page render. Do you know if it is possible to use it to generate only the HTML of fragments? — You are receiving this because you commented. Reply to this email directly, view it on GitHub, or mute the thread.

[rorofino]

Thanks for the Help @stevoPerisic !

I dont think NextJS can serve a response without the whole HTML page. (doc, head, body, etc...).

[stevoPerisic]

I see, hmmm, I’ll dig into NextJS a bit more... stay tuned

…

Sent from my iPhone

On Aug 9, 2019, at 1:28 PM, Rodrigo Orofino ***@***.***> wrote: Thanks for the Help @stevoPerisic ! I dont think NextJS can serve a response without the whole HTML page. (doc, head, body, etc...). — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub, or mute the thread.

[stevoPerisic]

After taking a look over the NextJS docs it seems that you can create and serve server-side rendered components without the HTML page document artifacts (like the head tag). All you have to do is remove this from the service that runs a particular component:

import Document, { Head, Main, NextScript } from 'next/document'

I would create a "layout" service that actually does the Document import to create the base-template and any other sub-templates that your application might need. Then create separate services that return server-side rendered components (fragments) to use in laying out the interior of the templates.

Hope that makes sense, I'm happy to chat more about it.

[joriswijlens]

Hi,

It works quite well until you have two fragments of the same application on the same page. I think this is due to the fact that both fragments load js files with the same name. I created a test with a page that renders two fragments with simple text: fragment 1 and fragment 2. After the second fragment loads they both say fragment 2.

[kirankalyan5]

Also interested in the outcome and possibilities.

Thanks

[KevinMind]

I've implemented next.js as a template service for node-tailor

you use next.js to generate your pages with server rendered html.

inside these pages you render components which when processed through tailor on server side, are replaced with your fragment applications (which are probably just CRA or simple smaller applications that don't need all the things next.js provides.

Building FRAGMENTS with next.js feels like an anti-pattern, because next.js is designed to be a framework which handles rendering pages.

That's one of the most powerful features of tailor though, it can process anything that can return *

I can provide an example if this is still interesting for anyone.

[lsrocha]

@KevinMind Could you share how did you use node-tailor with Next.js? I'm very interested in developing an application using both.

Did you import tailor into Next.js project or run both standalone? Do you have any project running in production?