Set up good example for NextJS

[dimuch]

I am new to NextJS and PDF generating
Reading the docs found nice Repl example where from the left side future pdf page Component and from the Right side rendered pdf.

I cant make a connection: how this Repl page was done. When i change left side text -> right side re-rendered accordingly.
Also i see some requests to _next/static/worker .... file, and updated blob content returned back. Tried to look the code for the repl page, found ViewerComponent and stuck (.

I see this component:
<Repl value={code} activeTab={activeTab} onChange={setCode} onUrlChange={setDocumentUrl} />

Looks like code is a string/blob that comes from the front on any change. Am I right?

So i guess this page implemented on NextJS
Question: how was this page implemented?

If possible step by step how to would be great.
I really cant make a glue how to get right side in case i have component on NextJS