When I upload any thing in the ABouts via Sanity it is not showing in the website.
This is the backend:
This is the client.js file:
`import { createClient } from '@sanity/client'
import imageUrlBuilder from '@sanity/image-url'
export const client = createClient({
projectId: process.env.SANITY_PROJECT_ID,
dataset: 'production',
apiVersion: '2022-02-01',
useCdn: true,
token: process.env.SANITY_PROJECT_TOKEN,
ignoreBrowserTokenWarning: true,
})
const builder = imageUrlBuilder(client)
export const urlFor = (source) => builder.image(source)
`
This is the About.jsx file:
`import React, {useState, useEffect} from 'react'
import { motion } from "framer-motion"
import { images } from '../../constants'
import {client, urlFor} from '../../client'
import './About.scss'
const About = () => {
const [abouts, setAbouts] = useState([])
useEffect(() => {
const query = '*[_type == "abouts"]'
client.fetch(query)
.then((data) => {
setAbouts(data)
})
}, [])
return (
<>
I know that Good Design
means Good Business
<div className='app__profiles'>
{abouts.map((about, index) => (
<motion.div
whileInView={{ opacity: 1}}
whileHover={{ scale: 1.1}}
transition={{ duration: 0.5, type: 'tween'}}
className='app__profile-item'
key={about.title + index}
>
<img src={urlFor(about.imgUrl)} alt={about.title}/>
<h2 className='bold-text' style={{ marginTop: 20}}>{about.title}</h2>
<p className='p-text' style={{ marginTop: 10}}>{about.description}</p>
</motion.div>
))}
</div>
</>
)
}
export default About`