Add support for React NextJS

[melloware]

Reproducer project:
quinoa-nextjs.zip

NextJS serves on port 3000 like Create React app does and it does not serve an index.html but I have Quinoa configured where it almost works.

quarkus.quinoa.package-manager-install=true
quarkus.quinoa.package-manager-install.node-version=16.17.0
quarkus.quinoa.dev-server.port=3000
quarkus.quinoa.enable-spa-routing=true
quarkus.quinoa.build-dir=out
quarkus.quinoa.index-page=/

If you run mcn quarkus:dev on the above project the one remaining issue is that NextJS opens a websocket this works normally and returns a 101.

But in Quinoa its return a 403 and tries over and over again. I believe Next JS needs this socket open to communicate changes GET /_next/webpack-hmr HTTP/1.1

2023-03-09 17:08:06,390 INFO  [io.qua.htt.access-log] (vert.x-eventloop-thread-1) 127.0.0.1 - - 09/Mar/2023:17:08:06 -0500 "GET /_next/webpack-hmr HTTP/1.1" 403 -
2023-03-09 17:08:11,416 INFO  [io.qua.htt.access-log] (vert.x-eventloop-thread-2) 127.0.0.1 - - 09/Mar/2023:17:08:11 -0500 "GET /_next/webpack-hmr HTTP/1.1" 403 -
2023-03-09 17:08:16,433 INFO  [io.qua.htt.access-log] (vert.x-eventloop-thread-1) 127.0.0.1 - - 09/Mar/2023:17:08:16 -0500 "GET /_next/webpack-hmr HTTP/1.1" 403 -
2023-03-09 17:08:21,462 INFO  [io.qua.htt.access-log] (vert.x-eventloop-thread-2) 127.0.0.1 - - 09/Mar/2023:17:08:21 -0500 "GET /_next/webpack-hmr HTTP/1.1" 403 -
2023-03-09 17:08:26,480 INFO  [io.qua.htt.access-log] (vert.x-eventloop-thread-1) 127.0.0.1 - - 09/Mar/2023:17:08:26 -0500 "GET /_next/webpack-hmr HTTP/1.1" 403 -

If we can get this working I would be happy to submit a PR to update the documentation.

[ia3andy]

I guess you would need to configure next js to use 3000 for websocket (instead of 8080) like we do with vite.

[ia3andy]

That might help: vercel/next.js#6271

[melloware]

I will test today and it it works I will submit a PR for the docs in case anyone else wants to use Next!

[melloware]

OK that is not the issue its being rejected for CORS origin.

So here is the URL: ws://localhost:8080/_next/webpack-hmr

[melloware]

OK it looks like that post for configuring the websocket was from 2019 and they removed it with this PR: vercel/next.js#6354

It looks like they don't allow control of that websocket port they use something called Event sourcing?

I submitted this: vercel/next.js#47000

[melloware]

Ahhh I see you have already discussed this exact issue: #71