I am trying to get the names displayed of a ‘Crate’ (a crate full of records/albums), derived from a local JSON file. But it’s not showing up. Should I be using params? Should I have not stringified the JSON? VSC tells me Property ‘data’ does not exist on type String. Before this I received an error that crates.map is not
Tag: next.js
Nested routes authentication in NextJs
Is there any way we can Authenticate all the nested routes ? In my project I have routes which needs authentication and routes which can be accessible without authentication. For eg. /admin => needs authentication /admin/posts => needs authentication /admin/posts/1 => needs authentication /admin/users => needs authentication and so on.. /view => can access without authentication /view/songs => can access
NextJs doesn’t rerun scripts
When I use the <Link> tag in NextJs to navigate between pages it doesn’t rerun my scripts after changing pages. It only runs the scripts after the first page load or when I press reload. When using plain <a> tags instead, it works fine because the page reloads after each navigation. As far as I can tell this happens because
Should I use router.isReady when fetching with react-query?
Been stuck on this issue for some time now trying to retro fit react-query in to my codebase. I have a working version using getStaticProps. I have been experimenting with router.isReady from next/router to try and force the page to wait for the router.query value to be present before passing it as props to the react hook. Here is my
“ReferenceError: XMLHttpRequest is not defined” when using getServerSideProps() with NextJS
I’m trying out NextJS with SSR and I’m getting the following error when using the spotify-web-api-js library (witch works fine on the client side) to get a playlist’s data: The code inside the getServerSideProps is the following: Is there any way to fix this issue or should I use the “server” version for SSR (and have one more library with
Updating state inside child and using updated value in parent
I am trying to create a really basic header mini cart with cart item counter in NextJS. Im using the form state value in the header component and then using that value in the child components of the header where the numerical value is rendered. Currently I have the total item count show correctly when I submit my form and
Why my images converted to string when submitting post request?
see the screenshot . Why images getting corrupted? I am trying to upload images using axois post but axois post can’t processing my images correctly . My code divided in two part. First part where I writing logic for upload multi image and second part I am using it in my page component. first part this code for upload multi
Multiple conditions/operators to show/hide html elements in React (NextJS)
I’m looking to display some html in my React/Next.js web app based on conditional logic. I got the basics working but having issues showing the same html if multiple variable conditions are true. For example, the following code works fine. I’m having issues showing multiple variables as true. The following code doesn’t work but show the logic I’m after. I
I can’t import emotion js style with dynamic variable
I have a webpage that looks like this: This is my _app.tsx file: And this is shared/styles.js: Notice that blueOnBlack is an attempt to put the Futuristic Sci-Fi UI Web Framework style into its own importable variable. The problem is that when I put blueOnBlack into the _app.tsx as the style for the Futuristic Sci-Fi UI Web Framework div tag,
Persist the login state in Next js using localstorage
I’m writing an authentication application in Next Js (v12.2.5). The application also uses React (v18.2.0). The problem is with persisting the authentication state. When the browser is refreshed, the login session is killed. Why is this happening even though I am getting and setting the token in the local storage. I would like to persist the login session to survive