Mock data
-
상수 데이터JavaScript 2022. 4. 24. 15:50
개발을 할 때, UI 구성에 필요한 데이터가 정적이라면 데이터를 서버에서 가져오지 않고 프론트 단에서 직접 구성합니다. 서버에서 받아야 하는 값이고, 아직 백엔드에서 넘겨줄 데이터를 완성하지 않았다면 서버에서 받을 값을 예상해서 개발을 진행할 수 있어야 한다. 이 때, UI를 표시하기 위한 상수 데이터 와 백엔드의 데이터를 모방하기 위한 mock data 를 사용해보자. 상수 데이터 UI 구성에 필요하지만 동적으로 변하지 않아 백엔드 API 등을 통해 가져올 필요가 없는 정적인 데이터 => 상수 데이터로! 상수 데이터를 사용하는 이유? 반복되는 UI를 유지보수하기 쉽고, 가독성을 높이기 위해. 반복되는 UI = 상수 데이터 + Array.map() 를 이용해서 간결하게 표현 수정 필요시, 상수 데이터의 ..
-
Mock dataJavaScript 2022. 4. 20. 17:45
Mock data? '가짜의' 란 뜻을 가진 mock의 의미를 가진 mock data는 샘플 데이터라고 볼 수 있다. 실제 API에서 받아온 데이터가 아닌 프론트엔드 개발자가 필요에 의해 샘플로 만들어 본 데이터 mock data는 실제 백엔드의 API의 응답값 형태인 json 파일로 만들어줘야 한다. Mock data를 사용하는 이유? 프론트에서 필요한 백엔드의 API가 아직 완성이 안되었을 때, 데이터를 기다리는 게 아니라 mock data를 만들어 상황에 미리 대비하고 의도한 대로 UI가 구현되는지 확인해야 하기 때문에 사용한다. 또한, mock data를 만드는 과정에서 백엔드에서 보내주는 데이터의 형식를 맞춰보면서 미리 확인한다면 수월하게 연결할 수 있다. mock data 생성 & 호출 moc..