이미지가 불러지지 않는데 무슨 문제 일까요?

[뿌뿌]

/*eslint-disable */
import React,{useState} from 'react';

import { Route,Routes,Link,Switch } from 'react-router-dom';

// import 사진1 from '../../public/academy/photo1.png';
// import 사진2 from './academy/photo2.png';
// import 사진3 from './academy/photo3.png';

import detail from './detail.js';
import data from './data.js';
import './ReviewMain.css';

 

function ReviewMain(){

  let [shoes,shoes1] = useState(data);
 
  return(
  <div className='main'>
   
<div className='headline'>
  <h3>기관검색</h3>
  <hr/>
  </div>
  {/* <Routes>
      <Route exact path ="/" element={<detail/>}/>
      </Routes> */}
 
   <div className='container'>
    <div className='row'>
      {
        shoes.map((a,i)=>{
          return <Card shoes={shoes[i]}  key={i}/>
        })
      }
    </div>  
     </div> 
  </div>
  )
}
function Card(props){
  return(
    <div>
      <div className="col-md-4" >
     
        <h4>{props.shoes.title}</h4></div>
    </div>
  )
}
export default ReviewMain;

data.js

 

export default [
    {
      id : 0,
      title : "멀티캠퍼스",
      content : "Born in France",
      price : 120000
    //   image : "./academy/photo1.png"

     
    },

[뿌뿌]

일단은 코딩애플님처럼 깃허브에 이미지서버만들어서 불러왔습니다

근데 data.js에 있는 이미지는 구글폼에서 왜 읽혀지지 않는지 궁금합니다.

[codingapple]

./어쩌구 경로를 그냥 문자로 입력하면 잘 안될 수 있습니다

<img src={require('./경로')} 이래보거나 합시다 

[글쓴이]

글