상수 데이터란?
변하지 않는 데이터.
사용하는 이유?
추후 유지보수를 위해서 사용.
반복 되는 UI를 상수 데이터+Array+map() 함수의 조합으로 표현 가능.
즉,상수 데이터에 해당 되는 부분만 변경 하면 되니 유지보수가 보다 편리해짐.
상수 데이터의 특징?
상수 데이터는 별도의 JS 파일로 분리 하고 필요한 파일 내부에서 선언하고 사용 가능하다.이럴 경우는 export/import를 통해서 파일을 사용해야한다.
상수 데이터라는 것을 표시하기 위해서 대문자+snake case를 사용하여 변수 이름을 짓는.
mock data란?
거짓된 데이터. 실제 API에서 받아온 데이터가 아닌 필요에 의해 만들어 본 데이터.
그래서 이것을 왜 사용하는걸까?가짜인데? 라고 생각할 수 있겠지만, 백엔드에서 데이터가 만들어지기 전에 그 데이터를 어떻게 예쁘게 포장할지 미리 만들어주는 것이다. 그렇기에 어디에 어떻게 배치되고 또 구현해야하는지와 같은 작업을 하기 위해 mock data를 사용하는 것이다.
둘의 차이는 : 상수 데이터는 바로 사용 가능하고 mock data 같은 경우는 fetch를 통해 불러와야한다.
mock data 활용 예제.
→백엔드 API 개발이 완료되지 않을 수 있기 떄문에 이런 경우 mock data를 활용하여 모방 할 수 있다. 이 때 API를 모방하기 위해서 백엔드 API에서 응답값의 형태인 json 파일로 만들어야 한다.
map 메서드 : 배열을 돌면서 하나씩 들고와서 그것을 결과 내기.
새로운걸 return 하게 된다.
peer review : 서로의 서로의 코드를 보고 리뷰 해주는거.
✍✔ 사실 꽤 오래전에 임시글로 작성한 내용이지만 감이 잘 잡히지 않았다.
내 스타일로 그냥 간결하게 moak data는 구라 데이터야~ 라고 생각만 했다.하지만 이번 프로젝트에서 이 moak data의 소중함을 깨달았다. 역시 백번의 이론 보다는 부딪히는게 나에게는 가장 확실한 지침서 같다....😁
이 moak data도 잘 맞춰야한다.예를 들어,쇼핑몰을 구상한다고 가정하고 해당 상품에 대한 이미지와 이름 가격이 내가 작성한 moak data와 백엔드분이 작성한 데이터가 불일치 확률이 높기 때문이다.
나는 상품 이미지의 제목을 title로 해놨는데 백엔드분은 name으로 설정 했었다. 그래서 moak data를 수정했다 ㅎㅎㅎ...대공사는 아니었지만 미리 맞췄다면 분명 수정하는 시간이 없었을 것이다.
이러한 이유로 백엔드분들과 소통이 매우x100 중요한 것이고 백엔드는 프론트에서 어떤 것을 요청 하는지 또 우리는 정확히 어떤 것을 요청해야하는지 점점 알아가는 시간이었다.
무엇보다 moak data의 소중함을 알아서 좋았다.
