이번주엔 4일동안 웹개발 미니 프로젝트를 진행하였다.
메인 페이지에서 데이터가 전체 표출 된 후 메인페이지의 표출된 데이터를 선택하면 선택한 데이터의 정보를 가지고 모달에서 데이터를 표출하는것을 구현하고자 했는데 console 에도 에러가 나오지 않고 어디 에서도 에러가 나오지 않아 원인을 알수 없어 2일 동안 헤맸다.
원인을 알기 위해 개발자 도구에서 네트워크에서 데이터가 전달 되고 있는지 확인하면서 데이터는 전달되었지만 화면에 표출이 되지 않았다는것을 알게 되었다.
왜냐하면 이미 메인페이지에서는 모든 데이터가 한꺼번에 표출 되었기 때문에 새로고침을 하는방식으로 표현하였다면 데이터가 제대로 표출이 되었을텐데 새로고침 하는 방식이 아닌 CSR 방식으로 표출하려고 하니 데이터가 브라우저에 표출 되지 않으면서 내부적으로 데이터는 가져왔지만 이미 표출이 되어있는 페이지에 다시 표출하려고 하니 표출이 되지 않는 것이였다.
ㅠㅠㅠㅠㅠ진짜 밤샘 2일동안 왜 안되는지 내가 코딩을 잘못했는지 모달 따로 데이터 가져오는 부분 따로 코딩을 하면 잘 표출되는데 왜 어디부터 문제인지 감을 잡지 못해서 너무 힘들었다.
아 내가 아직 많이 지식이 부족하구나 라는 생각도 들었다.
그래도 한편으론 부족한 만큼 공부할 것들이 생겨 그것을 공부하는데에 있어서 재밋고 신기하고 보람찼다.
그러하여 이번 프로젝트를 하게 되면서 알게 된것은 SSR 과 CSR 과 콜백함수에 대해서 공부를 해야겠다는 생각이 들었다.
SSR 이란 Server Side Rendering 으로
서버로부터 완전하게 만들어진 html파일을 받아와 페이지 전체를 렌더링 하는 방식이다.
즉 서버에서 데이터까지 포함해서 페이지를 구성하는 것을 말한다.
서버 사이드 렌더링의 단점으로는 새로운 요청이 생길때마다 바뀌지 않아도 되는 부분까지 다시 데이터를 가져와 페이지에 표출한다는 것이였다.
CSR 이란 Client Side Rendering 으로 사용자의 요청에 따라 필요한 부분만 응답 받아 렌더링 하는 방식으로 변경된 부분과 관련된 데이터만 가져온다고 한다.
라는 것을 알게 되어 다음번에 구현을 할때는 어떻게 구현을 해야하고 어떻게 대처해야할지에 대해서 알게 되었다.
자바스크립트를 공부하면서 요약 및 정리를 하면서 cil 를 작성했는데 너무 정리가 되지 않는것 같아서 cil wil 을 같이 모아서 관리를 해야겠다.