본문 바로가기

food-app2

[food-app] React Query를 사용해 Infinite scroll 구현하기 React Query의 Infinite scroll: 무한 스크롤을 지원하고, 화면 스크롤을 통해 추가 데이터를 자동으로 로드할 수 있는 강력한 기능 제공• data: Infinite Query 결과 데이터• data.pages: 가져온 페이지들의 배열• data.pageParams: 페이지를 가져오기 위한 페이지 매개 변수. 배열의 형태.• fetchNextPage, fetchPreviousPage: 다음 페이지 및 이전 페이지의 데이터를 가져오는 함수• getNextPageParam, getPreviousPageParam: 다음 및 이전 페이지에 대한 매개 변수를 생성하는 함수• hasNextPage, hasPreviousPage: 다음 페이지 및 이전 페이지가 있는지 여부를 나타내는 불리언 값• i.. 2024. 10. 20.
[food-app] next.js에서 getStaticProps 사용 하다가 마주친 에러 에러 발생 상황data.json파일을 직접 import하는 방법 대신 서버에 요청해서 받아오려고 코드를 수정했다. next.js에서 getStaticProps를 사용해서 데이터를 받아오기 위해 아래와 같이 코드를 작성했다.export async function getStaticProps() { const stores = await fetch( ${process.env.NEXT_PUBLIC_API_URL}/api/store ).then((res) => res); return { props: { stores }, revalidate: 60 * 60, };}에러 원인데이터를 받아서 json으로 바꿔주는 작업을 하지 않아서 데이터를 인식할 수 없었던 것이었다. 그래서 json으로 바꿔주는.. 2024. 10. 7.