I am passing data via link component like this: And getting this URL http://localhost:3000/this-is-a-title?id=630f3c32c1 Is there any other way to do the same but get rid of that ? and everything after it for better SEO? Answer You could build your path like so: or any other format that works in your case e.g. With React Router Dom you should
Tag: next.js
How to set a redux toolkit initial state to an array of object or localstorage with typescript?
i’m currently trying to set an initialState (items) to an array of object or the same thing from the localStorage. The problem is, that i’m receiving this kind of error. Type ‘number’ is not assignable to type ‘{ id: string; price: number; quantity: number; totalPrice: number; name: string; }[]’.ts(2322) cart.ts(4, 3): The expected type comes from property ‘items’ which is
Why It shows Undefined when I try Access object in array in Next js
I’m trying to display sub Products of the main product so what I have tried is to get the product code from the URL and try to fetch sub-products that match the main product code the issue is it shows Undefined when I try implement like {subProducts.title} but when I console.log(subProducts) I get Array of subProducts that match with the
Having trouble writing form input to a seperate file in Javascript, Node.js, React.js, Next.js
I have been having a tough time writing form input to a seperate file in Javascript. I posted a repo with a demo I set up to show the problem I have been having! Feel free to take a look. https://github.com/projectmikey/projectmikey-cant-write-to-api-dir-stackoverflow The app works fine locally from both “next dev” and “next start” when I end up at a http://localhost:3000
How can I setState of specific Switch created dynamically by a map?
I have Switches created dynamically by a map like this: https://i.imgur.com/KuwY5Bb.png By this code: And it’s works but when I click one Switcher all switchers change together. This is happening because all Switches are created with the same “reference” enabled. How I set an individual var to each Switcher without Hardcoding individuals [enabled, setEnabled] to each one (I have more
JS/React/Next load image from mirror after timeout
I have opted to host all of my images for a site on IPFS, they are pinned fine. This reduces traffic and costs from my hosting provider to within the free tier. Sometimes the IPFS url does not load fast enough, as it depends on where the user is, and CDNs that claim to cache IPFS results have not been
middleware.js in nextjs doesn’t work at all
(Next v.12.2.3) No matter what I code, pages/middleware.js seems not running at all! I wanna redirect uppercase urls to lowercase urls. what should I do? Answer The documentation says: Create a middleware.ts (or .js) file at the same level as your pages directory So it shouldn’t be inside pages/, but in the same directory as pages/.
Pass array value to getStaticProps in Next js
I’m doing fetch request to get my Youtube playlist. and in doing so i used getStaticProps(), the problem I’m facing is that my playlist depends on my array of objects result. the array of objects structure is in my ./utils/playlists.js file. what i want to achieve is that instead of getting my const MY_PLAYLIST = process.env.YOUTUBE_PLAYLIST_ID; from my .env.local file
Two-second timeout not being respected by function on NextJS site
I have an ‘image slide show’ implementation which cycles among images every two seconds. It does so by changing their display types from “none” to “block”. At the top of my .js file, the showSlides function is defined: From here, I create four items, and call the showSlides function from within the HTML of the Home() function, which is located
How to layer a image underneath components in React NEXT.JS
I’m trying to make a website and using this Canadian politicians site as a reference. I like how his navbar and join components layer on top of his picture, and how his picture is a fixed length and resizing the window resized the picture only a little bit based on the layered components but also keeps the aspect ratio correct