garage mypage 구현

파일구조의 시작부터 이해

내가 구현해낼 페이지에서 그려낼 내용을

내가 만들페이지에서 필요한게 뭔지 찾고, 거기에 컨테이너가 필요하면 관련 컨테이너파일을 만들어준다.

그리고 그것들은 전부 index.js에서 관리하기로했으니 경로설정을 해주고 페이지에서 import해서 불러온다.

 

<mypage>

로그인페이지는 정보를 게시판 여러군데에서 불러오기 때문에 컴포넌트안에서 관리하는게 아니라

따로 분리해서 관리해서 불러와줘야된다. 단독관리 (컨택스트에이피아이)= 리덕스

 

useEffect (() => {

}, [] 구조이고 []의 값을 참조해서 변경사항 내용이 있을때마다 값을 계산해서 실행시켜준다.

그리고 빈 배열을 일때만 한번만 실행된다.(외부api에서 데이타값을 받아올때 많이 쓴다.)

 

로그인상태를 전체에서 관리 그거를 가져와야된다. mypage를 만들고 있는 중 이니까

로그인프로바이터 로그인스테이터스로 상태를 관리한다.

컨텍스트를 하나로 관리하는데 그걸 다른애들한테 줄 때 프로바이더를 사용해서 그 안에 감싸야된다.

그래야 props를 받을수 있다. 그때주는 이름이 value 이고 value props

벨류라는객체인데 그안에 로그인 스테이터스가있다.

그래서 중괄호로 꺼내온다. 객체로 생겼으니까 객체를 구조분해할때는 중괄호를 사용하니까

내가 꺼내온것들의 값이 맞는지 콘솔로그로 확인해서 불러와지는지 확인

 

패치데이터 아이작스 라이브러리를 불러와서 데이터를 서버에 요청한다.

언디파인드가 나오면 내가 실수한거 잘 불러오고 있는지 계속 찍어본다.

요청만하는애인데 주는것을 받아오고, 요청하고 받아오기 때문에 패치데이터이다.

 

 

post ,put은 데이터가 있다.

가져올거니까 get인데 유저id니까 민감한정보니까 post

data에 user_Id를 가져온다.

 

배열에 노란색에러뜨면 퀵픽스누르고 불러와서 에러안뜨는지 확인

길을못찾으니까길을파줘야된다.

route.js에서  길을 파줘야된다.

 

rep 리퀘스트, res 리스펀스

데이터를 객체형식 키:벨류 형태로 준다.

요청에 반응하는 경로와 페이지가 있다는거다.

리퀘스트안에담겨있는애들이 엄청 많다.

우리가 필요한건 body에있다. post가 body에있음

body: { user_Id: 'pathas'},

const {user_Id} =req.body;

이제 이게 컨트롤러라는 부분

약간 징검다리같은 요청이랑 응답이랑 지나갈수 있게

서로 이어주는 부분 건너갈 수 있게

그래서 다음으로 모델에 가야된다.

model.users.user(user_Id, result => {
if문을 사용해서 있으면 불러오고 아니면 말고

}

 

model.js에서 user: (datia, callback) => {

console.log(data);

firestore.collction("users")

아이디랑 콜백함수

아이디를 모델한테주고 디비에서 확인하고 그것을 클라이언트에 보내줘야된다.

데이터가 내 아이디이다. data

조회를 했는데 데이터가 없을수도 있고, 변수가 있으니 0일때는 false로 하고

0보다 클 때에는 데이터를 조회해서

 

여기에서 콜백역할이 데이터가서

 

데이터를 다 꺼내면 위에만든 페이지구문이랑 오류가 날 수 있으니

데이터라는 객체안에서만 한번 꺼내오자

 

상태를

 

마이페이지컨테이너스는 데이터만 받아오는거

조금은 뭐 인라인정도 받아오는것 정돈 괜찮겟지

 

export {UserTable} from "./

 

<UserTable user_id={user_Id}>

 

 

곁에잇는애들을 웨퍼 

tr*3 td*2