interface ResultType {
id: number;
userId: string | null;
pictureDiary: string;
recommendedGif: string;
sentiment: string;
positiveRatio: number;
negativeRatio: number;
neutralRatio: number;
date: string;
}
interface DateResultMap {
[date: string]: {
result: ResultType;
};
}
const data: DateResultMap = {
"2023-12-17": {
result: {
id: 1,
userId: null,
pictureDiary: "<https://example-bucket-seeun.s3.ap-northeast-2.amazonaws.com/14853cb0-cfa3-4d8f-a968-1a23ffc77455.jpeg>",
recommendedGif: "<https://jjalkey.com/link/1606607763512-2259e7e3ab.jpg>",
sentiment: "negative",
positiveRatio: 0.005106484,
negativeRatio: 99.98345,
neutralRatio: 0.011442319,
date: "2023-12-17",
},
},
// ... (다른 날짜에 대한 객체들)
};
근데 이걸 배열로 바꾸는게 나을거 같음.
next.config.js
에 해당 설정을 통해 아래와 같이 도메인을 등록
14버전이라 구글링 한 결과를 살짝 변형해서 사용
/** @type {import('next').NextConfig} */
const nextConfig = {
images: {
domains: ['media1.jjalkey.com', 'localhost'],
},
};
module.exports = nextConfig;
Image is missing required "src"
property src가 없을 수도 있는 상황에 대비하여 뜨는 에러 → src가 있을 때만 Image 태그를 사용
{post.file && (
<div>
<Image src={post.file} width={500} height={700} alt='image' />
</div>
)}
// 이런 식으로
Fetch request and response interceptor - LearnersBucket
커스텀으로 설정해줘야 할듯