Can I disable the creation of _middlewareManifest.js in NextJS? - next.js

I am not using any middleware in NextJS but yet there still is a _middlewareManifest.js with self.__MIDDLEWARE_MANIFEST=[];self.__MIDDLEWARE_MANIFEST_CB&&self.__MIDDLEWARE_MANIFEST_CB() in it.
Can I disable the generation and inclusion of this file in some way?

Related

Which react component library can i use in nextjs 13.1?

I am relatively next to nextjs. Trying out 13.1 and new "app" directory.
Is it possible to do so? Without losing the new benefits of server controls?
I see the following error.
You're importing a component that needs useState. It only works in a Client Component but none of its parents are marked with "use client", so they're Server Components by default.
The useState hook only runs on the client. In case your component uses it consider adding the “use client” directive at the top of the component file. This will pre-render your markup on the server and run the ‘useState’ hook after the rehydration.

how to trigger nextjs middleware on next/link

Hi i'm currently using nextjs middleware to check authentication for every page
everything works fine when I'm navigating from the browser URL.
But when I try to navigate using next/link. it's skipped the middleware check.
I think this is by design on how next/link works because of the prefetch thing.
Is there a workaround that we can use to trigger nextjs middleware manually with next/link ?
import Link from 'next/link'
<Link href="/admin">Admin</Link>
I think it does not skip checking, in reality it is already done when you prefetch, If you want to check authentication/authorization please use
<Link prefetch={false} />
(in my opinion, I see powerful in nextjs middleware and I would like to use the same as you but we used it we can't use the prefetch feature because there has a lot of bugs that I found.
add this to your response
response.headers.set(`x-middleware-cache`, `no-cache`);

NextJs custom server

I've set a custom server from the example but, my question is...
Can the server code access the NextJs code?
I mean, NextJs is built with webpack, therefore packed in its own context, so if I want to initialize something (let's say, database, logging system, etc.) in the server before NextJs has started, and then access it from NextJs... is it possible? I don't see how unless server code and NextJs code are in the same bundle, is it?
Yes, I guess there are some hacks that can be used, like importing files in runtime with __non_webpack_require__... but that seems like a hack (?) and only in one direction.
Any other better option?
If you use SSR in NextJS, you can access to APIs before rendering.
https://nextjs.org/docs/basic-features/data-fetching/get-server-side-props
If you export a function called getServerSideProps (Server-Side Rendering) from a page, Next.js will pre-render this page on each request using the data returned by getServerSideProps.
It fetches your data upon a user requesting your website everytime.
Thatmeans no matter what you build first on your server. Next.js will fetch for it every time. The comment above me sent the correct link. https://nextjs.org/docs/basic-features/data-fetching/get-server-side-props
TO view all data fetching techniques from next.js visit: https://nextjs.org/docs/basic-features/data-fetching/overview
PLease comment back to this to see if this helped, or if we missunderstood the question, so that we can help solve this issue, or if you resolved it. happy coding!

Firebase auth listener on nuxt

I'm a bit new to vue and nuxt, and I'm using firebase authentication with a custom token generation.
I'm looking for the best place to put the onAuthChange listener,
I'm trying to figure out if this should be implemented as middleware or maybe it could go somehow into the nuxt config
obviously, I want it to listen to the entire application all the time.
I found what I was looking for if someone else will ever encounter this question as well,
I've moved the listener to plugins and added the plugin to the nuxt.config.js file under the plugins section.

React on existing Wordpress site

I have a WP site working. It has everything rendered by using PHP files.
Now, I would like to change one page of my site to be based on React. Meaning one page-template that will execute react JS code instead of PHP. Can this be done?
I found that I can user WP-API, and that is great but can It be done in somekind of a hybrid mode?
If so, what do I do with webpack and node_modules? Will I have to navigate to the react template and run webpack run manually? Should I execute npm start on my production site?
I found tutorial showing how to use WP-API as backend server, but the React app is served on its own. I need the react app to be served by wordpress.
Help please
Regards, Ido
This is somewhat complex, but I think it's a two step process
Setup a develop environment for React, this can be done inside a wordpress project, but it would be much simpler to develop it in a side project.
Once you finished developing, you build a production version of your code(I.E, index.min.js) - this is a self contained file that should be a "plug and play". simply including this regular script tag in your page should start working.
The complex part is setting up an ES6 / Babel / React environment inside a wordpress project, but other than that, React will bundle into a browser-ready file that can be used directly inside a browser.

Resources