Search
🟢

bb7.1.1.2_1.2.1_1. title: 단일 페이지 애플리케이션(‣) 구현을 위한 클라이언트 사이드 렌더링(‣)특화 프론트엔드 자바스크립트 프레임워크는 본인의 소스코드를 유저에게 함께 제공한다.

생성
🚀 prev note
♻️ prev note
🚀 next note
♻️ next note
bb7.1.1.2_1.2.1_2. title: 서버 사이드 렌더링(‣)의 장점(로딩속도, SEO)을 가져와 단일 페이지 애플리케이션(‣)을 구현할 수 있다(‣).
bb7.1_3. title: 정적 웹 페이지는 피치 크러쉬, 모히또 라임, 블루 하와이, 피냐 콜라다를 파는 칵테일집에서 이 네 가지 종류의 칵테일들을 미리 다 만들어서 냉장고에 넣어 뒀다가 손님이 주문하면 냉장고에서 꺼내 주는 것이다. 서버 사이드 렌더링은 손님이 피치 크러쉬를 주문하면 피치 크러쉬를 만들어 주고, 손님이 다음에 블루 하와이를 시키면 블루 하와이를 또 주는 것이다. 클라이언트 사이드 렌더링은 그냥 칵테일의 베이스들, 과일들이랑 레시피들을 줘버리고 니가 만들라고 시키는 것이 마치 모히또하우스같은 것이다.
14 more properties
그림(참고3)
Fetch API 를 이용한 SPA 에서 index.html 을 확인해보는 경우(좌)
그림(참고4)
Vue.js 를 이용한 SPA, VSCode 창의 좌측이 index.html 이다.
클라이언트 사이드 렌더링 페이지의 ‘소스 보기’(to3:페이지 검사와 소스 보기는 다르다!) 를 눌러보면 위 사이트처럼 껍데기만 보인다(참고3). 다양한 자바스크립트 프론트엔드 프레임워크(from1)들 중, 단일 페이지 애플리케이션(Single Page Application (SPA)) 구현을 위한 클라이언트 사이드 렌더링(Client side rendering (CSR)) 특화 프론트엔드 프레임워크는(참고2:SPA=CSR은 아니다) 유저 컴퓨터에서 렌더링 작업(from2)을 진행 하기 위해 유저가 작성한 소스코드뿐 아니라 본인의 소스코드(참고1,5)를 유저에게 함께 제공한다(from3).
parse me : 언젠가 이 글에 쓰이면 좋을 것 같은 재료들.
1.
None
from : 과거의 어떤 생각이 이 생각을 만들었는가?
1.
2.
3.
supplementary : 어떤 새로운 생각이 이 문서에 작성된 생각을 뒷받침하는가?
1.
None
opposite : 어떤 새로운 생각이 이 문서에 작성된 생각과 대조되는가?
1.
None
to : 이 문서에 작성된 생각이 어떤 생각으로 발전되고 이어지는가?
2.
3.
참고 : 레퍼런스