sanity-io / create-react-app-blog Goto Github PK

I followed the tutorial but the code in this project is 2 years old and doesn't seem to work with newer installations of react-router-dom.

Given the current App.js and "react-router-dom": "^6.3.0", I get this error:

[Error] Error: A <Route> is only ever to be used as the child of <Routes> element, never rendered directly. Please wrap your <Route> in a <Routes>.
	performReactRefresh (bundle.js:46405)
	(anonymous function) (bundle.js:761)

First of all, pretty good guide. I was able to follow from start to finish and it worked out just fine. Just wanted to point out that if you have a blog post without a main image, the img tag below, which is found in the AllPosts.js file will throw an error.

<img
    className="w-full h-full rounded-r object-cover absolute"
    src={post.mainImage.asset.url}
    alt=""
/>

A possible fix for it is to check for undefined first, before rendering the img tag. Something like this:

{typeof post.mainImage !== 'undefined' && <img className="w-full h-full rounded-r object-cover absolute" src={post.mainImage.asset.url} alt="" />}

After running npm run start the site loads at http://localhost:3000 but is stuck in an endless refresh loop.
I'm running the code from this repo with no modifications.