유튜브: https://www.youtube.com/watch?v=TpVZjjAO3XE
깃허브:https://github.com/qjawns0222/caremaker/tree/next+ts9%EC%9D%BC%EC%B0%A8
import axios from "axios";
import { GetServerSideProps } from "next";
import { AppProps } from "next/app";
import React, { useEffect, useState } from "react";
import NavContainer from "../containers/navcontainer";
import num from "../data";
const App = ({ Component, pageProps }: AppProps) => {
const [data, Setdata] = useState();
useEffect(() => {
try {
axios
.get(
"https://raw.githubusercontent.com/qjawns0222/caremaker/next%2Bts-6%EC%9D%BC%EC%B0%A8/carddata.json"
)
.then((res) => {
Setdata(res.data);
});
} catch (e) {
console.log(e);
}
}, []);
return (
<>
<NavContainer />
{data && <Component data={data} {...pageProps} />}
<style jsx global>
{`
* {
text-decoration: none;
margin: 0px;
padding: 0px;
}
a {
color: inherit;
text-decoration: none;
}
`}
</style>
</>
);
};
export default App;
이렇게 해서{}이거롸 &&를 사용해서 data에 json내용이 담기면 해당 컴포넌트가 나오도록 해서 json데이터 설정을 완료 했습니다.
그리고 이제 제대롤 데이터를 가져오기위해 redux를 쓰기위해서 여러 공부를 했습니다.
기본적인건 됬고 wrapper는 대충 이해됬는데 combinereducer랑 차이를 공부해보고 initialstate를 json에서 가져오는걸 찾아보거나 직접 입력하거나 둘중 하나 해야될거 같아요.
'next+ts' 카테고리의 다른 글
next+ts 11일차 redux 에러수정 (0) | 2022.04.23 |
---|---|
next+ts 10일차 redux (0) | 2022.04.22 |
next+ts 8일차 json파일 _app.tsx (0) | 2022.04.20 |
next+ts 7일차 json파일 읽어오기 (0) | 2022.04.19 |
nest+ts 6일차 이때까지 한 거 정리 및 json (0) | 2022.04.18 |